jQuery - Mit Post-Daten umleiten

81

Wie kann ich mit Post-Daten umleiten?

Wie gehe ich mit zu einer neuen Seite $_POST?

Wie macht man das? Wie wird es gemacht und warum soll es gemacht werden

javascript jquery html post y2k
quelle
6
Ich bin eigentlich sehr interessiert, diese Antwort zu hören.
Sterling Archer
1
Es ist nicht möglich, den Windows-Speicherort mit einer POST-Anforderung festzulegen, sondern nur mit GET-Anforderungen, und es ist nicht möglich, eine POST-Anforderung umzuleiten. Daher besteht die übliche Lösung darin, dynamisch ein Formular mit den erforderlichen Daten und Aktionsattributen zu erstellen und es zu senden.
Adeneo
Vergessen Sie das PHP-Tag oder hat jQuery eine $_POSTVariable?
Alex W
@ y2k, Ist das nicht die gleiche Frage wie stackoverflow.com/q/8389646/632951 ?
Pacerier

Antworten:

90

Es gibt ein JQuery-Plug-In, das genau das erreicht, was Sie versuchen: https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js .

Nachdem Sie JQuery und das Plug-In jquery.redirect.min.js eingefügt haben, können Sie einfach Folgendes tun:

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

Verwenden Sie stattdessen den folgenden Code für neuere JQuery-Versionen:

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

Hoffe das hilft!

Tim S.
quelle
@TimS, nachdem ich diesen Link ausgecheckt habe, ist mir immer noch unklar, wie Sie die Daten auf der neuen Seite per Post abrufen können.
Yehuda Gutstein
egal, ich habe es herausgefunden und es zum Laufen gebracht. Toller Vorschlag!
Yehuda Gutstein
<script type = "text / javascript"> $ (). redirect (' localhost: 8080 / vabc / index.php # data / t.php? param = 12 & edit = 2 ', {'e': 'error'}) ;; Funktioniert nicht Ich habe auch ein <Formular> mit einigen anderen Post-Variablen, die zuerst auf derselben Seite posten, und nach der Verarbeitung verwende ich jquery redirect, um mit einigen neuen Post-Variablen auf eine andere Seite umzuleiten.
TommyT
19
Mit jquery 2.1.3 und der richtigen Syntax für mich war $ .redirect (...); Ohne die Klammer.
KDT
Wir können also nicht zu einer anderen URL umleiten und zu einer anderen posten>?
TommyT
90

Hier ist eine einfache kleine Funktion, die überall angewendet werden kann, solange Sie jQuery verwenden.

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();
    }
});

Gemäß den Kommentaren habe ich meine Antwort erweitert:

// 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();
    }
});
tfont
quelle
9
.appendTo('body')für mobile Geräte hinzufügen ... Beispiel: $('<form action="'+location+'" method="POST">'+form+'</form>').appendTo('body').submit();Idee basierend auf dieser Antwort
CrandellWS
4
Diese Lösung ist viel besser als die akzeptierte Antwort imo. Es ist einfach zu implementieren und es müssen keine zusätzlichen Bibliotheken geladen werden!
Matej Svajger
3
Ich erhalte $ .redirectPost ist kein Funktionsfehler, wenn ich versuche, dies zu verwenden.
Rafiki
1
Tolle Idee mit verlängern. Diese Implementierung entgeht jedoch nicht den Werten, bevor sie in ein value=""Attribut eingefügt werden. Wenn der Wert also Anführungszeichen enthält, funktioniert dies nicht. Die Funktion selbst kann durch eine ersetzt werden, die sich des Zitierens bewusst ist, wie hier: stackoverflow.com/a/5533477/1775065
cronfy
8

Warum nicht einfach ein Formular mit versteckten Eingaben erstellen und mit jQuery senden? Sollte arbeiten :)

kao3991
quelle
Funktioniert nicht mit Uploads von Drag'n'Drop-Dateien. Sie können aus Sicherheitsgründen keine Dateieingabe zuweisen.
Mlt
Ich kann mir keine Situation vorstellen, in der Sie Benutzer irgendwohin umleiten und sie dazu bringen möchten, eine Datei mit derselben Anfrage hochzuladen. Aber natürlich - es ist wahr, es wird in diesem Fall nicht funktionieren.
kao3991
@mlt Ich bin mir nicht sicher, warum es nicht funktionieren würde. Sie weisen der Dateieingabe nichts zu, verwenden jedoch andere versteckte Eingabefelder, die gleichzeitig mit Ihrem Formular veröffentlicht werden.
Danosaure
3

Bevor das Dokument / Fenster fertig ist, fügen Sie "Erweitern" zu jQuery hinzu:

$.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();
    }
});

Verwenden :

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

Hinweis: Diese Methode kann keine Dateien veröffentlichen.

sagie212
quelle
2

Ich denke, das ist der beste Weg, es zu tun! 

<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>

Dies wird fast augenblicklich sein und der Benutzer wird nichts sehen!

Prashant Singh
quelle
2

Dies würde mit den veröffentlichten Daten umleiten

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

    }

Die Funktion .submit () führt das
Senden an die URL automatisch durch. Die Funktion .remove () beendet das Formular nach dem Senden

Tobiloba
quelle
1

Dies bedarf der Klärung. Verarbeitet Ihr Server einen POST, den Sie an eine andere Stelle umleiten möchten? Oder möchten Sie eine reguläre GET-Anfrage auf eine andere Seite umleiten, die einen POST erwartet?

In beiden Fällen können Sie Folgendes tun:

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

Es ist wahrscheinlich eine gute Idee, einen Link mit der Aufschrift "Hier klicken, wenn nicht automatisch umgeleitet" zu erstellen, um Popup-Blocker zu behandeln.

LameCoder
quelle
1

Ähnlich wie bei der obigen Antwort, jedoch anders geschrieben.

$.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();
    }
});
Alan
quelle
0

Warum nicht einfach eine Schaltfläche verwenden, anstatt zu senden? Durch Klicken auf die Schaltfläche können Sie eine geeignete URL erstellen, zu der Ihr Browser umleiten kann.

$("#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);
});
Radney Aaron Alquiza
quelle
4
Dies führt nur zu einer normalen GET-Anforderung, wenn sich die URL ändert. Die ursprüngliche Frage war, eine POST-Anfrage zu stellen.
pjotr_dolphin
0

Ich habe das Plugin jquery.redirect.min.js zusammen mit dieser json-Lösung in den Kopfbereich aufgenommen, um sie mit Daten einzureichen

<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>

Dann sofort nach dem Formular habe ich hinzugefügt

 $(function(){
     $( '#your_form_Id' ).submit();
    });
kpatrickos
quelle
Hinweis: Eingaben sollten Eingabe-IDs sein, NICHT Namen!
Kpatrickos
0

Erstellen Sie ein ausgeblendetes Formular method = POST action = "http://example.com/vote", füllen Sie es aus und senden Sie es ab, anstatt überhaupt window.location zu verwenden.

oder

$('#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();
Daniel Kennedy
quelle
0

"erweiterte" die obige Lösung mit Ziel. Aus irgendeinem Grund brauchte ich die Möglichkeit, den Beitrag auf _blank oder einen anderen Frame umzuleiten:

$.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();
       }
   });
ThoCra
quelle