navGrid("#pager",
                {refresh: true, edit: false, add: true, del: true, search: true},
                {beforeSubmit: function() { alert('before edit submit'); } }, // edit
                { // add
                beforeSubmit: function() { alert('before add submit'); return true;},
                onInitializeForm : function(formid) {

                                jQuery("#invdate",formid).datePicker({

                                dateFormat:"yymmdd",
                                clickInput:true,
                                createButton:false,
                                startDate:'2000-01-02'}).
                        addClass('date-pick');    // Mark grid's date fields
                    }
                 },
                { // delete
                beforeSubmit: function() { alert('before delete submit'); }
                }
                );

Firebug tells me the input is....

<input id="invdate" class="dp-applied editable date-pick" type="text" name="invdate"/>

which is substantially similar to the working...

<input id="1_invdate" class="editable dp-applied date-pick" type="text" style="width: 98%;" name="invdate"/>

The input behaves as if the event is not firing.  Clicking on the field performs no action.  Can you think of any reason why this works on the inline edit, but not in the form?

Thanks!

You need

datePicker.css
date.js
calendar.png
query.datePicker.js

from that page. Ex. if you have edit line in grid then

… grid config:
onSelectRow: function(id, selected){
if(id && id!=lastsel){
jQuery('#navgrid').restoreRow(lastsel);
jQuery('#navgrid').editRow(id,true,fldevent);
lastsel=id;
}
},
…
// datepicker event
function fldevent(id){
// if you like to ui.datepicker
//jQuery(”#”+id+”_changedate”,”#navgrid”).datepicker(
//    {dateFormat:"yymmdd"});

// I like this - locale support and calendar popup only after click symbol:
$.dpText = {
HEADER_FORMAT : 'yyyy/mm',
TEXT_PREV_YEAR : 'Edellinen vuosi ',
TEXT_PREV_MONTH : 'Edellinen kk',
TEXT_NEXT_YEAR : 'Seuraava vuosi',
TEXT_NEXT_MONTH : 'Seuraava kk',
TEXT_CLOSE : 'Sulje',
TEXT_CHOOSE_DATE : 'Valitse pv'
}

// add special class to the grid's date fields (ex. changedate)
$(”#”+id+”_changedate”).addClass('date-pick');
// and bind the event to the class
$('.date-pick').datePicker();

}

Jukka

john(dot)navratil(at)sbcglobal(dot)net

My email: htantran@gmail.com

I can see how good it is when you integrate ui.datepicker into inline edit as well as gird form.

My concern is that: it seems jqgrid does not integrate with ui.datetimepicker?

Question: how can I integrate a datetimepicker to jqgrid? If it's possible, would you give me a recommendation which library should I use for this? A demo will be extremely good.

Thanks,

Tan