Question

在我的ajax电话之后我得到$('#form').serialize() = ""：

$('#continueBtn').bind('click', function () {
    var url = $('#form').attr('action') + setFlowEvent('continue');
    $.ajax({
        type : "POST",
        url : url,
        cache:false,
        data: $('#form').serialize(),
        dataType: "html",
        success : function(response) {
            var newContent = $($.parseHTML(response)).find("#ajax-content");
            $('#ajax-content').html(newContent);
            bindAjaxSubmit();
        },
        error : function(XMLHttpRequest, textStatus, errorThrown) {
            alert("error!");
        }
    });
});

我有下一个jsp代码：

<div id="ajax-content">  
    <form:form id="form" modelAttribute="model" action="${actionURL}" method="post">
        <input id="field1" type="text" value="1" name="field1"></input>
        <input id="field2" type="text" value="2" name="field2"></input>
        <button id="continueBtn">continue</button>  
    </form:form> 
</div>

Answer 1

好的，你想要玩这个 - 但我认为发生的事情是你在现有的＃ajax-content中嵌套响应＃ajax-content。

所以这是一个建议......

<div id="target-area">
  <div id="ajax-content">
     ...
  </div>
</div>

然后为你的ajax尝试执行以下操作：

$(function() {
    $("#target-area").on("click", "#continueButton", function() {
        $.ajax({
                type : "POST",
                url : url,
                cache:false,
                data: $('#form').serialize(),
                dataType: "html",
                success : function(response) {
                    var newContent = $($.parseHTML(response)).find("#ajax-content");
                    $('#target-area').html(newContent);
                },
                error : function(XMLHttpRequest, textStatus, errorThrown) {
                    alert("error!");
                }
            });
    });
});

通过执行上述操作，您可以自动捕获按钮事件，前提是ajax响应提供相同或相似的正文内容。

ajax调用后丢失的表单模型绑定

1 个答案: