Не ajax GET / POST с использованием jQuery (плагин?)

Question

Это одна из тех ситуаций, когда мне кажется, что мне не хватает ключевого слова для поиска ответа в Google ...

У меня есть набор параметров, и я хочу, чтобы браузер перешел на GET URL с параметрами. Будучи пользователем jQuery, я знаю, что если бы я хотел сделать ajax-запрос, я бы просто сделал:

$.getJSON(url, params, fn_handle_result);

Но иногда я не хочу использовать ajax. Я просто хочу отправить параметры и получить страницу обратно.

Теперь я знаю, что могу зациклить параметры и вручную создать URL GET. Для POST я могу динамически создавать форму, заполнять ее полями и отправлять. Но я уверен, что кто-то написал плагин, который уже делает это. Или, может быть, я что-то пропустил, и вы можете сделать это с помощью ядра jQuery.

Итак, кто-нибудь знает такой плагин?

РЕДАКТИРОВАТЬ: В основном, я хочу написать:

$.goTo(url, params);

И опционально

$.goTo(url, params, "POST");

Answer 1

Плагин jQuery, казалось, прекрасно работал, пока я не попробовал его на IE8. Мне пришлось сделать это небольшое изменение, чтобы заставить его работать на IE:

(function($) {
    $.extend({
        getGo: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        postGo: function(url, params) {
            var $form = $("<form>")
                .attr("method", "post")
                .attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 2

Вот что я закончил, используя подсказку от redsquare:

(function($) {
    $.extend({
        doGet: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        doPost: function(url, params) {
            var $form = $("<form method='POST'>").attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Использование:

$.doPost("/mail/send.php", {
    subject: "test email",
    body: "This is a test email sent with $.doPost"
});

Любые отзывы приветствуются.

Обновление: см. Ответ Дастина для версии, которая работает в IE8

Answer 3

Из вопроса не ясно, есть ли у вас случайная группа значений, которые вы хотите передать в строке запроса, или это значения формы.

Для значений формы просто используйте функцию .serialize для создания строки запроса.

1007 * например *

var qString = $('#formid').serialize();
document.location = 'someUrl' + '?' + serializedForm

Если у вас есть случайная группа значений, вы можете создать объект и использовать служебный метод .param .

* 1014 например *

 var params = { width:1680, height:1050 };
 var str = jQuery.param( params );
 console.log( str )
 // prints width=1680&height=1050
 // document.location = 'someUrl' + '?' + str

Answer 4

К вашему сведению для всех, кто делает doPost для рельсов 3, вам нужно добавить токен CSRF, добавив следующее к ответу, чтобы сделать это ...

var token = $('meta[name="csrf-token"]').attr('content');
$("<input name='authenticity_token' type='hidden' value='" + token + "'/>").appendTo($form);

Answer 5

Это похоже на выше, за исключением того, что он будет обрабатывать параметры массива, передаваемые в MVC

(function($) {
    $.extend({
        getGo: function(url, params, traditional) {
            /// <summary>
            ///     Perform a GET at url with specified params passed as part of the query string.
            /// </summary>
            /// <param name="url"></param>
            /// <param name="params"></param>
            /// <param name="traditional">Boolean:  Specify true for traditional serialization.</param>
            document.location = url + '?' + $.param(params, traditional);
        },
        postGo: function (url, params) {
            /// <summary>
            ///     Perform a POST at url with the specified params as part of a form object.
            ///     If a parameter is an array then it will submit it as multiple attributes so MVC will see it as an array
            /// </summary>
            /// <param name="url" type="string"></param>
            /// <param name="params" type="Object"></param>
            var $form = $("<form>").attr("method", "post").attr("action", url);
            $.each(params, function (name, value) {
                if (value.length != null && value.length > 0) {
                    for (var i = 0; i < value.length; i++) {
                        $("<input type='hidden'>").attr("name", name + '[' + i + ']').attr("value", value[i]).appendTo($form);
                    }
                }
                else {
                    $("<input type='hidden'>").attr("name", name).attr("value", value).appendTo($form);
                }
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 6

Отличная работа Если вы хотите невидимую форму, поместите ее в скрытый DIV:

(function($) {
    $.extend({
        doGet: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        doPost: function(url, params) {
            var $div = $("<div>").css("display", "none");
            var $form = $("<form method='POST'>").attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo($div);
            $div.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 7

Принятый ответ не соответствует вашему требованию POST, так как установка document.location всегда приведет к GET-запросу. Вот возможное решение, хотя я не уверен, что jQuery позволяет загружать все содержимое страницы следующим образом:

$.post(url, params, function(data) {
  $(document).html(data);
}, "html");