jqGrid, searching dates - jqgrid

Question

My data is on the server side, I have code written to do all the searching/filtering/ordering.
My jqGrid has both a filterToolbar, and a search button.
Unfortunately, when I search, the value I pick for the date, is not sent in the request. However, oddly, it DOES send it when it's the filterToolbar's selected date?!?
Why is there nothing in data here?
{"groupOp":"AND","rules":[{"field":"RunDate","op":"le","data":""}]}
Here is my code for the grid.
var loadFileInfoList = function (fileInfoList, pager) {
fileInfoList.jqGrid({
url: 'GetFiles',
datatype: 'json',
mtype: 'POST',
colNames: ['Id', 'Name', 'Interface', 'Amount', 'Type', 'Created', 'Status'],
colModel: [
{ jsonmap: 'Id', name: 'Id', formatter: 'integer', align: 'right', hidden: true },
{ jsonmap: 'Name', name: 'Name', align: 'right', hidden: true },
{ jsonmap: 'InterfaceName', name: 'InterfaceName', align: 'left', width: '100%', sorttype: 'text', frozen: true,
search: true,
searchoptions: {
sopt: ['cn']
}
},
{ jsonmap: 'Amount', name: 'Amount', formatter: 'currency', align: 'right', width: '100%', sorttype: 'number',
search: true,
searchoptions: {
sopt: ['ge', 'le']
}
},
{ jsonmap: 'Type', name: 'Type', align: 'right', width: '100%', sorttype: 'text',
search: true, stype: 'select',
searchoptions: {
value: getTypeFilterOptions(),
sopt: ['eq']
}
},
{ jsonmap: 'RunDate', name: 'RunDate', formatter: 'date', align: 'right', width: '100%', sorttype: 'date',
search: true,
datefmt: 'dd/mm/yyyy',
searchrules: {
date: true
},
searchoptions: {
sopt: ['ge', 'le'],
dataInit: function (elem) {
$(elem).datepicker({
dateFormat: 'dd/mm/yy',
changeYear: true,
changeMonth: true,
showButtonPanel: true,
onSelect: function () {
$(this).keydown();
}
});
}
}
},
{ jsonmap: 'Status', name: 'Status', align: 'right', width: '100%', sorttype: 'text', formatter: formatStatus,
search: true, stype: 'select',
searchoptions: {
value: getStatusFilterOptions(),
sopt: ['eq']
}
}
],
autoencode: true,
sortname: 'RunDate',
sortorder: 'desc',
pager: pager,
rowNum: 5,
viewrecords: true,
height: '100%',
autowidth: true,
ignoreCase: true,
jsonReader: {
repeatitems: false,
root: "rows"
},
altRows: true,
altclass: 'jqGridAltRow',
loadComplete: function () {
$("tr.jqgrow:odd").addClass('jqGridAltRow');
}
});
fileInfoList.jqGrid('navGrid', pager,
{ edit: false, add: false, del: false },
{},
{},
{},
{ closeOnEscape: true, closeAfterSearch: true, multipleSearch: true, multipleGroup: false }
);
fileInfoList.jqGrid('filterToolbar', { searchOnEnter: false, enableClear: true, stringResult: true });
};
loadFileInfoList($('#jqgFileInfoList'), '#jqgPagerFileInfoList');

Answer 1

I suppose that you can solve the problem by changing onSelect callback of datepicker. You can change
onSelect: function () {
$(this).keydown();
}
to
onSelect: function () {
$(this).trigger('change');
}
You can use also more complex construct which I posted in the answer or a little more simple form from here.