Как отправить модель в jQuery $.ajax() отправить запрос на метод MVC-контроллера

Ответ 1

Простой ответ (в MVC 3 и далее, может быть, даже 2), вам не нужно ничего особенного делать.

Пока ваши параметры JSON соответствуют модели, MVC достаточно умен, чтобы построить новый объект из параметров, которые вы ему даете. Параметры, которые там отсутствуют, просто дефолт.

Например, Javascript:

var values = 
{
    "Name": "Chris",
    "Color": "Green"
}

$.post("@Url.Action("Update")",values,function(data)
{
    // do stuff;
});

Модель:

public class UserModel
{
     public string Name { get;set; }
     public string Color { get;set; }
     public IEnumerable<string> Contacts { get;set; }
}

Контроллер:

public ActionResult Update(UserModel model)
{
     // do something with the model

     return Json(new { success = true });
}

Ответ 2

Если вам нужно отправить FULL-модель контроллеру, вам сначала понадобится модель для вашего кода javascript.

В нашем приложении мы делаем это с помощью метода расширения:

public static class JsonExtensions
{
    public static string ToJson(this Object obj)
    {
        return new JavaScriptSerializer().Serialize(obj);
    }
}

В представлении мы используем его для рендеринга модели:

<script type="javascript">
  var model = <%= Model.ToJson() %>
</script>

Затем вы можете передать модельную переменную в ваш вызов $.ajax.

Ответ 3

У меня есть страница MVC, которая отправляет JSON выбранных значений из группы переключателей.

Я использую:

var dataArray = $.makeArray($("input[type=radio]").serializeArray());

Сделать массив имен и значений. Затем я конвертирую его в JSON с помощью:

var json = $.toJSON(dataArray)

а затем отправьте его с помощью jQuery ajax() в контроллер MVC

$.ajax({
url: "/Rounding.aspx/Round/" + $("#OfferId").val(),
type: 'POST',
dataType: 'html',
data: json, 
contentType: 'application/json; charset=utf-8',
beforeSend: doSubmitBeforeSend,
complete: doSubmitComplete,
success: doSubmitSuccess});

Который отправляет данные через собственные данные JSON.

Затем вы можете захватить поток ответов и де-сериализовать его в собственный объект С#/VB.net и управлять им в своем контроллере.

Чтобы автоматизировать этот процесс с прекрасным, низким уровнем обслуживания, я советую прочитать эту запись, которая достаточно хорошо описывает большую часть собственной, автоматической JSON-де-сериализации.

Совместите объект JSON в соответствии с вашей моделью, и связанный процесс ниже должен автоматически десериализовать данные в вашем контроллере. Это чудесно работает для меня.

Статья о десериализации MVC JSON

Ответ 4

Это можно сделать, создав объект javascript в соответствии с вашей моделью mvc. Имена свойств javascript должны точно совпадать с моделью mvc, иначе autobind не будет присутствовать в сообщении. После того, как у вас есть модель на стороне сервера, вы можете затем манипулировать ею и хранить данные в базе данных.

Я достигаю этого либо событием двойного щелчка в строке сетки, либо событием клика на какой-либо кнопке.

@model TestProject.Models.TestModel

<script>

function testButton_Click(){
  var javaModel ={
  ModelId: '@Model.TestId',
  CreatedDate: '@Model.CreatedDate.ToShortDateString()',
  TestDescription: '@Model.TestDescription',
  //Here I am using a Kendo editor and I want to bind the text value to my javascript
  //object. This may be different for you depending on what controls you use.
  TestStatus: ($('#StatusTextBox'))[0].value, 
  TestType: '@Model.TestType'
  }

  //Now I did for some reason have some trouble passing the ENUM id of a Kendo ComboBox 
    //selected value. This puzzled me due to the conversion to Json object in the Ajax call. 
  //By parsing the Type to an int this worked.

  javaModel.TestType = parseInt(javaModel.TestType);

  $.ajax({
      //This is where you want to post to.
      url:'@Url.Action("TestModelUpdate","TestController")', 
      async:true,
      type:"POST",
      contentType: 'application/json',
      dataType:"json",
      data: JSON.stringify(javaModel)
  });
}
</script>


//This is your controller action on the server, and it will autobind your values 
//to the newTestModel on post.

[HttpPost]
public ActionResult TestModelUpdate(TestModel newTestModel)
{
 TestModel.UpdateTestModel(newTestModel);
 return //do some return action;
}

Ответ 5

Я думаю, вам нужно явно передать атрибут data. Один из способов сделать это - использовать data = $('# your-form-id'). serialize();

Это сообщение может быть полезно. Сообщение с jquery и ajax

Посмотрите на документ здесь.. Ajax serialize

Ответ 6

вы можете создать переменную и отправить в ajax.

var m = { "Value": @Model.Value }

$.ajax({
    url: '<%=Url.Action("ModelPage")%>',
    type: "POST",
    data:  m,
    success: function(result) {
        $("div#updatePane").html(result);
    },

    complete: function() {
    $('form').onsubmit({ preventDefault: function() { } });

    }
});

Все поле модели должно превышать m.

Ответ 7

В сообщении ajax call-

data:MakeModel(),

используйте следующую функцию для привязки данных к модели

function MakeModel() {

    var MyModel = {};

    MyModel.value = $('#input element id').val() or your value;

    return JSON.stringify(MyModel);
}

Прикрепите атрибут [HttpPost] к действию вашего контроллера.

на POST эти данные будут доступны