JQuery AJAX CALL с параметром к методу контроллера не работает

Question

Я работаю с JQuery AJAX Call в приложении MVC. На мой взгляд выглядит следующим образом:

<p> 

    Name @Html.TextBox("Name") 
    Date @Html.TextBox("Date") 
    <input type="submit" id="SubmitName" value="Submit" /> 
</p> 

Мой AJAX вызов выглядит следующим образом:

<script type="text/javascript"> 
    function send() { 
     var Details = JSON.stringify({ 
      StudentName: $("#Name").val(), 
      DateofJoining: $("#Date").val() 
     }); 
     $('#target').html('sending..'); 

     $("SubmitName").click(function() { 

      $.ajax({ 
       url: "/DQR/Details", 
       type: "POST", 
       dataType: "json", 
       contentType: "application/json", 
       data : Details , 
       success: function (data) { 
        $('#target').html(data.msg); 
       }, 

      }); 
     }) 
    } 
</script> 

И мой контроллер выглядит следующим образом:

[HttpPost] 
     public ActionResult Details (string StudentName, string DateofJoining) 
     { 

      var result = (from dc in _db.Details 
          where dc.Name== StudentName 
          select dc.Address); 
      return Json(result, JsonRequestBehavior.AllowGet); 
     } 

Я не знаю, что я отсутствует. Запрос ajax не работает. Может ли кто-нибудь помочь мне с этим?

Answer 1

Воображение, что ур имя контроллера DQR, то вам нужно написать, как показано ниже: -

$.ajax({ 
       url: "/DQR/Details", 
       type: "POST", 
       dataType: "json", 
       contentType: "application/json", 
       data : Details , 
       success: function (data) { 
        $('#target').html(data.msg); 
       }, 

      }); 

и идентификатор должен быть: -

$("#SubmitName").click(function() { 
     var Details = JSON.stringify({ 
     StudentName: $("#Name").val(), 
     DateofJoining: $("#Date").val() 
    }); 
    $('#target').html('sending..'); 

    //// your ajax call 
}}); 

и что Send()? я имею в виду, что событие click должно быть ниже $(document).ready(function() {});

Я бы предложил взять простую кнопку, а не «отправить», если вы играете на стороне клиента с этим.

Answer 2

Bind обработчик щелчка правильно, переместите создание Details объекта в обработчик щелчка

$(function() { 
    $("#SubmitName").click(function() { 
     var Details = JSON.stringify({ 
      StudentName: $("#Name").val(), 
      DateofJoining: $("#Date").val() 
     }); 
     $('#target').html('sending..'); 
     $.ajax({ 
      url: "/DQR/Details", 
      type: "POST", 
      dataType: "json", 
      contentType: "application/json", 
      data : Details , 
      success: function (data) { 
       $('#target').html(data.msg); 
      } 
     });  
    }); 
}); 

Answer 3

Вы можете использовать JQuery $.post метод, а также.

Вот пример.

var StudentName = $("#Name").val(); 
var DateofJoining = $("#Date").val(); 

$.post('/Controller/Action', { 'StudentName': StudentName , 'DateofJoining': DateofJoining }, function(data) { 
    $('#target').html(data.msg); 
}, 'json'); 

Здесь больше информации о $.post