jQuery Form 插件 - 如何使 ajaxForm() “实时”?

发布于 2024-09-24 15:08:40 字数 308 浏览 3 评论 0原文

因此,我将“编辑”表单转换为 ajaxForm,其中包含以下内容:

$('#reviewForm').ajaxForm({
    success: function (response) {
        $('#bookReview').html(response);
    }
});

这将返回相同的表单,如有必要,可以再次编辑该表单。然而,第二个表单提交不再附加 ajaxForm(),这是有道理的。

我如何确保这个表单始终是 ajaxForm,无论发生了多少次提交,类似于 live() 函数的工作原理?

So I'm turning an "edit" form into an ajaxForm with the following:

$('#reviewForm').ajaxForm({
    success: function (response) {
        $('#bookReview').html(response);
    }
});

This returns the same form, that can be edited again, if necessary. The second form submission, however, no longer has the ajaxForm() attached to it, which makes sense.

How do I make sure this form is always an ajaxForm, no matter how many submissions have taken place, similar to how the live() function works?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

笛声青案梦长安 2024-10-01 15:08:40
$('#myFormId').live('submit', function() {
    // submit the form
    $(this).ajaxSubmit();
    // return false to prevent normal browser submit and page navigation
    return false;
});

稍微修改了 ajaxSubmit 的示例,来自 http://jquery.malsup.com/form/#api

$('#myFormId').live('submit', function() {
    // submit the form
    $(this).ajaxSubmit();
    // return false to prevent normal browser submit and page navigation
    return false;
});

Sligtly modified example for ajaxSubmit from http://jquery.malsup.com/form/#api.

平安喜乐 2024-10-01 15:08:40

来自文档:

delegation

true 要启用对事件委托的支持需要 jQuery v1.7+

// prepare all existing and future forms for ajax submission
$('form').ajaxForm({
     delegation: true
});

From the documentation :

delegation

true to enable support for event delegation requires jQuery v1.7+

// prepare all existing and future forms for ajax submission
$('form').ajaxForm({
     delegation: true
});
南风起 2024-10-01 15:08:40

您可以在响应中包含 ajaxForm 调用,例如:

<!-- the html for the form -->
<script type="text/javascript">
  $('#reviewForm').ajaxForm();
</script>

或者您可以将其作为成功函数的一部分来执行:

function ajaxify(response, status, xhr, form){
   var review = $('#bookReview').html(response);
   $('form#reviewForm', review).ajaxForm({
      'success': ajaxify
   });
}

$('#reviewForm').ajaxForm({
   'success': ajaxify
});

我推荐后者。

You can either include the ajaxForm call in the response like:

<!-- the html for the form -->
<script type="text/javascript">
  $('#reviewForm').ajaxForm();
</script>

or you could do it as part of the success function:

function ajaxify(response, status, xhr, form){
   var review = $('#bookReview').html(response);
   $('form#reviewForm', review).ajaxForm({
      'success': ajaxify
   });
}

$('#reviewForm').ajaxForm({
   'success': ajaxify
});

I recommend the latter.

眼泪淡了忧伤 2024-10-01 15:08:40

试试这个

$('#reviewForm').live('submit', function() {
    $(this).ajaxSubmit({
        success:function(){
            $('#bookReview').html(response);
        },
        resetForm:true
    });
    return false;
});

try this

$('#reviewForm').live('submit', function() {
    $(this).ajaxSubmit({
        success:function(){
            $('#bookReview').html(response);
        },
        resetForm:true
    });
    return false;
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文