PartialViewの結果をAjax経由で返す

Question

私は私の見解で予定フォームを持っています。 iamはajax.beginformを使用してフォームデータをコントローラに送信し、「成功！」という部分ビューを返します。また、私のフォームにdatetime picker入力ボックスがあり、その上にチェック可能な空きボタンがあります。私は日付を選択するときに、その日付と時刻がすでにデータベースに存在するかどうかを確認するために、利用可能なボタンをチェックしたいと思う。私はjquery ajaxを使用してそのフォームでajax呼び出しを再度使用しています。ここに私のコントローラコードがある

public ActionResult CheckAvailability(string date) 
     { 
      bool available = true; 
      if (ModelState.IsValid) 
      { 


       var result = astrodb.Appointments.Single(check => check.AppointmentTime == DateTime.Parse(date)); 

       if (result.FirstName.Count() == 0) 
       { 
        available = true; 

       } 
       else 
       { 
        available = false; 
       } 
      } 
      else 
      { 
       available = false; 
      } 
      return PartialView(available); 
     } 

私のAJAX呼び出しは、IAMの出力を得ていない

 $(function(){ 


     $(document).ajaxStart(function() 
      { 
      showProgressModal('check-loading'); 
      }); 

      $(document).ajaxStop(function() 
      { 
      hidePrograssModal(); 
      }); 



      $("#button-check").click(function(){ 
      url:"@(Url.Action("CheckAvailability","Home"))", 
      type: "POST", 
      data:{name:$("#new").val()}, 
      cache:false, 
      datatype:html, 
      success: function(data){ 
      $("#check-success").html(data);} 

      }); 
      }); 

です。 bt私は下の画像のようなエラーを取得し、私のjquery datetimepickerもそれに伴って作業を停止します。

Check this error

誰かがコードで私を助けることができますか？

更新されたコード：

$(function(){ 


    $(document).ajaxStart(function() 
     { 
     showProgressModal('check-loading'); 
     }); 

     $(document).ajaxStop(function() 
     { 
     hidePrograssModal(); 
     }); 



     $("#button-check").click(function(){ 
     $.ajax({ 
     url:"@(Url.Action("CheckAvailability","Home"))", 
     type: "POST", 
     data:{name:$("#new").val()}, 
     cache:false, 
     datatype:html, 
     success: function(data){ 
     $("#check-success").html(data);} 
     }); 
     }); 
     }); 

Answer 1

AJAX呼び出し

$(function(){ 
     $("#button-check").click(function(){ 
      $.ajax({ 
       url:"@(Url.Action("CheckAvailability","Home"))", 
       type: "POST", 
       data:{name:$("#new").val()}, // parameter name should be same in controller action 
       cache:false, 
       datatype:'html', 
       success: function(data){ 
        $("#check-success").html(data); 
       } 
       }) 
     }) 
    }) 

か、また

$("#button-check").click(function(){ 
    $.post("someUrl",{data:somedata},callBackfunction); 
} 

ホームコントローラー

リク $.postメソッドを使用することができますしながらあなたは $.ajaxを追加するのを忘れ

public PartialViewResult CheckAvailability(string name) // parameter name same as `ajax call data parameter` 
{ 
    return PartialView(somePartialView) 
} 

Answer 2

$.ajax({ 
    type : 'post', 
    url : URL, 
    data : {Key : value,Key : value,Key : value}, 
    cache:false, 
    beforeSend:function() { 
       //this code is before seed 
    }, 
    success : function(response) { 
       //this code is success 
    }, 
    timeout:(1000*20), //waiting time ,if time is over can itin function 
    error:function() { 
     //this code is error 
    } 
});