jQuery-포스트 데이터로 리디렉션

81

게시물 데이터로 리디렉션하려면 어떻게해야합니까?

로 새 페이지로 이동하는 방법 $_POST?

어떻게하나요? 그것이 어떻게 이루어지고 왜 그렇게 될까요?

— y2k
소스

6

이 답변을 듣고 싶습니다.

— Sterling Archer

1

POST 요청으로 Windows 위치를 설정할 수없고 GET 요청 만 가능하며 POST 요청을 리디렉션 할 수 없으므로 일반적인 솔루션은 필요한 데이터 및 작업 속성을 사용하여 양식을 동적으로 생성하고 제출하는 것입니다.

— adeneo

PHP 태그를 잊었 $_POST습니까? 아니면 jQuery에 변수가 있습니까?

— 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'});

도움이 되었기를 바랍니다!

— 팀 S
소스

@TimS, 해당 링크를 확인한 후에도 게시물을 사용하여 새 페이지에서 데이터를 검색하는 방법에 대해 아직 명확하지 않습니다.

— Yehuda Gutstein 2013

신경 쓰지 마, 나는 그것을 알아 냈고 그것을 작동시켰다. 좋은 제안!

— Yehuda Gutstein 2013

— TommyT 2014 년

19

jquery 2.1.3을 사용하고 올바른 구문은 $ .redirect (...); 괄호없이.

— KDT

그래서 우리는 다른 URL로 리디렉션하고 다른 URL에 게시 할 수 없습니다>?

— TommyT 2015 년

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

— tfont
소스

9

추가 .appendTo('body')모바일 장치 ... 예를 들면 다음과 같습니다 $('<form action="'+location+'" method="POST">'+form+'</form>').appendTo('body').submit();에 따라 생각 이 대답

— CrandellWS

4

이 솔루션은 허용되는 답변 imo보다 훨씬 낫습니다. 구현하기 쉽고 추가 라이브러리를로드 할 필요가 없습니다!

— Matej Svajger 2015 년

3

이것을 사용하려고 할 때 $ .redirectPost가 함수 오류가 아닙니다.

— Rafiki

1

확장과 함께 좋은 아이디어. 그러나이 구현은 값을 value=""속성에 넣기 전에 값을 이스케이프하지 않습니다 . 따라서 값에 따옴표가 포함되어 있으면 작동하지 않습니다. 함수 자체는 다음과 같이 인용에 대해 인식하는 것으로 대체 할 수 있습니다. stackoverflow.com/a/5533477/1775065

— cronfy

8

숨겨진 입력이있는 양식을 만들고 jQuery를 사용하여 제출하지 않는 이유는 무엇입니까? 작동해야합니다 :)

— kao3991
소스

드래그 앤 드롭 파일 업로드에서는 작동하지 않습니다. 보안상의 이유로 파일 입력을 할당 할 수 없습니다.

— mlt

사용자를 어딘가로 리디렉션하고 동일한 요청으로 파일을 업로드하도록 할 수있는 상황은 생각할 수 없습니다. 그러나 물론 사실입니다.이 경우에는 작동하지 않습니다.

— kao3991

@mlt 왜 작동하지 않는지 잘 모르겠습니다. 파일 입력에 아무것도 할당하지 않지만 양식과 동시에 게시되는 다른 입력 숨겨진 필드를 사용합니다.

— Danosaure

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

참고 :이 방법은 파일을 게시 할 수 없습니다.

— sagie212
소스

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를 처리하고 있습니까? 아니면 POST를 예상하는 다른 페이지로 regulatr GET 요청을 리디렉션하고 싶습니까?

두 경우 모두 수행 할 수있는 작업은 다음과 같습니다.

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

팝업 차단기를 처리하기 위해 "자동으로 리디렉션되지 않으면 여기를 클릭하십시오"라는 링크를 만드는 것이 좋습니다.

— LameCoder
소스

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

URL이 변경되면 정상적인 GET 요청이 발생합니다. 원래 질문은 POST 요청을하는 것이 었습니다.

— pjotr_dolphin

0

이 json 솔루션과 함께 헤드 섹션에 jquery.redirect.min.js 플러그인을 포함하여 데이터와 함께 제출했습니다.

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

참고 : 입력은 이름이 아닌 입력 ID 여야합니다!

— kpatrickos

0

window.location을 전혀 사용하지 않고 숨겨진 method = POST action = "http://example.com/vote"양식을 구성하고 작성하여 제출하십시오.

또는

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

— 토크 라
소스