jQuery，Ajax和PHP提交多种形式的困境 [英] jQuery, Ajax & PHP submit multiple forms dilemma

问题描述

<!-- this is my jquery -->

<script>
    $(document).ready(function(){
$("form#submit_wall").submit(function() {

var message_wall = $('#message_wall').attr('value');
var id = $('#id').attr('value');
$.ajax({
type: "POST",
url: "index.php?leht=pildid",
data:"message_wall="+ message_wall + "&id="+ id,
cache: false,

success: function(){
$("ul#wall").prepend(""+message_wall+"", ""+id+"");
$("ul#wall li:first").fadeIn();

alert("Thank you for your comment!");
}
});
return false;
});
});
</script>

<!-- this is my HTML+PHP -->
some PHP ...
      while($row_pilt = mysql_fetch_assoc($select_pilt)){

       print 

<form id="submit_wall">
<label for="message_wall">Share your message on the Wall</label>
<input type="text" id="message_wall" />
<input type="hidden" id="id" value="'.(int)$row_pilt['id'].'">
<button type="submit">Post to wall</button>
</form>

下面是我的PHP脚本， 写入mySQL.

and down below is my PHP script that writes to mySQL.

这是一个非常简单的脚本.但是，提交时变得有点复杂.由于我的页面上有多个表单(每个WHILE PHP LOOP)，因此在我提交时-仅提交了FIRST表单.此外，我提交的其他任何后续表单-数据都是从第一个表单中复制的. 有没有清除数据的jQuery函数? -还是有更好的解决方案.

It is a pretty straight forward script. However, it is getting little complicated when I submit it. Since I have more than one form on my page (per WHILE PHP LOOP), thus when I submit - only the FIRST form gets submitted. Furthermore, any other subsequent forms that I submit - data is being copied from the first form. Is there any jQuery functions that clear the data? - or is there a better solution.

谢谢， 尼克

推荐答案

这是因为您要为每个表单赋予相同的ID，因此它会提交使用该ID找到的第一个元素，即第一个表单.您应该做的是为每个表单分配一个唯一的ID，然后为每个表单提供一个AJAX提交功能，该功能可以提交特定于表单的数据.您可以使用jQuery的$ .each()函数循环浏览所有表单，并使用Submit函数中的$(this).attr('id')来检索特定于表单的ID.

It's because you're giving each form the same id, and thus it is submitting the first element it finds with that id, i.e. the first form. What you should do is assign a unique id to each form, and then give each form an AJAX submit function that submits the form-specific data. You can use jQuery's $.each() function to loop through all the forms and $(this).attr('id') within the submit function to retrieve the form-specific id.

更新:正如对此答案的评论所揭示的，您实际上不需要each()函数，因为jQuery始终将其应用于每个表单元素.

UPDATE: As revealed by the comment on this answer, you actually don't need the each() function because jQuery applies it to every form element anyway.

这将是一个示例脚本:

$(document).ready(function(){
    $("form").submit(function() {
        var message_wall = $(this).children('input[type="text"]').attr('value');
        var id = $(this).children('input[type="hidden"]').attr('value');
        $.ajax({
            type: "POST",
            url: "index.php?leht=pildid",
            data:"message_wall="+ message_wall + "&id="+ id,
            cache: false,
            success: function(){
                $("ul#wall").prepend(""+message_wall+"", ""+id+"");
                $("ul#wall li:first").fadeIn();
                alert("Thank you for your comment!");
            }
        });
       return false;
   });
});

这篇关于jQuery，Ajax和PHP提交多种形式的困境的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！