2015-05-26 3 views
1

У меня есть JQuery DataTable и имеет дату filter.My код выглядит следующим образом, как указано в ссылке ниже plunker mentioned.Pasting мой JS код для DatePickersJquery DataTable Дата Фильтр

$(function() { 
    var oTable=$('#datatable').DataTable({ 
    "oLanguage": { 
     "sSearch": "Filter Data" 
    }, 
    "iDisplayLength": -1, 
    "sPaginationType": "full_numbers", 

    }); 

    $('#datepicker_from').click(function() { 
    $("#datepicker_from").datepicker("show"); 
    }); 
    $('#datepicker_to').click(function() { 
    $("#datepicker_to").datepicker("show"); 
    }); 


    $("#datepicker_from").datepicker({ 
    "onSelect": function(date) { 
     minDateFilter = new Date(date).getTime(); 
     oTable.fnDraw(); 
    } 
    }).keyup(function() { 
    minDateFilter = new Date(this.value).getTime(); 
    oTable.fnDraw(); 
    }); 

    $("#datepicker_to").datepicker({ 
    "onSelect": function(date) { 
     maxDateFilter = new Date(date).getTime(); 
     oTable.fnDraw(); 
    } 
    }).keyup(function() { 
    maxDateFilter = new Date(this.value).getTime(); 
    oTable.fnDraw(); 
    }); 

}); 

// Date range filter 
minDateFilter = ""; 
maxDateFilter = ""; 

$.fn.dataTableExt.afnFiltering.push(
    function(oSettings, aData, iDataIndex) { 
    if (typeof aData._date == 'undefined') { 
     aData._date = new Date(aData[0]).getTime(); 
    } 

    if (minDateFilter && !isNaN(minDateFilter)) { 
     if (aData._date < minDateFilter) { 
     return false; 
     } 
    } 

    if (maxDateFilter && !isNaN(maxDateFilter)) { 
     if (aData._date > maxDateFilter) { 
     return false; 
     } 
    } 

    return true; 
    } 
); 
    http://plnkr.co/edit/yTAmQRJHN1zVdzYJBKop?p=preview 

С и по диапазону дат Фильтр, кажется, работает нормально. Но вместе с этими у меня может быть одна радиокнопка (то есть: на этой неделе и в этом месяце) на этой неделе радиокнопка будет давать результаты между сегодняшней датой и прошлой неделей, а также то же самое в случае с месяцем переключатель. Как я могу это решить?

ответ

1

переключатель Add после date_filter:

<p id="radio_date_filter"> 
    <input type="radio" name="filterTable" value="week" />This Week 
    <input type="radio" name="filterTable" value="month"/>This Month 
</p> 

Написать скрипт, который фильтр DataTable на основе выбора:

$("#radio_date_filter input:radio").click(function(){ 


    var currentDate = new Date(); 

    if($(this).val() == 'week'){ 

     var weekDate = new Date(); 
     var first = weekDate.getDate() - 7; 
     var firstDayofWeek = new Date(weekDate.setDate(first)); 
     minDateFilter = firstDayofWeek.getTime(); 


    }else{ 

     var monthDate = new Date(); 
     var firstDayOfMonth = new Date(monthDate.setMonth(monthDate.getMonth() - 1)); 
     minDateFilter = firstDayOfMonth.getTime(); 

    } 

    maxDateFilter = currentDate.getTime(); 
    oTable.fnDraw(); 
}); 

working plunker

+0

Thank You :) Но в plunker Если я выбираю неделю флажок прямо сейчас он показывает, что это 27-05-2015 и выше одной недели, но я хочу получать записи между 21 и 27 годами, и то же самое с месяцем. Помогите – ravicandy

+0

Спасибо, что сработал :) – ravicandy

+0

@ravicandy: привет. –

 Смежные вопросы

  • Нет связанных вопросов^_^