Datatables for serverside response with custom searching

Question

I have used gem 'jquery-datatables-rails' .

We are using it for server side response. We are using railscast #340 for datatables.

Initalizing datatable as

jQuery ->
  $('#products').dataTable
    sPaginationType: "full_numbers"
    bJQueryUI: true
    bProcessing: true
    bServerSide: true
    sAjaxSource: $('#products').data('source')

It is working fine with the listing.

We have a custom search functinality for the table. We do not use the search method in datatable.

We are posting the data to search with a new method and trying to redraw the table. But it does not do anything.

How can We show the results in datatable?

Any help is appreciated .

Thanks

EDIT

We have a listing page where normal datatable is added for listing with server side response.

A search form is placed on the datatable like this

Search form

<form action="search_path" method="post" id="search_token_form" data-remote="true">
<input type="textbox"  name="name"/>
<select name="type">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select> 
<input type="textbox" name="date">
<input type="submit">
</form>

Datatable

<table id="products">
<thead>
 <tr>
  <th>Name</th>
  <th>Type</th>
  <th>Date</th>
 </tr>
</thead>

<tbody></tbody>
</table>

We are posting the search form to another action in rails and collecting the result data.

How can we replace the datas found from the action in listing datatable ?

javascript

$(document).on("submit", "#search_token_form", function(e){

        e.preventDefault();
        var key1 = $("#_email_or_name").val();
        var key2 = $("#_token_type").val();
        var key3 = $("#_look_up_token").val();
        var key4 = $("#_check_date").val();
        var key5 = $("#_date_range").val();
        var key6 = $("#_check_date_range").val();
        var key7 = $("#_from_date").val();
        var key8 = $("#_to_date").val();

        var data_params = {
            "sEcho": 1,
                "email_or_name": key1,
                "token_type": key2,
                "look_up_token": key3,
                "check_date": key4,
                "date_range": key5,
                "check_date_range": key6,
                "from_date": key7,
                "to_date": key8,
                "format": "json"

        }

        $("#search_params").val(data_params);

        $.ajax({
            url: '/tokens/search_token_result',
            method: 'post',
            dataType: 'JSON',
            async: false,
            data:data_params,
            success: function (data){
                table.fnClearTable();
                table.fnAddData(data.aaData);
                table.fnDraw();

//                for(i=0; i < data.aaData.length; i++){
//                    new_table.fnUpdate( data.aaData[i], i );
//                }
////                return false;

            },
            failure: function (msg) {
                console.log("Error in sending the data");
            }
        });

This is the script where we do ajax call for pushing input values and getting results.

But the issue is after updating the reocrds. It reinitializes the datatable as before. It means datatable loose our search results.

How can I solve this ?

I have form over the datatable having 4-5 fields to search. Need to search data and populate the records on the datatable. — Debadatt, Jun 11 '14 at 12:21
please detail what you are doing at the moment when you say 'trying to redraw the table' — ZenCodr, Jun 12 '14 at 00:30
Sorry, your question isn't clear. I don't see your problem? What have you tried? What isn't working? Maybe if you setup your ruby search function to be called via ajax from js, then you can just slot the source into $().DataTable().ajax.url('source').load() — ZenCodr, Jun 12 '14 at 11:06

Datatables for serverside response with custom searching

0 Answers0