How to get datepicker in jqGrid toolbar?

Question

I want to have a datepicker in the search text fields and, ultimately, also in jqgrid edit fields.

Is there any way?

Has anyone used such a combination? Datepicker with jqGrid?

Answer 1

I found a way:

It is hidden somewhere deep in the documentation:

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:search_config

Answer 2

In the field definition, you do the following:

colModel: [{ name: 'Start', index: 'Start', searchoptions: { sopt: ['eq', 'ne'], dataInit: function (elem) { $(elem).datepicker({ showButtonPanel: true }) } } }, 

Answer 3

Try:

 { name: 'AWBDate', index: 'AWBDate', width: 90, align: 'left', editable: false, formatter: 'date',search: true, formatoptions: { srcformat: 'd/m/YH:i:s', newformat: 'd/m/Y' }, sorttype:"date", searchoptions: { sopt: ['eq'], dataInit: function (elem) { $(elem).datepicker({ dateFormat: 'dd/mm/yy', changeYear: true, changeMonth: true, showWeek: true, onSelect: function (dateText, inst) { setTimeout(function () { $('#jQGridapproval')[0].triggerToolbar(); }, 100); } }); } } }, 

Answer 4

This code worked for me.

 colModel: [ { name: 'created_at', index: 'Creation Date', search: true, searchoptions: { sopt: ['eq'], dataInit: function(e) { $(e).datepicker({ dateFormat: 'yy-mm-dd' }) .change(function() { $("#list2")[0].triggerToolbar(); }); } } }, ] 

$("#list2") is a jqgrid table selector.

Answer 5

 colModel:[ { name: "DateFrom", width: 110, index: 'DateFrom', search: true, searchoptions: { dataInit: function(el) { $(el).datepicker({ changeYear: true, changeMonth: true, showButtonPanel: true, dateFormat: 'dd-mm-yy' }); } } } ]