how to add datepicker in jqgrid

问题

In my grid date field is not displayed when I write the date field in grid. Even grid also not displayed

colModel:[
{name:'id',index:'id', width:55, editable:false,editrules:{required:true},searchoptions:{sopt: ['eq', 'ne']}},            
{name:'employe',index:'employe', width:100,editable:true,formoptions:{rowpos:2,elmprefix:"&nbsp;&nbsp;&nbsp;&nbsp;"},editrules:{required:true}},
{name:'gender',index:'gender', width:55,editable: true, formatter: 'dynamicText', width: 150, edittype: 'custom', editoptions: { custom_element: radioelem, custom_value: radiovalue},formoptions:{rowpos:4,elmprefix:"&nbsp;&nbsp;&nbsp;&nbsp;"}},
{name:'role',index:'role', width:100,editable:true,edittype:"select",
    editoptions:{dataUrl:'test.txt', defaultValue:'Intime'},
    formoptions:{rowpos:3,elmprefix:"&nbsp;&nbsp;&nbsp;&nbsp;" }},
{name:'department',index:'department', width:80, align:"right",editable:true,edittype:"select",
    editoptions:{dataUrl:'test.txt', defaultValue:'Intime'},
    formoptions:{rowpos:5,elmprefix:"&nbsp;&nbsp;&nbsp;&nbsp;" }},
{name:'joinedate',index:'joinedate', width:80,
    editable:true,
    editoptions:{size:12,
        dataInit:function(el){
            $(el).datepicker({dateFormat:'yy-mm-dd '});
        },
        defaultValue: function(){
            var currentTime = new Date();
            var month = parseInt(currentTime.getMonth() + 1);
            month = month <= 9 ? "0"+month : month;
            var day = currentTime.getDate();
            day = day <= 9 ? "0"+day : day;
            var year = currentTime.getFullYear();
            return year+"-"+month + "-"+day;                
        }
    },
    formoptions:{ rowpos:6,elmsuffix:"  yyyy-mm-dd", elmprefix:"&nbsp;&nbsp;&nbsp;&nbsp;"},
    editrules:{required:true}
}

This is my code ..in the grid date field is not displayed please help me.

回答1:

I think you should try to put the datepicker-creating method in event:

beforeShowForm

回答2:

The problem is that some versions of jqGrid calls dataInit before the el are placed on the page. So jQuery UI Datepicker don't work in the case. You can fix the problem by calling datepicker later:

dataInit: function (el) {
    setTimeout(function () {
        $(el).datepicker({dateFormat:'yy-mm-dd '});
    }, 50);
}

来源：https://stackoverflow.com/questions/20278496/how-to-add-datepicker-in-jqgrid

标签

jqgrid