2016-10-14 3 views
0

Я пытаюсь добавить реалистичную реализацию на стороне сервера с фильтром диапазона дат. Фильтр не фильтрует никаких данных. Я понятия не имею, где он ломается. нужна ваша помощь в выяснении, где я ошибаюсь.Datatables Date Range Фильтры не работают

вот сценарий.

 

    $(document).ready(function() { 
        'use strict'; 
        var dataTable = $('#employee-grid').DataTable({ 
         "processing": true, 
         "serverSide": true, 
         "sScrollY": "300px", 
         "iDisplayLength": 25, 
         "bJQueryUI": true, 
         "bStateSave": true, 
         "ajax": { 
          url: "employee-grid-data.php", // json datasource 
          type: "post", // method , by default get 
          error: function() { // error handling 
           $(".employee-grid-error").html(""); 
           $("#employee-grid").append('No data found in the server'); 
           $("#employee-grid_processing").css("display", "none"); 

          } 
         }, 
         "tableTools": { 
          "sSwfPath": "swf/copy_csv_xls_pdf.swf", 
          "aButtons": [ 

           { 
            "sExtends": "collection", 
            "sButtonText": "Export", 
            "aButtons": ["csv", "xls", "pdf", "print"] 
           } 
          ] 
         } 
        }); 
        function myCustomFilterFunction(filterVal, columnVal) { 
         var found; 
         if (columnVal === '') { 
          return true; 
         } 


         if (found !== -1) { 
          return true; 
         } 
         return false; 
        } 
        var oTable = $('#employee-grid').dataTable().yadcf([{ 
         column_number: 0, 
         filter_container_id: 'external_filter_container_0', 
         filter_type: "auto_complete", 
         text_data_delimiter: "," 
        }, { 
         column_number: 1, 
         filter_container_id: 'external_filter_container_1', 
         filter_type: "auto_complete", 
         text_data_delimiter: "," 
        }, { 
         column_number: 2, 
         filter_container_id: 'external_filter_container_2', 
         filter_type: "auto_complete", 
         text_data_delimiter: "," 
        }, { 
         column_number: 3, 
         filter_container_id: 'external_filter_container_3', 
         filter_type: 'range_date', 
         date_format: 'mm/dd/yyyy' 
        }, { 
         column_number: 4, 
         filter_container_id: 'external_filter_container_4', 
         data: [{ 
          value: '1', 
          label: 'Yessss :)' 
         }, { 
          value: '0', 
          label: 'Noooo :(' 
         }], 
         filter_default_label: "Select Yes/No" 
        }], { 
         externally_triggered: true 
        }); 






       }); 

А вот Html

<div class="container"> 

      <div id="externaly_triggered_wrapper" class=""> 
      <div> 
       <span>First name:</span> 
       <span id="external_filter_container_0"></span> 
      </div> 
      <div> 
       <span>Last name:</span> 
       <span id="external_filter_container_1"></span> 
      </div> 
      <div> 
       <span>Email:</span> 
       <span id="external_filter_container_2"></span> 
      </div> 
      <div> 
       <span>Date Filter:</span> 
       <span id="external_filter_container_3"></span> 
      </div> 
      <div> 
       <span>Newsletter:</span> 
       <span id="external_filter_container_4"></span> 
      </div> 
      </div> 
      <div id="externaly_triggered_wrapper-controls"> 
      <div> 
       <input type="button" onclick="yadcf.exFilterExternallyTriggered(oTable);" value="Filter" class="some_btn general_btn"> 
       <input type="button" onclick="yadcf.exResetAllFilters(oTable);" value="Reset" class="some_btn general_btn"> 
      </div> 
      </div>  
     <div class="container" style="width:760px !important;"> 
      <table id="employee-grid" cellpadding="0" cellspacing="0" border="0" class="display" width="100%"> 
        <thead> 
         <tr> 
          <th>First Name</th> 
          <th>Last name</th> 
          <th>Email</th> 
          <th>Date added</th> 
          <th class="ui-state-default" role="columnheader" tabindex="0" aria-controls="example1" rowspan="1" colspan="1" aria-label="Yes/No: activate to sort column ascending" style="width: 235px;"> 
           <div class="DataTables_sort_wrapper" style="display: inline-block;">Yes/No<span class="DataTables_sort_icon css_right ui-icon ui-icon-carat-2-n-s"></span></div> 
           <div id="yadcf-filter-wrapper--example1-2" class="yadcf-filter-wrapper"> 
            <select id="yadcf-filter--example1-2" class="yadcf-filter " onchange="yadcf.doFilter(this, '-example1', 2, 'contains');" onkeydown="yadcf.preventDefaultForEnter(event);" onmousedown="yadcf.stopPropagation(event);" onclick="yadcf.stopPropagation(event);"> 
             <option value="-1">Select Yes/No</option> 
             <option value="Yes">Yessss :)</option> 
             <option value="No">Noooo :(</option> 
            </select> 
            <button type="button" id="yadcf-filter--example1-2-reset" onmousedown="yadcf.stopPropagation(event);" onclick="yadcf.stopPropagation(event);yadcf.doFilter('clear', '-example1', 2); return false;" class="yadcf-filter-reset-button ">x</button> 
           </div> 
          </th> 
         </tr> 
        </thead> 

      </table> 
     </div> 
+0

Как передать параметры диапазона дат серверному коду? – markpsmith

+0

Он был создан javascript. Я использую этот пример http://yadcf-showcase.appspot.com/dom_source_externally_triggered.html, и это было на их странице javascript. Вот файл js, в котором есть случай от и до даты, который переходит на serveride https://github.com/vedmack/yadcf/blob/master/jquery.dataTables.yadcf.js –

ответ

0

На стороне сервера, полнотекстового поиска вы получите для range_date имеет ограничитель в нем, например:

01/05/2017-yadcf_delim-20/05/2017

Поэтому вы должны разбить его, используя что-то вроде:

searchText.Split(new string[] { "-yadcf_delim-" }, StringSplitOptions.None) 
Смежные вопросы