使用 jquery 的后续 ajax 调用在 mvc 4 应用程序中不起作用

Question

我的部分视图有一个表单，单击按钮我正在拨打 ajax 电话。控制器 returns 局部视图并被渲染。一切正常，但是当我再次单击按钮时，没有进行 ajax 调用。我几乎没有看到后续调用失败的类似问题，但 none 的解决方案对我有用。我的 ajax 调用代码是

  $(document).ready(function () {
        $('#btnUpdateRequest').click(function (e) {
            e.preventDefault();
            $.ajax({
                url: '/Request/UpdateRequest',
                cache: false,
                data: $('form[id="RequestForm"]').serialize(),
                type: 'POST',
                success: function (data) {
                    $('.divPartial').html(data);
                    $('#ResponseContainer').addClass('show').removeClass('hide');
                }
            });
        });
    });

我的表格如下

@using (Html.BeginForm("UpdateRequest", "Request", FormMethod.Post, new {@class = "form", id = "RequestForm" }))
{
// form elements 
 <input class="btn btn-danger pull-right" id="btnUpdateRequest" value="Update" />
 }

有什么想法吗？谢谢

Answer 1

这样试试

$('#btnUpdateRequest').click(function (e) {
    e.preventDefault(); //preventing the default action
    var $form = $('#RequestForm');
    $.ajax({
        url: $form.prop('action'),
        data: $form.serializeArray(),
        type: 'POST',
        success: function (data) {
            $('.divPartial').html(data);
            $('#ResponseContainer').addClass('show').removeClass('hide');
        }
    //you can return false;
    });


});

Answer 2

您的脚本应该在主页上，而不是在部分页面上。在页面加载后部分加载，您的点击事件将不会被看到。要解决此问题，您需要将点击事件绑定到文档

$(document).on('click', '#btnUpdateRequest', function (e) {
    //your script here
});

使用 jquery 的后续 ajax 调用在 mvc 4 应用程序中不起作用

Subsequent ajax call using jquery not working in mvc 4 application

ajax

asp.net-mvc

jquery

asp.net-mvc-4