Разница между $.post и $.ajax?

Ответ 1

После повторной проверки некоторых онлайн-документации я решил придерживаться $.post над $.ajax.

Параметр data $.ajax method делает что-то отличное от метода $.post, не уверен, что именно, но есть разница.

Единственная причина, по которой я хотел использовать $.ajax, - это то, что я хотел иметь возможность обрабатывать события и не понимал, что могу сделать это с помощью $.post.

Вот что я закончил с

function GetSearchItems() {
    var url = '@Url.Action("GetShopSearchResults", "Shop", New With {.area = "Shop"})';
    var data = $("#ShopPane").serialize();
    // Clear container
    $('#shopResultsContainer').html('');
    // Retrieve data from action method
    var jqxhr = $.post(url, data);
    // Handle results
    jqxhr.success(function (result) {
        //alert("ajax success");
        $('#shopResultsContainer').html(result.ViewMarkup);
    });
    jqxhr.error(function () {
        //alert("ajax error");
    });
    jqxhr.complete(function () {
        //alert("ajax complete");
    });

    // Show results container
    $("#shopResultsContainer").slideDown('slow');
}

Ответ 2

Этот пост будет полезен для вас.

Ссылка на форум

Короче следующее:

$.post( "/ajax", {"data" : json }) 

Является эквивалентным:

$.ajax({ 
  type: "POST", 
  url: "/ajax", 
  data: {"data": json} 
}); 

Ответ 3

Проблема здесь заключается не в том, что $.ajax() не работает, потому что вы не задали параметр type в запросе Ajax и по умолчанию задаете запрос GET. Данные отправляются через строку запроса для get, и если ваш бэкэнд ожидает их как параметры сообщения, они не будут их читать.

$.post - это просто вызов с $.ajax(), только с набором type. Прочтите docs, и вы увидите, что $.ajax() по умолчанию имеет значение GET, как я упоминал выше.

Если вы перейдете на страницу jQuery.post в документах jQuery, она покажет вам запрос $.ajax с набором типов. Снова прочитайте документы.

Ответ 4

Вы указываете это как параметр данных. $.post является просто сокращением для $.ajax, которое ожидает следующее.

$.ajax({
    type : 'POST',
    url : url,
    data : data,
    success : success,
    dataType : dataType
});

Ответ 5

Как и в дополнении, в принятом ответе упоминается, что "Параметр данных метода $.ajax делает что-то отличное от метода $.post, не уверен, что именно, но есть разница"

попробуйте использовать:

    { 
        ... 
        data: JSON.stringify(yourJsonData), 
        ... 
    }

Иначе объект json будет вставлен в полезную нагрузку в виде строки с кодировкой url.

Ответ 6

Я также заметил еще одно различие между вызовами.post v/s.ajax.

На странице есть две формы.

<form id="city">
    City Name :input - text ....
    State : select from drop down using select2 ...
    button : add city ....onClick do .ajax submit
</form>

<form id="company">
    Company Name : input - text
    Address .....
    City : select from drop down using select2
</form>

Первая форма (город) дает возможность добавить город, если его нет в раскрывающемся списке второй формы (компания). "Добавить" осуществляется с помощью.ajax. Когда я делаю это,.ajax отправляет данные из обеих форм на страницу, хотя я четко указываю два поля, которые должны быть отправлены. Это не происходит, когда я использую.post. Я подозреваю, что установка одного из параметров является причиной. Я не могу найти точную проблему. Я буду признателен, если кто-то может помочь.

        $.ajax({
          url: "addCity",
          method: 'POST',
          data: {
            name: $("#city_name").val(),
            state: $("#state").val(),
          },
          success: function(data) {
            var messages = $('.messages');

            var successHtml = "success message ....";
            $(messages).html(successHtml);

          }
        });

Ответ 7

В $.ajax вы можете синхронизировать, но это невозможно в функции $.post. Синхронизация означает, что вы можете получить возвращенный результат.

var tmp;
$.ajax({
    'async': false,
    'type': "POST",
    'global': false,
    'dataType': 'html',
    'url': "Your Url",
    'data': {'type': 'data'},
    'success': function (data) {
        tmp = data;
    }
});
alert(tmp);