Question

我正在使用ASP.NET MVC而我正在尝试使用Ajax Spinner。当用户提交一个定义按钮时，应该在我的部分视图被存储和显示时显示ajax微调器。这就是我正在做的事情。

这是我的按钮和链接到此按钮的jQuery代码。 suggestContainer表示将呈现部分视图的容器：

<input type="button" value="Suggérer rdv" id="SuggestBtn" disabled ="disabled"/>


<div id="suggestionsContainer">

</div>

    $('#SuggestBtn').click(function() {

        var intervals = scheduler.GetSelectedInterval();
        //var $hiddenInput = jQuery('input:hidden', jQuery(this));
        //$hiddenInput.val(intervals.ToString());

        var chk = $('#chbxPADC').is(':checked');
        var chk1 = $('#chbxPADP').is(':checked');
        var chk2 = $('#chbxPremPADC').is(':checked');
        var chk3 = $('#chbxPremPADP').is(':checked');
        var chk4 = $('#chbxOther').is(':checked');
        var chkMan = $('#Homme').is(':checked');
        var chkWoman = $('#Femme').is(':checked');
        var NbPADC = $('#NbPADC').val();
        var NbPADP = $('#NbPADP').val();

        var isFemale = true;
        if (chkMan == true)
            isFemale = false;


        PADP = chk1;
        PADC = chk;
        PremedicationPADC = chk2;
        PremedicationPADP = chk3;
        autre = chk4;



        $.get('/Home/GetSuggestions', { PADP: PADP, PADC: PADC, isFemale : isFemale, PremedicationPADP: PremedicationPADP, PremedicationPADC: PremedicationPADC, NbPADC: NbPADC, NbPADP: NbPADP, autre: autre, intervals: intervals.ToString() }).success(function (html) {
            $('#suggestionsContainer').html(html);
        });
    });

我已阅读this StackOverflow Q&A，但您可以看到我没有使用@ Ajax.ActionLink。

知道该怎么做？

Answer 1

假设您的所有控件都位于ID为myForm的表单中你可以做点什么

$('#SuggestBtn').click(function() {
   //maybe check if form is valid first... eg if ($('#myForm').validate().form()){...
   //start client side spin/progress bar
   $.ajax(
     type: "POST",
     url: "/Controller/Method",
     data: $('#myForm').serialize(),
     success: function (response){
        $('#suggestionsContainer').html(response);
        //end client side spin/progress bar
     }
   )
}

我们使用jQuery ajax函数来请求局部视图。（url参数应设置为返回局部视图的操作方法）发布到部分视图的表单数据来自$('#myForm').serialize()。您应该注意，除非您在此处明确这样做，否则不会在客户端执行任何不引人注目的验证。

从服务器返回后，调用success函数（假设其状态为200 http响应），在此示例中，使用返回的HTML替换adviceContainer的内容。

ASP.NET MVC - 加载部分视图时的Ajax Spinner

1 个答案: