Rails 3: обновление параметров URL с помощью AJAX-запроса

У меня есть фильтр и список продуктов (id, name, creation_date).

Я могу фильтровать по id, имени или creation_date. С помощью AJAX-запроса я обновляю содержимое div... но очевидно, что URL не изменится.

Как добавить параметры в URL? Например: 

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

Я знаю, что история.pushState (html5) существует... но мне нужно, чтобы мое приложение работало в браузерах html4, таких как IE9.

Я попробовал Wiselinks (https://github.com/igor-alexandrov/wiselinks ) который он использует История.js, но он не использует AJAX-запрос.

Есть идеи?

Спасибо

3 2
url ruby-on-rails ruby-on-rails-3 ajax

3 ответа:

Наконец, я следую этим учебным пособиям по железнодорожным передачам:

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

3

Вы делаете некоторые 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();
});
0

Прошло много времени, но это может оказаться полезным. Код также обновляется, так что если у вас есть более чем одна ссылка ajax\remote, вы сможете объединить параметры нескольких URL-адресов. На основе ответа user1364684 и этого для комбинированных url.

# 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);
});
0