提交使用jQuery和AJAX动态插入页面的表单？

我有一个使用JavaScript生成的表单，然后插入到弹出的模态窗口中。提交使用jQuery和AJAX动态插入页面的表单？

我的表单HTML没有生成或插入到页面中，直到DOM生成整个页面（它是从一个Socket post事件触发的，然后使我的popup打开并插入此表单的HTML）

还可以有插入到页面中，从而不只是1

这里是生成并插入到页面的表单代码示例多种形式...

<form action="/" id="logCallForm" class="logCallForm"> 
    <div class="col-xs-10"> 
     <input class="form-control input-sm" type="text" name="subject" placeholder="Subject"> 
     <br><input type="hidden" name="qmsId" value="1c885762-27d5-58ef-9f95-527ae750c9be"> 
     <input type="hidden" name="dateTime" value="2013-11-07 01:05:19"> 
    </div> 
    <input type="submit" value="Save Call"> 
</form>

现在下面是一些已经存在的JavaScript运行在同一页面上，我的目标是能够使用AJAX发布这些表单。现在它似乎没有检测到代码，但当我点击提交按钮时，它会加载一个新页面，而不是通过AJAX提交。

请帮帮我吗？我很确定这与我的表单在页面已被加载后添加有关吗？

$(function() { 

    $('.logCallForm').on('submit', function (e) { 

     var url = '/custom/modules/nam_call_logger/call_server.php'; 

     $.ajax({ 
       type: "POST", 
       url: url, 
       data: $(this).serialize(), // serializes the form's elements. 
       // qmsId dateTime subject 
       success: function(data) 
       { 
        alert(data); // show response from the php script. 
       } 
     }); 
     e.preventDefault(); 

    }); 

});

来源

2014-02-06 JasonDavis

尝试在热闹方式订阅：

$(document).on('submit', '.logCallForm', function (e) {

基本上，这将订阅submit事件选择器匹配的元素，即使这些元素还没有在当时存在你正在订阅（也就是页面的DOM负载）。它将为监听，以便将来可能添加到DOM中且与选择器匹配的元素。

来源

2014-02-06 22:05:38

提交使用jQuery和AJAX动态插入页面的表单？

回答

相关问题