3
캘린더 이미지를 사용하는 datatables에 대한 datefilter가 있으며 잘 작동합니다. 그러나 날짜를 지우면 모든 날짜가 표시되지 않습니다.Jquery datatables filter
날짜 필터를 삭제할 모든 날짜를 표시하는 버튼을 만들려면 어떻게해야합니까?
이 문제에 대한 도움이나 조언은 도움이 될 것입니다. 미리 감사드립니다.
// The plugin function for adding a new filtering routine
$.fn.dataTableExt.afnFiltering.push(
function(oSettings, aData, iDataIndex){
var dateStart = parseDateValue($("#dateStart").val());
// aData represents the table structure as an array of columns, so the script access the date value
// in the first column of the table via aData[0]
var evalDate= parseDateValue(aData[3]);
if (evalDate == dateStart) {
return true;
}
else {
return false;
}
});
// Function for converting a mm/dd/yyyy date value into a numeric string for comparison (example 08/12/2010 becomes 20100812
function parseDateValue(rawDate) {
var dateArray= rawDate.split("/");
var parsedDate= dateArray[1] + dateArray[0] + dateArray[3];
return parsedDate;
}
$(function() {
// Implements the dataTables plugin on the HTML table
var $oTable= $("#example").dataTable({
"iDisplayLength": 20,
"oLanguage": {
"sLengthMenu": 'Show <select><option value="25">25</option><option value="50">50</option><option value="100">100</option><option value="200">200</option></select>'
},
"bJQueryUI": true,
"aoColumns": [
null,
null,
null,
{ "sType": "date" }
]
});
// The dataTables plugin creates the filtering and pagination controls for the table dynamically, so these
// lines will clone the date range controls currently hidden in the baseDateControl div and append them to
// the feedbackTable_filter block created by dataTables
$dateControls= $("#baseDateControl").children("div").clone();
$("#feedbackTable_filter").prepend($dateControls);
// Implements the jQuery UI Datepicker widget on the date controls
$('.datepicker').datepicker(
{dateFormat: 'DD, d MM, yy', showOn: 'button', buttonImage: '../images/calendar.jpg', buttonImageOnly: true}
);
// Create event listeners that will filter the table whenever the user types in either date range box or
// changes the value of either box using the Datepicker pop-up calendar
$("#dateStart").keyup (function() { $oTable.fnDraw(); });
$("#dateStart").change(function() { $oTable.fnDraw(); });
});
안녕 감사를 생략 할 수 있습니다. 여기 jsfiddle입니다 : http://jsfiddle.net/eMZtV/ – Codded
@Codded 내가 대답을 –
멋지게 작동합니다. 감사합니다. 검색 상자에 입력 할 때 날짜를 지우려면 어떻게해야합니까? 또한 내가 날짜 상자를 지우는 모든 것을 보여줄 이미지를 가질 수 있습니까? – Codded