Search code examples
phpjqueryhtmlajaxajaxform

Cannot able to fetch data from ajax to php page


I design a simple page were user can put name, password and image using html. I try to sent those data using ajax to specific php page, but I cannot implement this. how I do this thing

Html code

<?php include('connection.php'); ?>         
    <form id="form" enctype="multipart/form-data">
        <table>
            <tr>
                <td>Name:</td>
                <td><input type="name" id="name"></td>
            </tr>
            <tr>
                <td>Password:</td>
                <td><input type="password" id="pass"></td>
            </tr>
            <tr>
                <td>Photos:</td>
                <td><input type="file" id="photos"></td>
            </tr>
            <tr>
                <td><input type="submit" id="go"></td>
            </tr>
        </table>
    </form>

Jquery and ajax

<script>
    $(document).ready(function(){
        $('#go').click(function(){      
            var img_name = $('#img_name').val();
            var name = $('#name').val();
            var pass = $('#pass').val();  
            $.ajax({   
                type : "POST",
                url : "singup_submit.php",
                data : { img_name:img_name, name:name, pass:pass},
                success : function(done){
                    alert(done);
                }    
            });    
        });
    });
</script>

Php code

<?php
    include('connection.php');    
    if(isset($_POST)){   
        $name = $_POST['name'];
        $pass = $_POST['pass'];
        $img_name=$_FILES['img_name']['name'];

        $qr="INSERT INTO data (name,pass,img_name) VALUES ('$name','$pass','$img_name')";
        $ex=mysqli_query($con,$qr) or die(mysqli_error($con));    
        if($ex==1)
            echo 'done';
        else            
            echo 'not done';
}

Solution

  • Follow this code ..It may help you

    <script>
        $(document).ready(function(){
            $("#go").click(function(){
                var name    = $("#name").val();
                var pasword = $("#password").val();
                var photos  = $("#photos").val();
                if(name==''||pass==''||photos==''){
                  alert("Please Fill All Fields");
                }
                else{
                  $.ajax({
                    type   : "POST",
                    url    : "singup_submit.php",
                    data   : formData,
                    cache  : false,
                    success: function(result){
                    alert(result);
                    }
                  });
                }
                return false;
            });
          });
      </script>