Datatables query in jquery

Datatables query in jquery

brahmasanibrahmasani Posts: 11Questions: 2Answers: 0

Hi,
I am using jquery data tables, in that i have used the one column to expand the row and collapse but when i try to do search on the expanded field values it is not working. Can you help me on this please.

Thanks in advance
Siva

Answers

  • brahmasanibrahmasani Posts: 11Questions: 2Answers: 0

    if the question is not clear please point me the that also. its very urgent for me. Please help me out.

  • mRendermRender Posts: 151Questions: 26Answers: 13

    Can you post your website or a test case or something so people can troubleshoot your issue?

    See this post for instructions: https://www.datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read#latest

  • brahmasanibrahmasani Posts: 11Questions: 2Answers: 0
    edited August 2014
    "aoColumns": [
    
    
    //first coloumn
                 {
    
                    "mDataProp": null,
                    "sClass":'control center',
                    "sDefaultContent": '<img src="'+sImageUrl+'arrow_up.png'+'">'
                },
                { "mDataProp": "listing.competitor", "sTitle": "Competitor" },
                { "mDataProp": "listing.marketplace", "sTitle": "Market Place" },
                { "mDataProp": "", "sTitle": "URL" },
                { "mDataProp": "", "sTitle": "ZIPCODE" },
                { "mDataProp": "listing.asin", "sTitle": "Asin", "sWidth" : "30px",  "bUseRendered": false, "fnRender": function ( o, val ) {
                                                                        return '<a href="#" onClick="getListingDetails(\''+ o.aData.listing.asin 
                                                                                                +'\',\''+ o.aData.listing.competitor +'\')">' + val + '</a>';
                                                                        } },
                { "mDataProp": "attributes.crawlType", "sTitle": "Crawl Type" },
                { "mDataProp": "createdOn", "sTitle": "Created On", "fnRender": function ( o, val ) {
                                                                            return getDateFromSeconds(val);
    
    
    
    
    //expanded row details
    function fnFormatDetails( oTable, nTr )
    {
      var oData = oTable.fnGetData( nTr );
      var sOut ='<div class="innerDetails">'+
      '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;"><thead>'+
      '<tr>'+
      '<th class="sorting" tabindex="0" rowspan="1" colspan="1" style="width: 158px;" aria-label="Matching Type: activate to sort column ascending">Matching Type</th>'+
      '<th class="sorting" tabindex="0" rowspan="1" colspan="1" style="width: 185px;" aria-label="NameSpace: activate to sort column ascending">NameSpace</th>'+
      '<th class="sorting" tabindex="0" rowspan="1" colspan="1" style="width: 73px;" aria-label="Qualifier: activate to sort column ascending">Qualifier</th>'+
      '<th class="sorting" tabindex="0" rowspan="1" colspan="1" style="width: 134px;" aria-label="Source: activate to sort column ascending">Source</th>'+
      '<th class="sorting" tabindex="0" rowspan="1" colspan="1" style="width: 94px;" aria-label="Exit Node: activate to sort column ascending">Exit Node</th>'+
      '</tr>'+'<tr><td>'+oData.attributes.matchingType+'</td><td>'+oData.attributes.namespace+'<td>'+oData.attributes.qualifier+'</td><td>'+oData.attributes.source+'</td></tr>'+   
      '</thead></table></div>';
    
      return sOut;
    }
    
    
    
    //to get the expand row
    $('#detailTable td.control').live('click', function () {
             var nTr = this.parentNode;
        
             
             var i = $.inArray( nTr, anOpen );
             
             if ( i === -1 ) {
                $('img', this).attr( 'src', sImageUrl+"arrow_down.png" );
                oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
                anOpen.push( nTr );
              }
              else {
                $('img', this).attr( 'src', sImageUrl+"arrow_up.png" );
                oTable.fnClose( nTr );
                anOpen.splice( i, 1 );
              }
    } );                                                
    
  • allanallan Posts: 62,944Questions: 1Answers: 10,356 Site admin

    As in you want to use DataTables' searching abilities for the content in the child rows? That isn't possible. DataTables search will only search on the data in the parent rows. If you want the child row data included in the search data, you would need to put it in a hidden column.

    Allan

    p.s. For urgent support requests - priority support is available

  • brahmasanibrahmasani Posts: 11Questions: 2Answers: 0

    HI Allan,
    Thanks for the reply. Can you help me how can i make the data search on child row also. In my table i used the different table for the child rows. But i am using same table tool (same data table) for both child row and parent row.

    Thanks
    Siva Brahmasani

  • allanallan Posts: 62,944Questions: 1Answers: 10,356 Site admin

    Can you help me how can i make the data search on child row also

    As I said, DataTables doesn't have that ability. As I also said, do to that, you would need to put the searchable content in a hidden column.

    Allan

  • brahmasanibrahmasani Posts: 11Questions: 2Answers: 0

    ok thanks allan, I will try that option.

    And i have asked one more question yesterday, i did not get the response.

    The link is http://datatables.net/forums/discussion/22715/datatables-query-in-jquery#latest

    Can you help me on this

    Thanks in advance
    Siva Brahmasani

  • larsonatorlarsonator Posts: 54Questions: 4Answers: 2

    What you could do is use serverside processing and search for it in your sql query.

This discussion has been closed.