Question

我有一个带复选框的表单，它是使用ajax和jquery UI选项卡生成的。当有人点击按钮时，我正在用帖子提交表单。它适用于第一个加载了ajax的选项卡，但是单击其他选项卡然后尝试提交表单，表单中的数据为空。因此，更改选项卡后序列化函数不起作用，因为它认为表单为空。

    // Bulk action Delegate
$("body").delegate(".bulk_action_btn", "click", function(){
    var data = $("#ActionAddForm").serialize();
    var action = $(this).attr('title');
    var currentTab = $( "#asst_tabs" ).tabs( "option", "selected" );


    $('.asst_list2').fadeOut();
    $.ajax({
        type: "POST",
        url: "<?php echo $html->url("/admin/actions/perform/") ?>"+currentTab + '/' + action,
        data: data,
        cache: false,
        success: function(html){
            $('.asst_list2').html(html);
            $('.asst_list2').fadeIn(100);
            // $("input[type=checkbox]").attr("checked",false);
        }
    });
});

这是相对的html标记，实际标记要长得多。

<div class="asst_action_bar">
<div class="action_group">
<p>Bulk Actions</p>
    <input value="Follow" class="bulk_action_btn" title="Follow" type="button">
    <input value="Unfollow" class="bulk_action_btn" title="Unfollow" type="button">
</div>
<form action="/admin/actions/add" method="post" id="ActionAddForm">
<fieldset style="display: none;"><input type="hidden" value="POST" name="_method"></fieldset>
<!-- Loaded with ajax -->
<div class="input checkbox"><input name="data[Assignment][1580]" id="Assignment1580_" value="0" type="hidden"><input name="data[Assignment][1580]" value="1" id="Assignment1580" type="checkbox"></div>         <div id="1580">
<p><a href="javascript:" class="star"><img src="/img/top/followmestar-on.gif" alt="" height="40" width="40"></a></p>
</div>
<div class="input checkbox"><input name="data[Assignment][1580]" id="Assignment1580_" value="0" type="hidden"><input name="data[Assignment][1580]" value="1" id="Assignment1580" type="checkbox"></div>         <div id="1580">
<p><a href="javascript:" class="star"><img src="/img/top/followmestar-on.gif" alt="" height="40" width="40"></a></p>
</div>
<div class="input checkbox"><input name="data[Assignment][1580]" id="Assignment1580_" value="0" type="hidden"><input name="data[Assignment][1580]" value="1" id="Assignment1580" type="checkbox"></div>         <div id="1580">
<p><a href="javascript:" class="star"><img src="/img/top/followmestar-on.gif" alt="" height="40" width="40"></a></p>
</div>
<!-- Loaded with ajax end -->
</form>

我认为它不起作用的原因是我使用的是“#ActionAddForm”选择器（表单的id），更改标签后可能没有加载。如果有帮助的话，我在后端使用cakePHP。我正在使用jquery委托方法，因为它没有工作表单，复选框加载了ajax。

Answer 1

ID必须是唯一的，但听起来你使用ID vor每个表单（什么不起作用，浏览器只提取1个元素 - 哪一个取决于浏览器）。加载新表单后立即尝试删除上次使用的表单。

或使用其他选择器，例如form:visible

使用jquery序列化由ajax生成的表单

1 个答案: