I can't get my Individual Column Search working

Marina06 · February 2015

Hi again :D

I can't get my Individual Column Search working...
My bottom TH cells do display the inputs where needed, but on blur/change/keyup, nothing happends...

EDIT : Console : Undefined is not a functio - corresponding to " oTable.columns().eq( 0 ).each( function ( colIdx ) {"

Thank u :))

 $('#datos tfoot th').not(":eq(0),:eq(3),:eq(5),:eq(6)") //Exclude columns  
                         .each( function () {
                                                var title = $('#example thead th').eq( $(this).index() ).text();
                                                $(this).html( '<input type="text" placeholder="Rechercher" />' );
                                            });
      var oTable = $('#datos').dataTable();
      
       oTable.columns().eq( 0 ).each( function ( colIdx ) {
        if (colIdx == 0 || colIdx == 3 || colIdx == 5 || colIdx == 6) return; //Do not add event handlers for these columns

        $( 'input', table.column( colIdx ).footer() ).on( 'keyup blur change', function () {  oTable
                                                                                              .column( colIdx )
                                                                                              .search( this.value )
                                                                                              .draw();
                                                                                            });
    });

tangerine · February 2015

$( 'input', table.column( colIdx ).footer() )

Your "table" variable is oTable, not table.

Marina06 · March 2015

Hi, Thanks for the correction,; sorry oops.
But it still doesn't work and I remain with Undefined is not a function... :s

daniel_r · March 2015

You can also try my yadcf plugin, see showcase

Marina06 · March 2015

Thank u ! ;) I'll check that tomorrow and will let u know

Marina06 · March 2015

Hi Everybody ,
I've tried to make my js match the several examples I found on yadcf , but... I can't get it work either.

I get unexpected results such as :
column 0 which contains a select instead of being not searchable,

column 1 is ok as it contains an input type ='text' but nothing happends when I type something in,

column 2 contains a select as per my requirement, but <options> are empty

column 3, 5, 6 are empty of input and select (this is ok)

column 4 is supposed to contain a select, but it doesn't actually.

Thanks for your help, any kind of solution is accepted.

```
$(document).ready(function() {

'use strict';

oTable= $('#datos').dataTable({ // tried with DataTable
"sAjaxSource": 'ajx/datatables_process.php',
bProcessing: true,
bServerSide: true,
"bStateSave": true,

"aaSorting": [[ 3, "desc" ]],

"lengthMenu": [[15, 25, 50, -1], [15, 25, 50, "Afficher tout"]],

"aoColumns": [
                {"bSearchable":false}, // job_id
                {"bSearchable":true}, // job_intitulé
                {"bSearchable":true}, // job_contrat
                {  // job_date_insertion
                   "bSearchable":true,
                  "aTargets": [ 3 ], "aaSorting": [[ 3, "desc" ]],
                   "mRender": function(date, type, full) {return moment(date).format('DD-MM-YYYY'); }                    
                }, 
               { // job_cp + ville
                 "bSearchable":true,
                 "aTargets": [ 4 ] ,  
                  "mData": 4 ,  
                  "mRender" : function ( data, type, full ) 
                             {  var texte=  data+' '+full[5];
                                var sReturn = full[0];
                                return "<a href='../offredemploi.php?id="+sReturn+"' target='_Blank'>"+ texte + "</a>"; }
               },
               null, // job_date_descriptif
               { // VOIR
                 "bsortable" : false,
                 "ordering": false,
                 "mRender": function(data,type) 
                             { var sReturn = data;
                               return "<a href='../offredemploi.php?id="+sReturn+"' target='_Blank'> Voir </a>";
                             }  , "mData": null,
                            "sDefaultContent": " ",                
               }
              ] ,




    "spaginationType" :  "full_numbers",
    language: {
                processing:     "Traitement en cours...",
                search:         "Rechercher&nbsp;:",
                lengthMenu:    "Afficher _MENU_ &eacute;l&eacute;ments",
                info:           "Affichage de l'&eacute;lement _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
                infoEmpty:      "Affichage de l'&eacute;lement 0 &agrave; 0 sur 0 &eacute;l&eacute;ments",
                infoFiltered:   "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                infoPostFix:    "",
                loadingRecords: "Chargement en cours...",
                zeroRecords:    "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable:     "Aucune donnée disponible ",
                paginate: {
                            first:      "Premier",
                            previous:   "Pr&eacute;c&eacute;dent",
                            next:       "Suivant",
                            last:       "Dernier"
                        }

            } 



}).yadcf ( [
                {column_number : 0},
                {column_number: 1,  filter_type: "auto_complete",  text_data_delimiter: "," }, 
                {column_number: 2, select_type: 'chosen', select_type_options: { no_results_text: 'Can\'t find ->',
                                                                                 search_contains: true
                                                                                }
                },
                {column_number : 3},
                {column_number : 4, filter_type: "auto_complete",  text_data_delimiter: "," }, 
                {column_number : 5},
                //{column_number : 6}
              ], 'footer'
             );


 var oTable = $('#datos').dataTable();  
oTable.fnSetColumnVis( 5, false );
$('thead th:last-child').unbind();

});

daniel_r · March 2015

If you set a column to be a "bSearchable":false it wont be filterabale, so remove the column_number : 0 from yadcf constructor, also in case that you using chosen for select filter you must include chosen js/css/images and in case you are using filter_type: "auto_complete" you must include jquery ui js/css

Marina06 · March 2015

Hi Daniel,
Thanks for your explanations.

Almost everything works fine now but the auto_complete doesn't : when I start typing nothing happends with the latest version of jquery ui.
With UI version 1.11.2, I had "no search results".
(jquery ui js+css are included,and bJQueryUI : true ).

so I use "text" instead -

Great plugins Allan and Daniel_R, amazing brains :)

daniel_r · March 2015

bJQueryUI is related to datatables styling and not related in any way to yadcf, you can try grabbing the jquery / ui version that I used in yadcf showcase to see if it solve your auto complete issues

Marina06 · March 2015

Ok. Even with the same versions of UI et JS as those used in your demos, auto_complete doesn't filter nothing.
I've tried with enable_auto_complete too, but no result either...

daniel_r · March 2015

If you provide a jsbin/jsfiddle sample I'll be able to look at it, because the auto complete filter should be very easy to setup

Marina06 · March 2015

Truth is that I don't know how to create a jsbin of my code since I use PHP to output data... so, I've removed everything that corresponds to PHP and replaced it by text values in my <tr> in jsbin. But i don't think that is what I'm supposed to do.....
(sorry to be that ignorant !!! )

Then I don't know how I can add the js and css for yadcf and chosen, etc

Look at what I've done http://live.datatables.net/rufaluxu/1/edit
Is my way of including the js and css correct ??? If it is, I don't know how to link chosen.js & css...
I guess that what I've done in js bin is all wrong !!
I've been watching tutorials and help topics about how to use jsbin, and checking existing datatables jsbins, but............... :s

daniel_r · March 2015

Nevermind then, in case that you'll have a link to a working sample (to you server?) you can post it and I'll try to see what went wrong.

Marina06 · March 2015

Ok :)
The hosting my websites are on doesn't support pdo, and for this website I'm working on; I do use pdo, so as soon as this website is online, I give you the link .
Thanks for your support :)

Marina06 · March 2015

Hello,
I hadn't seen that when searching a column called [postcode + city], the search was effective only on the first value, here on postcode. If I type "Paris" no result is returned.
How can I solve that? I've tried several ideas of mine, but :D :S

Can you give a little help please, thank you

{ // job_cp + ville POSTCODE + CITY
    "bSearchable":true,
     "aTargets": [ 4  ] ,                       
     "mRender" : function ( data, type, full ) 
                          {  var texte=  data+' '+full[5];
                         var sReturn = full[0];
    return "<a href='../offredemploi.php?id="+sReturn+"' target='_Blank'>"+ texte + "</a>"; 
                                     }
 },
// etc
.yadcf ( [  {column_number : 4, filter_type: "text",  text_data_delimiter: ",", filter_default_label: "Rechercher" },
]

daniel_r · March 2015

@Marina06 I need an online example to tell what went wrong or how to solve it...

Marina06 · March 2015

oh... ok... I still haven't looked for a hosting yet.. humm. ok I'll come back & let u know when I have it...

Marina06 · March 2015

Hi ! :) Me again !!
@daniel_r : I've just sent you the URL of my web in order that you can review it and tell me what's going wrong with the search in a colum that contains 2 values. As I said in my previous posts, in the column [postcode - city] --> only postcode is "searchable".

Many many thanks

daniel_r · March 2015

I see that you are using a server side processing, and I saw that thesearch data of the column N#5 (sSearch_5) is sent just fine , both in case of postcode and city, so it looks like an issue in your php code that not using the proper function to compare string, see the following q/a in so , its not related to datatables nor yadcf, it looks like a improper function use in php code

Marina06 · March 2015

@daniel_r
Ok, and I forgot to remember you that when in Column 2 "Poste", I replace "text" per "auto_complete", I get "No search result"...

{column_number: 2, filter_type: "auto_complete", text_data_delimiter: ",",filter_default_label: "Rechercher" },//

@everybody
Underneath, my php for Individual column filtering, which works well when a single value is diplayed per column, but when I display "postcode - city" in a same column, I only have my postcode searchable...
I don't know how to tell php that in my column 5, are values 5 and 6, that both must be searchable / filterable..
Thanks for your help.

// datatables extract of "aoColumns" :
{     "bSearchable":true,   // COLUMN  5 (contains values 5 and 6)
       "mRender" : function ( data, type, full ) 
        {  var texte=  data+' - '+full[6]    // displays "postcode  - city"  
        var sReturn = full[0];
       return "<a href='offre_emploi.php?id="+sReturn+"' target='_Blank'>"+ texte + "</a>"; 
        }
 },

// php
 /* Individual column filtering */
    for ( $i=0 ; $i<count($aColumns) ; $i++ )
    {
        if ( isset($_GET['bSearchable_'.$i]) && $_GET['bSearchable_'.$i] == "true" && $_GET['sSearch_'.$i] != '' )
        {
            if ( $sWhere == "" )
            {
                $sWhere = "WHERE ";
            }
            else
            {
                $sWhere .= " AND ";
            }
            $sWhere .= $aColumns[$i]." LIKE '%".  $_GET['sSearch_'.$i]."%' ";
        }
        
    }

daniel_r · March 2015

If you want to use auto complete you must include jquery ui js and css

Sorry but I'm not a php user :|

Marina06 · March 2015

Hi,
I had already tried with ui.js and ui.css... I've tried again and nothing happends... in what's regarding "auto_complete".. :/

Ok for php.
I'm good at php but when not in the case datatables case... ! So I guess I'm gonna create a new topic for this particular case.
Thanks again, have a nice day

daniel_r · April 2015

You can take a look at the following sample with auto complete filter (fourth column)

I can't get my Individual Column Search working

I can't get my Individual Column Search working

Replies

Howdy, Stranger!

Categories

DataTables

I can't get my Individual Column Search working

I can't get my Individual Column Search working

Replies

Howdy, Stranger!

Quick Links

Categories

DataTables