jQuery - переспрямування з даними публікацій


81

Як я можу переадресовувати дані даних?

Як перейти на нову сторінку за допомогою $_POST?

Як це зробити? Як це робиться і навіщо це робити


6
Мені насправді дуже цікаво почути цю відповідь.
Sterling Archer

1
Неможливо встановити розташування вікон за допомогою запиту POST, лише запити GET, а також неможливо перенаправити запит POST, тому звичайним рішенням є динамічне створення форми з необхідними даними та атрибутом дії та її надсилання.
adeneo

Ви забули тег PHP, або jQuery має $_POSTзмінну?
Alex W

@ y2k, хіба це не те саме питання, що stackoverflow.com/q/8389646/632951 ?
Pacerier

Відповіді:


90

Існує плагін JQuery, який практично виконує те, що ви намагаєтесь зробити: https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js .

Після включення JQuery та плагіна jquery.redirect.min.js ви можете просто зробити щось подібне:

$().redirect('demo.php', {'arg1': 'value1', 'arg2': 'value2'});

Замість цього використовуйте наступний код у нових версіях JQuery:

$.redirect('demo.php', {'arg1': 'value1', 'arg2': 'value2'});

Сподіваюся, це допомагає!


@TimS, після перевірки цього посилання, мені все ще незрозуміло, як ви можете отримати дані на новій сторінці за допомогою повідомлення.
Yehuda Gutstein

нічого, я зрозумів це і змусив це працювати. Чудова пропозиція!
Єгуда Гутштейн

<script type = "text / javascript"> $ (). redirect (' localhost: 8080 / vabc / index.php # data / t.php? param = 12 & edit = 2 ', {'e': 'error'}) ; Не працює. У мене також є <form> з деякими іншими змінними публікацій, які спочатку публікуються на тій самій сторінці, а після обробки я використовую jquery redirect для перенаправлення на іншу сторінку з деякими новими змінними публікацій.
TommyT

19
Використовуючи jquery 2.1.3 та правильний синтаксис для мене був $ .redirect (...); Без дужок.
KDT

Тож ми не можемо перенаправляти на іншу URL-адресу та розміщувати на іншій>?
TommyT

90

Ось проста невелика функція, яку можна застосувати де завгодно, якщо ви використовуєте jQuery.

var redirect = 'http://www.website.com/page?id=23231';
$.redirectPost(redirect, {x: 'example', y: 'abc'});

// jquery extend function
$.extend(
{
    redirectPost: function(location, args)
    {
        var form = '';
        $.each( args, function( key, value ) {
            form += '<input type="hidden" name="'+key+'" value="'+value+'">';
        });
        $('<form action="'+location+'" method="POST">'+form+'</form>').appendTo('body').submit();
    }
});

Відповідно до коментарів, я розширив свою відповідь:

// jquery extend function
$.extend(
{
    redirectPost: function(location, args)
    {
        var form = $('<form></form>');
        form.attr("method", "post");
        form.attr("action", location);

        $.each( args, function( key, value ) {
            var field = $('<input></input>');

            field.attr("type", "hidden");
            field.attr("name", key);
            field.attr("value", value);

            form.append(field);
        });
        $(form).appendTo('body').submit();
    }
});

9
додати .appendTo('body')для мобільних пристроїв ... приклад: $('<form action="'+location+'" method="POST">'+form+'</form>').appendTo('body').submit();ідея, заснована на цій відповіді
CrandellWS

4
Це рішення набагато краще прийнятої відповіді imo. Це легко впровадити і не потрібно завантажувати додаткові бібліотеки!
Матей Свайгер

3
Я отримую $ .redirectPost не є помилкою функції при спробі використовувати це.
Рафікі

1
Чудова ідея з розширенням. Але ця реалізація не ухиляється від значень перед введенням їх в value=""атрибут. Таким чином, якщо значення містить лапки, воно не працює. Сама функція може бути замінений на той , який обізнаний про цитуванні, як тут: stackoverflow.com/a/5533477/1775065
cronfy

8

Чому б просто не створити форму з деякими прихованими вхідними даними та не надіслати її за допомогою jQuery? Має працювати :)


Не працюватиме із завантаженням файлів drag'n'drop. Ви не можете призначити введення файлу з міркувань безпеки.
mlt

Я не можу згадати жодної ситуації, коли ви можете перенаправити користувача кудись і змусити його завантажити файл із тим самим запитом. Але звичайно - це правда, у цьому випадку це не спрацює.
kao3991

@mlt Я не впевнений, чому це не спрацює. Ви нічого не призначаєте для введення файлу, але використовуєте інші приховані поля введення, які розміщуються одночасно з вашою формою.
Данозавр

3

До того, як документ / вікно готове, додайте "розширити" до jQuery:

$.extend(
{
    redirectPost: function(location, args)
    {
        var form = '';
        $.each( args, function( key, value ) {

            form += '<input type="hidden" name="'+value.name+'" value="'+value.value+'">';
            form += '<input type="hidden" name="'+key+'" value="'+value.value+'">';
        });
        $('<form action="'+location+'" method="POST">'+form+'</form>').submit();
    }
});

Використання:

$.redirectPost("someurl.com", $("#SomeForm").serializeArray());

Примітка: цей метод не може розміщувати файли.


2

Я думаю, що це найкращий спосіб це зробити!

<html>
<body onload="document.getElementById('redirectForm').submit()">
<form id='redirectForm' method='POST' action='/done.html'>
<input type='hidden' name='status' value='complete'/>
<input type='hidden' name='id' value='0u812'/>
<input type='submit' value='Please Click Here To Continue'/>
</form>
</body>
</html>

Це буде майже миттєво, і користувач нічого не побачить!


2

Це призведе до переадресації з опублікованими даними

$(function() {
       $('<form action="url.php" method="post"><input type="hidden" name="name" value="value1"></input></form>').appendTo('body').submit().remove();
    });

    }

функція .submit () автоматично надсилає URL-
адресу, функція .remove () вбиває форму після надсилання


1

Це потребує роз’яснень. Ваш сервер обробляє POST, який ви хочете перенаправити кудись ще? Або ви хочете перенаправити запит регулятора GET на іншу сторінку, яка очікує POST?

У будь-якому випадку ви можете зробити щось подібне:

var f = $('<form>');
$('<input>').attr('name', '...').attr('value', '...');
//after all fields are added
f.submit();

Напевно, є гарною ідеєю зробити посилання з написом "натисніть тут, якщо не переспрямовано автоматично", щоб мати справу з блокувальними вікнами.


1

Подібна до наведеної вище відповіді, але написана інакше.

$.extend(
{
    redirectPost: function (location, args) {
        var form = $('<form>', { action: location, method: 'post' });
        $.each(args,
            function (key, value) {
                $(form).append(
                    $('<input>', { type: 'hidden', name: key, value: value })
                );
            });
        $(form).appendTo('body').submit();
    }
});

0

чому б просто не використовувати кнопку, а не надсилати. натискання кнопки дозволить вам створити відповідну URL-адресу для перегляду веб-переглядача.

$("#button").click(function() {
   var url = 'site.com/process.php?';
   $('form input').each(function() {
       url += 'key=' + $(this).val() + "&";
   });
   // handle removal of last &.

   window.location.replace(url);
});

4
Це просто спричинить звичайний запит GET, оскільки URL-адреса змінюється. Початкове питання полягало в тому, щоб зробити запит POST.
pjotr_dolphin

0

Я включив плагін jquery.redirect.min.js у розділ head разом із цим рішенням json для надсилання з даними

<script type="text/javascript">     
    $(function () {
     $('form').on('submit', function(e) {
       $.ajax({
        type: 'post',
        url: 'your_POST_URL',
        data: $('form').serialize(),
        success: function () {
         // now redirect
         $().redirect('your_POST_URL', {
          'input1': $("value1").val(), 
          'input2': $("value2").val(),
      'input3': $("value3").val()
       });
      }
   });
   e.preventDefault();
 });
 });
 </script>

Потім відразу після форми я додав

 $(function(){
     $( '#your_form_Id' ).submit();
    });

Примітка: Вхідні дані повинні бути вхідними ідентифікаторами, НЕ іменами!
kpatrickos

0

Побудуйте та заповніть приховану форму = POST action = "http://example.com/vote" форму та надішліть її, а не взагалі використовуйте window.location.

або

$('#inset_form').html(
   '<form action="url" name="form" method="post" style="display:none;">
    <input type="text" name="name" value="' + value + '" /></form>');
document.forms['form'].submit();

0

"розширив" вищевказане рішення цільовим. З якоїсь причини мені потрібна була можливість перенаправити допис на _blank або інший фрейм:

$.extend(
   {
       redirectPost: function(location, args, target = "_self")
       {
           var form = $('<form></form>');
           form.attr("method", "post");
           form.attr("action", location);
           form.attr("target", target);
           $.each( args, function( key, value ) {
               var field = $('<input></input>');
               field.attr("type", "hidden");
               field.attr("name", key);
               field.attr("value", value);
               form.append(field);
           });
           $(form).appendTo('body').submit();
       }
   });
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.