2011-11-24 4 views
2

Я использую datatables в приложении rails 3.1. Datatables настроен для работы на стороне сервера. Я использую ajax-запросы для получения данных с сервера, а затем отображать их в таблице.meta_search + datatables

Я использую meta_search как фильтр для получения данных из базы данных.

Вот код на мой взгляд:

= simple_form_for @search, :url => offer_coupons_path(@offer), :html => {:method => :get} do |f| 
= f.select :redeemed_equals, [['All Coupons', '']] + [["Redeemed", true], ["Not Redeemed", false]] 

Вот метод в контроллере:

def offer_coupons_list 
    search_params = params[:search] || {"meta_sort"=>"user_full_name.asc"} 
    @search = Coupon.search(search_params) 
    @coupons = @search.includes(:user).includes(:order => :gift).page(@page) 
    render :partial => 'coupons/offer_coupons_list' 
end 

А вот Javascript отвечает за отправку AJAX запрос на сервер:

$("#search_redeemed_equals").change(function(e){ 
    table = $("#grid").dataTable(); 
    var data = $("#search_redeemed_equals").parents("form:first").serialize(); 
    $.ajax({ 
     'url': 'coupons/offer_coupons_list', 
     'data': data, 
     'type': 'POST' 
    }); 
    table.fnDraw(); 
    e.preventDefault(); 
}); 

Проблема заключается в том, что скрипт отправляет на сервер два запроса ajax. Первый запрос верен и возвращает отфильтрованные данные. Другой запрос отправляется при вызове fnDraw() и возвращает не фильтрованные данные. Таким образом, данные в таблице не изменяются. Запрос отправляется каждый раз, когда вызывается любая из функций datatables. Как я могу решить проблему?

ответ

0

Я думаю, что проблема в том, что вы инициализируете таблицу внутри обработчика событий, и поэтому вы вызываете сервер дважды.

$("#search_redeemed_equals").change(function(e){ 
    table = $("#grid").dataTable();//one call to the server and you use a global variable! 
    var data = $("#search_redeemed_equals").parents("form:first").serialize(); 
    $.ajax({ 
     'url': 'coupons/offer_coupons_list', 
     'data': data, 
     'type': 'POST' 
    }); 
    table.fnDraw();//second call 
    e.preventDefault(); 
}); 

я думаю, вы должны вынуть inizialization

var table = $("#grid").dataTable(); 

$("#search_redeemed_equals").change(function(e){ 
    table = $("#grid").dataTable();//one call to the server and you use a global variable! 
    var data = $("#search_redeemed_equals").parents("form:first").serialize(); 
    $.ajax({ 
     'url': 'coupons/offer_coupons_list', 
     'data': data, 
     'type': 'POST' 
    }); 
    table.fnDraw();//second call 
    e.preventDefault(); 
}); 

, если вы уже инициализировать таблицу в другой части вашей страницы, просто назначить таблицу в яваскрипте переменного и вызвать fnDraw на этом