以表单形式附加新元素，并将其值发布在PHP中，然后将其保存在数据库中 - Append new elements in form and post it values in PHP and save it in database

Append new elements in form and post it values in PHP and save it in database

基本上，我想做的是在表单中动态地添加元素，并使用PHP将它们的值保存到MySQL中。到目前为止，我已经开始添加，但我不知道如何发布它们的值。。以下是我迄今为止所做的：

<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js" ></script>
<script> 
 $('document').ready(function(){ 

 $('#save').live('click',function(e){ 
   /*
   this should be the function that gets and post all elements in php 
   */  
   //maybe the use of $.post or .load() or ajax
}); 
$('#add').click(function(){
$("<br><input type='text' class='do'name='do'>").appendTo('form');
});
}); 
 </script></head>
<body>
<form> //this was the form that im appending
<input type='text' class='do' name="do"><br> 
<input type='text' class='do' name="do"><br> 
<input type='text' class='do' name="do"><br> 
</form>
<input type='button' id='add' value='[+]'>
<input type='button' id='save' value='go2'><br>

<div id='res'></div>
</body>
</html>

我想使用php将所有值保存在数据库中，因此这里的示例是php

<?php
//
mysql_query("INSERT <blablabla HERE>");
?>

请帮我拿这些东西。。。谢谢

我认为一个简单的代码片段可以回答这个问题：

HTML:

<form method="post">
    <input type="submit" id="btn_submit">
</form>

JQuery:

$("#btn_submit").mousedown(function() {
    $("form").append("<input name='foo' value='bar'>");
});

PHP:

$myValue = $_POST["foo"];
mysql_query("insert into myTable (foo), ($myValue)");

每次添加单击时，都需要对页面进行ajax调用，在该页面（ajax调用的页面）将执行mysql插入。

考虑使用Jquery.ajax

与其在将信息保存到数据库时尝试附加表单，不如直接从数据库中提取列表（包含所有有效值），然后在"附加"之后使用AJAX重新加载，这将通过编程将值添加到数据库的末尾。哇！问题解决了。

请参阅jquery表单插件。http://jquery.malsup.com/form/

这里的表单是使用ajax提交的，所以它不会刷新表单，而且你会得到所有的值，就像php做一样

将表单文本框的名称'do'更改为do[]

 $('#save').live('click',function(e){ 
   /*
   this should be the function that gets and post all elements in php 
   */  
   //maybe the use of $.post or .load() or ajax
}); 
$('#add').click(function(){
$("<br><input type='text' class='do' name='do[]'>").appendTo('form');
});

<form> //this was the form that im appending
**<input type='text' class='do' name="do[]"><br> 
<input type='text' class='do' name="do[]"><br> 
<input type='text' class='do' name="do[]"><br>** 
</form>
<input type='button' id='add' value='[+]'>
<input type='button' id='save' value='go2'><br>