1

我正在使用 twitter 引导模式和 jquery 在该模式中提交表单。在 AJAX 响应后，我无法再次提交此表单。在 AJAX 响应中，获取包含以下内容的 html 数据：

<form action="/foo" id="UserCommentViewForm" method="post" accept-charset="utf-8">
<input name="data[UserComment][to_email]" type="text"  id="UserCommentToEmail"/>
<div class="error_notice">Enter email</div>
</form>

这是模态的内容：

<div id="modal_product_share" class="modal hide fade int" style="display: none; ">
<div class="modal-header">
    <a class="close" data-dismiss="modal">×</a>
    <h3>Info</h3>
</div>

<div class="modal-body">
    <form action="/foo" id="UserCommentViewForm" method="post" accept-charset="utf-8">
        <input name="data[UserComment][to_email]" type="text" id="UserCommentToEmail"/>
    </form> 
</div>

<div class="modal-footer">
    <a href="javascript:void(0);" class="btn btn-success" id="submit">Send</a>
    <a href="javascript:void(0);" class="btn" data-dismiss="modal">Close</a>
</div>
</div>

这是我的 JS：

function product_share()
{
var el_body = $("#modal_product_share .modal-body");
var el_form = $("#UserCommentViewForm");
this.init = function(){
$("#submit").click(function(){
    el_form.submit();
});

el_form.submit(function(event){
    event.preventDefault();
    $.post( '/products/product_share/', el_form.serialize(), function( data )
    {
    el_body.html(data);
    });
});
};

this.init();
}

在文件的开头部分是这样的：

$(document).ready(function() {
    obj_product_share = new product_share();
});

所以，我猜这与在 ajax 响应模态或其他东西时没有绑定表单有关......

4

1 回答 1

0

感谢我的同事，我的问题得到了解答。像魅力一样工作:)

function product_share(){

var obj = this;
obj.el_body = $("#modal_product_share .modal-body");
obj.button_id = '#submit';
obj.form_id = '#UserCommentViewForm';
obj.el_form = null;

obj.init = function() {

    obj.el_form = $(obj.form_id);

    $(obj.button_id).click(function(){
        obj.el_form.submit();
    });

    obj.setup_form();

};

obj.setup_form = function() {

    obj.el_form.submit(function(e){
        e.preventDefault();
        $.post( '/products/product_share/', obj.el_form.serialize(), function( data ) {
            obj.el_body.html(data);
            obj.el_form = obj.el_body.find(obj.form_id);
            obj.setup_form();
        });
    });

};

obj.init();
}
于 2012-07-24T20:02:32.253 回答