title: DataTables (JQuery) on how to multi column filter text box given a array that contain the data?
body: <p>I am trying to do a multi column filter as shown in this page (<a href="http://www.datatables.net/examples/api/multi_filter.html" rel="nofollow">http://www.datatables.net/examples/api/multi_filter.html</a>) using a array that contain all the data (called 'my_array_data') but I could not get those filter text box displayed.</p>
  
  <p>Below is the code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  var asInitVals = new Array();
  
  $(document).ready(function() {
  
  
              $('#dynamic').html( '&lt;table cellpadding="0" cellspacing="0" border="0" class="display" id="example"&gt;&lt;/table&gt;' );
              var oTable = $('#example').dataTable( {
                  "aaData": my_array_data,
                  "bProcessing": true,
                  "bAutoWidth": false,
                  "fnInitComplete": function() {
                                  var oSettings = this.fnSettings();
                                  for ( var i=0 ; i&lt;oSettings.aoPreSearchCols.length ; i++ ){
                                      if(oSettings.aoPreSearchCols[i].sSearch.length&gt;0){
                                          $("tfoot input")[i].value = oSettings.aoPreSearchCols[i].sSearch;
                                          $("tfoot input")[i].className = "";
                                      }
                                  }
                              },
                  "aoColumns": [
                      {
                          "sTitle": "From",
                          "sClass": "center",
                          "sWidth": "10%"
                      },
                      {
                          "sTitle": "To",
                          "sClass": "center",
                          "sWidth": "10%"
                      },
                      {
                          "sTitle": "Note",
                          "sClass": "center",
                          "sWidth": "80%"
                      }
                  ]
              } );
  
  
              $("tfoot input").keyup( function () {
                  /* Filter on the column (the index) of this element */
                  oTable.fnFilter( this.value, $("tfoot input").index(this) );
              } );
  
  
              /*
               * Support functions to provide a little bit of 'user friendlyness' to the textboxes in
               * the footer
               */
              $("tfoot input").each( function (i) {
                  asInitVals[i] = this.value;
              } );
  
              $("tfoot input").focus( function () {
                  if ( this.className == "search_init" )
                  {
                      this.className = "";
                      this.value = "";
                  }
              } );
  
              $("tfoot input").blur( function (i) {
                  if ( this.value == "" )
                  {
                      this.className = "search_init";
                      this.value = asInitVals[$("tfoot input").index(this)];
                  }
              } );
  
  
  });
  </code></pre>
  
  <p>For your info: I do not have a <code>&lt;table&gt; ... &lt;/table&gt;</code> as mention before that I store my data in the array called ''my_array_data' and therefore do not have <code>&lt;input class="search_init"/&gt;</code>. Also, "my_array_data" contain three column - basically named as - "From", "To", and "Note".</p>
  
  <p>Any Insight in getting 3 columns of search filter for my array "my_array_data"?</p>
  
  <p>Appreciate any help offer.</p>