How To Set Date Search Toolbar Field Width On Autoresize

I*m looking for a way to set date toolbar search field width on autoresize. I tried code from How to make html5 date field in search toolbar to respect column width comment: var s

Solution 1:

I implemented (see the commit) new callback afterResizeDblClick and new event jqGridAfterResizeDblClick, which makes the solution very easy.

It uses the following code

var adjustSearchingDateField = function (cmName, newWidth) {
    var $searchingField = $("#gs_" + $.jgrid.jqID(cmName));
    if ($searchingField.attr("type") === "date") {
        $searchingField.width(newWidth - 7); // - padding
    }
};

...
resizeStop: function (newWidth, iCol) {
    var colModel = $(this).jqGrid("getGridParam", "colModel");
    adjustSearchingDateField(colModel[iCol].name, newWidth);
},
afterResizeDblClick: function (options) {
    adjustSearchingDateField(options.cmName, options.cm.width);
},
...

See the demo http://jsfiddle.net/OlegKi/10qwgejj/14/