Подтвердить что ты не робот

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

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

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

$.getJSON(url, params, fn_handle_result);

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

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

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

EDIT: В принципе, я хочу написать:

$.goTo(url, params);

И при желании

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

Ответ 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);

Ответ 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

Ответ 3

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

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

например

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

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

например

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

Ответ 4

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

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

Ответ 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);

Ответ 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);

Ответ 7

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

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