ASP.NET MVC - 부분 뷰를로드하는 중 Ajax Spinner

Question

ASP.NET MVC를 사용 중이고 Ajax Spinner를 사용하려고합니다. 사용자가 정의 된 버튼을 제출하면 Partial View가 빌드되고 표시되는 동안 ajax 회 전자가 표시되어야합니다. 여기 내가하는 일이있다.

여기 내 버튼과이 버튼에 연결된 jQuery 코드가 있습니다. suggestionsContainer는 부분보기가 렌더링되는 컨테이너 나타냅니다 : 나는 this StackOverflow Q&A을 읽은

<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); 
     }); 
    }); 

을하지만 내가 @의 Ajax.ActionLink를 사용하지 않는 볼 수 있습니다.

여기 어떻게해야할까요?

Answer 1

가정의 모든 컨트롤을 사용하면 우리는 부분보기를 요청하기 위해 jQuery를 ajax 기능을 사용하는

$('#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 
    } 
    ) 
} 

처럼 뭔가를 할 수 myForm을의 ID와 형태에 있습니다. (url 매개 변수는 부분보기를 반환하는 작업 방법으로 설정해야합니다.) 부분보기에 게시되는 양식 데이터는 $('#myForm').serialize()에서 가져옵니다. 명시 적으로 여기에서 수행하지 않는 한 여기에서 클라이언트 쪽에서 방해받지 않는 유효성 검사가 수행됩니다.

success 함수가 호출되면 (이 예제에서는 상태 200 http 응답으로 가정 함)이 예제에서는 suggestionsContainer의 내용을 반환 된 HTML로 바꿉니다.