2014-09-29 19 views
0

我有一個HTML表單,我試圖使用Jquery load()函數進行提交。我有一個領域的工作,但我花了幾個小時試圖讓它適用於多個領域,包括一些複選框。使用jquery ajax load()傳輸多個數據字段

我已經看過很多例子,似乎有大約四的三種方式接近這一點: jQuery的.load() jQuery的阿賈克斯()jQuery的 .submit()

和其他一些人。我不確定每種方法的優點是什麼,但我遵循的第一個示例使用了.load(),所以這就是我一直堅持的。總體目標是提交一些搜索條件並返回數據庫搜索結果。

我有什麼目前:

<code> 
// react to click on Search Button 
$("#SearchButt").click(function(e){ 

var Options = '\"'+$("#SearchText").val()+'\"' ; 

var TitleChk = $("#TitleChk").prop('checked'); 
if (TitleChk) Options += ', \"TitleChk\": \"1\"'; 

// load returned data into results element 
$("#results").load("search.php", {'SearchText': Options}); 

return false; //prevent going to href link 
}); 
</code> 

我得到的是附加在第一第二個參數。

有沒有辦法讓每個參數作爲單獨的POST項目發送,還是我不得不在PHP端將它拉開?

回答

0

看起來好像你在包裝紙上磕磕絆絆,讓我們繼續,只是使用原始的$.ajax(),這將變得更加清晰。

$("#SearchButt").click(function(e){ 
    var Options = {}; 
     Options.text = $('#SearchText').val(); 
     Options.title = $('#Titlechk').prop('checked')) ? 1: 0; //ternary with a default of 0 

    $.ajax({ 
     url: 'search.php', 
     type: 'POST', 
     data: Options 
    }).done(function(data){ 
     $('#results').html(data); //inject the result container with the server response HTML. 
    }); 
    return false; 
}); 

現在在服務器端,我們知道$_POST已經填充了2鍵值對,分別是texttitle

+0

e.preventDefault()代替返回false;除非你想停止事件泡泡(傳播)。 – 2014-09-29 07:45:46

+0

非常好 - 謝謝。使用.load()方法的目的是什麼?我花了幾秒鐘來解碼你的用戶名:-) – 2014-09-29 08:17:08

+0

@DavidG'.load()'只是一個包裝,僅此而已。儘管它有一個特殊的用途,但它允許您通過在請求中附加選擇器來定位頁面並僅返回特定的元素及其子元素。但是,對於您的情況,這不是必需的,因此這種方法更透明一些。 :) – Ohgodwhy 2014-09-29 16:36:27

相關問題