ajax和php输入多个表单输入到数据库

Question

ajax和php输入多个表单输入到数据库我有一个PHP生成的表单，其中包含多个输入字段，其数量由用户选择确定。我想使用ajax函数将所有数据输入数据库。问题是我是ajax的新手，并不确定如何去做。下面的ajax javascript函数是我想要实现的一个示例，我知道它不正确。有人能指出我正确的方向。我环顾四周，从我看到的情况来看，Json可能是一个解决方案，但我对它一无所知并且阅读它我仍然没有得到它。样本ajax：function MyFunction(){var i = 1;var x = $('#num_to_enter').val();    while (i <= x){     var name = $('#fname[i]').val();     var lname = $('#lname[i]').val();     var email = $('#Email[i]').val();     i++;  }     $('#SuccessDiv').html('Entering Info.<img src="images/processing.gif" />');      $.ajax({url : 'process.php',     type:"POST",    while (i <= x){     data: "fname[i]=" + name[i] + "&lname[i]=" + lname[i] + "&email[i]=" + email[i],     i++;  }      success : function(data){     window.setTimeout(function()     {     $('#SuccessDiv').html('Info Added!');     $('#data').css("display","block");     $('#data').html(data);     }, 2000);         }});         return false;           }表格样本：<?php    echo "<form method='post'>";    $i=1;     while($i <= $num_to_enter){     $form_output .= "First Name:     <input id='fname' type='text' name='fname[$i]'><br />      Last Name:     <input id='lname' type='text' name='lname[$i]'><br />     Email:     <input id='Email' type='text' name='Email[$i]'><br />     $i++;    }    echo"<input type='button' value='SUBMIT' onClick='MyFunction()'></form>";   ?>Then DB MySQL Sample   <?php       while ($i <= $x){     $x = $_POST['num_to_enter'];     $fname = $_POST['fname[$i]'];     $fname = $_POST['fname[$i]'];     $fname = $_POST['email[$i]'];         $sql = "INSERT INTO `mytable`      (`firstname`, `lastname`, `email`) VALUES ('$fname[$i]', '$lname[$i]', '$email[$i]');";     $i++;     }    ?>

Answer 1

这是一个简单的AJAX演示：

HTML

<form method="POST" action="process.php" id="my_form">

    <input type="text" name="firstname[]">

    <input type="text" name="firstname[]">

    <input type="text" name="firstname[]">

    <input type="text" name="firstname[custom1]">

    <input type="text" name="firstname[custom2]">

    <br><br>

    <input type="submit" value="Submit">

</form>

jQuery的

// listen for user to SUBMIT the form

$(document).on('submit', '#my_form', function(e){

    // do not allow native browser submit process to proceed

    e.preventDefault();

    // AJAX yay!

    $.ajax({

        url: $(this).attr('action') // <- find process.php from action attribute

        ,async: true // <- don't hold things up

        ,cache: false // <- don't let cache issues haunt you

        ,type: $(this).attr('method') // <- find POST from method attribute

        ,data: $(this).serialize() // <- create the object to be POSTed to process.php

        ,dataType: 'json' // <- we expect JSON from the PHP file

        ,success: function(data){

            // Server responded with a 200 code

            // data is a JSON object so treat it as such

            // un-comment below for debuggin goodness

            // console.log(data);

            if(data.success == 'yes'){

                alert('yay!');

            }

            else{

                alert('insert failed!');

            }

        }

        ,error: function(){

            // There was an error such as the server returning a 404 or 500

            // or maybe the URL is not reachable

        }

        ,complete: function(){

            // Always perform this action after success() and error()

            // have been called

        }

    });

});

PHP process.php

<?php

/**************************************************/

/* Uncommenting in here will break the AJAX call */

/* Don't use AJAX and just submit the form normally to see this in action */

// see all your POST data

// echo '<pre>'.print_r($_POST, true).'</pre>';

// see the first names only

// echo $_POST['firstname'][0];

// echo $_POST['firstname'][1];

// echo $_POST['firstname'][2];

// echo $_POST['firstname']['custom1'];

// echo $_POST['firstname']['custom2'];

/**************************************************/

// some logic for sql insert, you can do this part

if($sql_logic == 'success'){

    // give JSON back to AJAX call

    echo json_encode(array('success'=>'yes'));

}

else{

    // give JSON back to AJAX call

    echo json_encode(array('success'=>'no'));

}

?>

Answer 2

var postdata={};postdata['num']=x;
   while (i <= x){
    postdata['fname'+i]= name[i];
    postdata['lname'+i]= lname[i];
    postdata['email'+i]= email[i];

    i++;}
 $.ajax({url : 'process.php',
    type:"POST",
    data:postdata,
    success : function(data){
    window.setTimeout(function()
    {
    $('#SuccessDiv').html('Info Added!');
    $('#data').css("display","block");
    $('#data').html(data);
    }, 2000);
        }});

PHP

$num=$_POST['num'];for($i=1;i<=$num;i++){
 echo $_POST['fname'.$i];
 echo $_POST['lname'.$i];
 echo $_POST['email'.$i];}