jQuery,Ajax& PHP提交多种形式的困境

时间:2010-12-29 20:33:04

标签: php jquery forms

这是我在网上找到的一个非常简单的表单(因为我是一个jQuery初学者)。

<!-- 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。

这是一个非常简单的脚本。但是,当我提交它时,它变得越来越复杂。由于我的页面上有多个表单(每WHILE PHP LOOP),因此当我提交时 - 只提交FIRST表单。此外,我提交的任何其他后续表单 - 数据正在从第一个表单中复制。 是否有任何jQuery函数可以清除数据? - 或者是否有更好的解决方案。

谢谢, 尼克

2 个答案:

答案 0 :(得分:1)

这是因为您为每个表单提供了相同的ID,因此它正在使用该ID提交它找到的第一个元素,即第一个表单。您应该做的是为每个表单分配一个唯一的ID,然后为每个表单提供一个AJAX提交函数,该函数提交表单特定的数据。您可以使用jQuery的$ .each()函数遍历所有表单,并在提交函数中使用$(this).attr(&#39; id&#39;)来检索特定于表单的ID。< / p>

更新:正如对此答案的评论所揭示的那样,您实际上并不需要each()函数,因为jQuery无论如何都会将它应用于每个表单元素。

这是一个示例脚本:

$(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;
   });
});

答案 1 :(得分:0)

因为我们无法看到form所有,所以我不完全确定,但鉴于您的问题,我将假设其他所有形式都共享同一idform#submit_wall),无效且id 必须在文档中是唯一的。

鉴于您要更改其他表单的id(我建议使用class名称,可能是'submit_wall',但详细信息取决于您) ,jQuery也需要改变。从:

$("form#submit_wall").submit(function() {

要:

$("form.submit_wall").submit(function() { // using the class-name instead of the id.

现在,当然,您遇到了重复id s。

的相同问题

所以我建议再次将id更改为class并更改:

var message_wall = $('#message_wall').attr('value');
var id = $('#id').attr('value');

为:

var message_wall = $(this).find('.#message_wall').attr('value');
var id = $(this).find('.id').attr('value');

鉴于你发布的乱七八糟的消息,我发现很难相信这就是你所需要的。绝对值得发布完全重现您的代码的整页(或JS FiddleJS Bin的演示)。