Question

我有一个过滤器和一个产品列表（id，name，creation_date）。

我可以按id，name或creation_date进行过滤。通过AJAX请求，我更新了一个内容div ...但显然URL没有改变。

如何将params附加到URL？例如：

localhost:3000/dashboard/catalog?name=radio&?date_creation=23-06-2013

我知道history.pushState（html5）存在...但我需要我的应用程序在IE9等html4浏览器中运行。

我尝试过使用History.js的Wiselinks（https://github.com/igor-alexandrov/wiselinks），但它没有使用AJAX请求。

有什么想法吗？

感谢

Answer 1

最后，我遵循那些RailsCasts教程：

http://railscasts.com/episodes/240-search-sort-paginate-with-ajax?language=es&view=asciicast

http://railscasts.com/episodes/246-ajax-history-state?language=es&view=asciicast

Answer 2

你正在做一些AJAX调用方法，你必须在单选按钮更改

上调用AJAX部分

所以我假设，你是通过单选按钮完成的，单选按钮的名称是'choose_product'

您可以在视图中添加隐藏字段，您可以在其中存储当前日期。

<div id='parentDiv'>
 <%= hidden_field_tag 'current_date', Time.now.strftime('%d-%m-%Y') %>
 Your radio button code
</div>

在javascript中添加以下代码。这只是一个不完整的解决方案。

$(document).ready(function(){
 var showProducts = function(){
  $("#parentDiv").on('click', "input[name='choose_product']", function(){
   var ajax_url = 'localhost:3000/dashboard/catalog';
   var url_param = '';

   switch($(this).val()){
    case 'creation_date':
     var param_date = $('#current_date').val();
     url_param = '?name=radio&date_creation=' + param_date;     
     break;
    case 'name':
     // Your code goes here
    default:
     //Your code goes here
   }

   // Here you will get the modified url dynamically
   ajax_url += url_param

   $.ajax({
    url: ajax_url,
    // your code goes here
   }); 
  });
 }

 showProducts();
});

Answer 3

很多时间过去了，但它可能很有用。代码也会更新，所以如果你有一个以上的ajax \ remote链接，你就可以合并多个url的参数。基于user1364684 answer和this for combined urls。

# change ".someClassA" or "pagination" to the a link of the ajax elemen
$(document).on('click', '.someClassA a, .pagination a', function(){
    var this_params = this.href.split('?')[1], ueryParameters = {},
        queryString = location.search.substring(1), re = /([^&=]+)=([^&]*)/g, m;

    queryString = queryString + '&' + this_params;

    #Creates a map with the query string parameters
    while m = re.exec(queryString)
        queryParameters[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);

    url = window.location.href.split('?')[0] + "?" + $.param(queryParameters);

    $.getScript(url);
    history.pushState(null, "", url);

    return false;
});

# make back button work 
$(window).on("popstate", function(){
    $.getScript(location.href);
});

Rails 3：使用AJAX请求更新URL params

3 个答案: