Отправка данных JSON через POST (ajax) и получение ответа json от контроллера (MVC)

92

Я создал функцию в javascript:

function addNewManufacturer() {
       var name = $("#id-manuf-name").val();
       var address = $("#id-manuf-address").val();
       var phone = $("#id-manuf-phone").val();

       var sendInfo = {
           Name: name,
           Address: address,
           Phone: phone
       };

       $.ajax({
           type: "POST",
           url: "/Home/Add",
           dataType: "json",
           success: function (msg) {
               if (msg) {
                   alert("Somebody" + name + " was added in list !");
                   location.reload(true);
               } else {
                   alert("Cannot add to list !");
               }
           },

           data: sendInfo
       });
}

Я вызвал файл jquery.json-2.3.min.js script, и я использовал его для метода toJSON(array).

В контроллере у меня есть это действие Add

[HttpPost]
public ActionResult Add(PersonSheets sendInfo) {
    bool success = _addSomethingInList.AddNewSomething( sendInfo );

    return this.Json( new {
         msg = success
    });

}

Но sendInfo как параметр метода становится нулевым.

Модель:

public struct PersonSheets
{
    public int Id;
    public string Name;
    public string Address;
    public string Phone;
}

public class PersonModel
{
    private List<PersonSheets> _list;
    public PersonModel() {
         _list= GetFakeData();
    }

    public bool AddNewSomething(PersonSheets info) {
         if ( (info as object) == null ) {
            throw new ArgumentException( "Person list cannot be empty", "info" );
         }

         PersonSheets item= new PersonSheets();
         item.Id = GetMaximumIdValueFromList( _list) + 1;
         item.Name = info.Name;
         item.Address = info.Address;
         item.Phone = info.Phone;

         _list.Add(item);

         return true;
    }
}

Как я могу сделать в методе действия, когда данные были отправлены с помощью POST?

Я не знаю, как использовать. Кроме того, можно отправить ответ (в ajax) через JSON?

Спасибо

  • 2
    Привет Змеиные Глаза. Можете ли вы изменить принятый ответ на ответ Нехи? Ответ Правина Прасада в настоящее время не работает, так как он (на момент написания) не может кодировать JSON и не может установить заголовок JSON Content-Type. Неха правильно делает оба этих. Я проверил оба ответа.
Теги:
asp.net-mvc

5 ответов

67
Лучший ответ

Создать модель

public class Person
{
    public string Name { get; set; }
    public string Address { get; set; }
    public string Phone { get; set; }
}

Контроллеры вроде ниже

    public ActionResult PersonTest()
    {
        return View();
    }

    [HttpPost]
    public ActionResult PersonSubmit(Vh.Web.Models.Person person)
    {
        System.Threading.Thread.Sleep(2000);  /*simulating slow connection*/

        /*Do something with object person*/


        return Json(new {msg="Successfully added "+person.Name });
    }

Javascript

<script type="text/javascript">
    function send() {
        var person = {
            name: $("#id-name").val(),
            address:$("#id-address").val(),
            phone:$("#id-phone").val()
        }

        $('#target').html('sending..');

        $.ajax({
            url: '/test/PersonSubmit',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                $('#target').html(data.msg);
            },
            data: person
        });
    }
</script>
  • 0
    Я пошел по твоему пути, но sendInfo возвращает null !!! Смотрите обновленный код выше.
  • 0
    Ваш personlist класс должен должен иметь свойство имя, adrress, телефон
Показать ещё 11 комментариев
99
var SendInfo= { SendInfo: [... your elements ...]};

        $.ajax({
            type: 'post',
            url: 'Your-URI',
            data: JSON.stringify(SendInfo),
            contentType: "application/json; charset=utf-8",
            traditional: true,
            success: function (data) {
                ...
            }
        });

и в действии

public ActionResult AddDomain(IEnumerable<PersonSheets> SendInfo){
...

вы можете связать свой массив следующим образом

var SendInfo = [];

$(this).parents('table').find('input:checked').each(function () {
    var domain = {
        name: $("#id-manuf-name").val(),
        address: $("#id-manuf-address").val(),
        phone: $("#id-manuf-phone").val(),
    }

    SendInfo.push(domain);
});

надеюсь, что это может вам помочь.

  • 0
    Разве не так, что при строковом моделировании возникают некоторые проблемы с безопасностью, так как они могут подделать данные и вставить некоторые уязвимости XSS?
  • 0
    @ Дэйв нет, конечная точка (в данном случае функция контроллера mvc) НИКОГДА не должна доверять клиенту, поэтому проверку XSS следует выполнять на сервере. Контроллер отвечает за правильный анализ данных и отправку данных вызывающей стороне (веб-приложение). Вызывающим также может быть что-то вроде скрипача, почтальона или другого приложения. Надеюсь, это имеет смысл.
Показать ещё 4 комментария
7

Используйте JSON.stringify(<data>).

Измените свой код: data: sendInfo на data: JSON.stringify(sendInfo). Надеюсь, это поможет вам.

  • 1
    Возможно, вам также понадобится установить для contentType 'application / json'. Некоторые конечные точки могут догадаться, но сказать им, что это JSON, более надежно.
0

У вашего PersonSheets есть свойство int Id, Id не входит в сообщение, поэтому смену modelbinding не удается. Сделать Id nullable (int?) Или отправить atleast Id = 0 с POst.

-2

Вам не нужно вызывать $.toJSON и добавить traditional = true

data: { sendInfo: array },
traditional: true

.

  • 0
    нет хорошего выбора! Если я буду следовать вашему коду, то параметр метода Add(object[] sendInfo) будет нулевым!
  • 0
    Попробуйте обновленный код
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню