使用 ajax 表单提交加载 div 区域


我不知道

我是否以正确的方式接近了这一点。我有一个主页,我在其中显示一些信息。然后,您可以单击一个按钮,然后页面将通过从单独的文件加载表单来显示表单:

    $('#viewport').load('/views/myView.php #targetDiv')

这工作正常。但这种观点是一种形式。然后我也想向 Ajax 提交包含的表单。但我似乎做不到。我认为这是因为如果我为表单设置按钮处理程序,它不起作用,因为在加载主页和 JQuery 脚本时表单不存在。

所以为了清楚起见,我使用 JQuery 和 Ajax 加载将这个div 加载到我的主页上。然后我也想简单地向Ajax提交此表格。

<div id="targetDiv">
<div class="title">Submit News</div>
    <form role="form" id="submitMyForm">
        <div class="form-group">
            <label for="myInput">Input here</label>
            <input type="text" class="form-control" id="myInput">
        </div>
        <button type="button" id="subMyFormBtn" class="btn btn-default">Submit</button>    
    </form>        
</div> 

蒂亚

完整解决方案:

$('#viewport').load('/views/myView.php #targetDiv');
$("#targetDiv").live("submit",function(e){
    e.preventDefault();
    //ajax here
});

你必须做:

$("#subMyFormBtn").live("submit",function(
$("#submitMyForm").submit();
));

你可以做类似的事情

 $('#viewport')
     .load('/views/myView.php #targetDiv')
     .done(function () {
         $('#yourform').submit(function (e) {
             $.ajax(..)
             e.preventDefault()
         });
     });

$('body').on('submit', '#yourform', function (e) {
    $.ajax(..)
    e.preventDefault()
});

最新更新