引导模式中的Ajax响应

问题描述：

我使用twitter bootstrap模式和jquery以该模式提交表单。在AJAX响应之后，我无法再提交此表单。在Ajax响应一个获取HTML数据与此内容：引导模式中的Ajax响应

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

所以，我猜这是关于没有绑定窗体在阿贾克斯响应模态或东西...

答

感谢我的同事，我得到了我的问题的答案。作品像魅力:)

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

引导模式中的Ajax响应

相关推荐