追加查询字符串的最佳方法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

回答

相关问题