追加查詢字符串的最佳方法ajax

我正在爲網站開發ajax filtering system。追加查詢字符串的最佳方法ajax

最終用戶選擇過濾器的點已經在URL上有一個查詢字符串。

我想獲得這個查詢字符串並追加我的數據，我需要輸入名稱&值。

我目前所擁有的JS，這是我知道的一份懶散工作 - JS並不是我的強項！

$("#narrowSearch").submit(function(event) { 

    function checkInputs(){ 
     var $checkboxes = $("input:checkbox"); 

     var opts = []; 

     $checkboxes.each(function(){ 
      if (this.checked){ 
       opts.push(this.value); 
      } 
     }); 
    return opts; 
    } 
    var opts = checkInputs(); 
    if(document.location.search.length) { 
     opts += getUrlVars(); 
    } 
    updateVenues(opts); 

    event.preventDefault(); 
}); 

    function updateVenues(opts){ 
    $.ajax({ 
     type: "POST", 
     url: "/venue-search/ajax/", 
     dataType : 'json', 
     cache: false, 
     data: opts, 
     success: function(records){ 
     $("#searchResults").empty(); 
     $.each(records, function(idx, record){ 
     $("#searchResults").append('<section class=\"griditem\"><a href=\"/venue-preview/'+record.id+'" class=\"various fancybox.ajax\"><span class=\"listing_img\"><img src=\"<?php echo MEDIAURL; ?>'+record.main_image+'\"><span class=\"listing_title\">'+record.title+'</span></span></a></section>'); 
     }); 
     } 
    }); 
    } 
    function getUrlVars() 
{ 
var vars = [], hash; 
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
for(var i = 0; i < hashes.length; i++) 
{ 
    hash = hashes[i].split('='); 
    vars.push(hash[1]); 
    vars[hash[0]] = hash[1]; 
} 
return vars; 
}

用此，它當前返回查詢字符串爲：camping1,TF74AA,20:。 1,TF74AA,20是當前查詢字符串，露營是在過濾之前選中的複選框。正如你所看到的，野營& 1之間沒有逗號。此外，這不包括任何名稱，只有值。

理想情況下，我想查詢字符串是：

?name=value&name=value或JSON format，然後我可以分析它的服務器端，並返回一個JSON響應。

我一直在尋找一個基於我期待實現的教程，但我很掙扎。因此，我使用各種教程，並從每個部分。

我希望我解釋得不錯。

來源

2014-08-29 Telford Computer-DoctorLtd

不要使用查詢字符串，請爲每個參數使用具有屬性的對象。 jQuery會自動將它轉換爲一個查詢字符串。 – Barmar 2014-08-29 13:18:41

好吧，所以對你的建議的工作表單數據現在顯示爲'[object object] [object Object]' – 2014-08-29 13:27:28

不要使用FormData，只需使用普通的Javascript對象。 '{name1：value1，name2：value2，...}' – Barmar 2014-08-29 13:30:35

我建議使用window.location.search.substring(1)從當前URI獲取查詢字符串（注意substring(1)部分刪除了?）。

然後我會把它放到javascript對象中。有jQuery插件可以做到這一點，或者你可以建立自己的。看到這個問題的一些想法 - The $.param() inverse function in JavaScript/jQuery。

您現在有一個JavaScript對象，它代表您的過濾條件。您可以根據用戶交互的需要修改此對象，然後使用$.param()序列化爲JSON或返回查詢字符串，或者將對象作爲data屬性傳遞給您的$.ajax()調用，並將其序列化爲通過jQuery查詢字符串。

來源

2014-08-29 13:27:25

追加查詢字符串的最佳方法ajax

回答

相關問題