2010-10-02 69 views
15

我有一個頁面(page 1),它接受post請求,做一些東西,並在最後顯示一些數據。jquery - 同步提交後(不是ajax)

從另一頁(page 2),我想重定向到page 1單擊按鈕時,當然通過POST發送page 1所需的所有相關數據。

當然,我可以在頁面上使用舊的隱藏窗體,使用jquery填充所有需要的數據,在用戶點擊按鈕之後填充並自動提交()。 但是看起來很麻煩 - 使用類似於$.post的語法更好,而不是開始操作html。 $.post將是完美的,如果它實際上重定向到頁面並且不會異步地發出請求(由於page 1需要數據顯示某些內容,所以在ajaxy發佈完成後,我不能只重定向到page 1)。

有沒有辦法用jquery做我想要的,還是醜陋的不可見形式是唯一的出路?

PS

我知道有使用$.post實現我想要的東西,比如,只是種植響應的HTML中,我們目前所在的頁面的其他令人費解的方式,但我只是想知道,如果有一個直截了當用jquery做這件事的方法

回答

0

我想答案是沒有直接的方法。對於增加此功能的一般功能,請參閱Greg W的答案。

0

如果你必須發出一個POST請求,那麼這個不可見的窗體就是你最好的選擇之一。

如果您的應用程序將與GET請求一起工作,我會將數據編碼到查詢字符串中並執行。

document.location.href =

您可以使用jQuery.serialize生成的查詢字符串。

-2

HTML:

<form id="myform" method="get" acction="page2"> 
    <!-- data --> 
</form> 

JS:

$('#myform').bind('submit', function(ev) { 

    ev.stopPropagation(); 

    var ok = true; 
    //manipulate html and 'ok' 

    return ok; // if ok == false, don't execute post 


}); 
15

這給了我一個想法有點jQuery函數像你描述模仿$。員額行爲。它仍然在後臺使用不可見的形式,但是它的語法相對簡潔明瞭。

$(document).ready(function(){ 
    $('#myButton').PostIt('post.php', {foo:'bar', abc:'def', life:42}); 
    $('#myOtherButton').PostIt('post.php', dataObjectFromSomewhereElse); 
}); 

$.fn.PostIt = function(url, data){ 

    $(this).click(function(event){ 

     event.preventDefault(); 

     $('body').append($('<form/>', { 
      id: 'jQueryPostItForm', 
      method: 'POST', 
      action: url 
     })); 

     for(var i in data){ 
      $('#jQueryPostItForm').append($('<input/>', { 
      type: 'hidden', 
      name: i, 
      value: data[i] 
      })); 
     } 

     $('#jQueryPostItForm').submit(); 
    }); 
} 
+0

我意識到這只是一個例子,但是根據規範,在你的JSON對象的鍵應該是字符串和就像這樣用引號包圍。當我第一次遇到JSON時,這種事情讓我頭痛不已。 ;-) – Flo 2010-11-16 09:20:15

+0

有趣。除非密鑰本身是'class'之類的保留字,否則我從來不需要在我的JSON密鑰中加引號。我認爲在所有方面加上引號是保證你永遠不會有這個問題的一種方法,但我更喜歡它看起來像無引號的方式。 – 2010-11-22 15:50:21

+0

有關該主題的更多信息:http://stackoverflow.com/questions/2348867/why-are-some-object-literal-properties-quoted-and-others-not – 2011-05-11 11:18:17

9

我適應格雷格·W公司代碼直功能,你可以在你的代碼中調用:

function postIt(url, data){ 

    $('body').append($('<form/>', { 
     id: 'jQueryPostItForm', 
     method: 'POST', 
     action: url 
    })); 

    for(var i in data){ 
     $('#jQueryPostItForm').append($('<input/>', { 
     type: 'hidden', 
     name: i, 
     value: data[i] 
     })); 
    } 

    $('#jQueryPostItForm').submit(); 
} 
+1

您必須刪除行 event.preventDefault(); – 2012-05-12 15:13:51

+0

完成,謝謝lulhuh。 – crizCraig 2012-05-15 22:30:41