第九区

一个程序员的经验笔记

jqGrid使用jqueryui日历

| 暂无评论

在jqgrid中输入日期是一个很常见的功能,使用jqueryui的日历组件Datepicker会更加方便。

生成的效果是这样的:

在jqgrid中使用jqueryui中的日历组件Datepicker

可以通过定制jqgrid中的Colmodel参数完成:

<script>
$("#list").jqGrid({
        ......
   	colModel:[
                 ......
                {name:'realday',index:'realday', width:90,
			editable:true,
			editoptions:{size:12,
				dataInit:function(el){
					$(el).datepicker({dateFormat:'yy-mm-dd'});
				},//载入Datepicker组件
				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;				
				}//设置默认值
			},
                        //后缀为(*),如果要前缀可以用 elmprefix:"(*)"
                        formoptions:{elmsuffix:"(*)"},
			editrules:{required:true}
		}             
                ......
   	],
        ......
});
$("#list").jqGrid('navGrid','#pager',{search:false},{reloadAfterSubmit:true},{reloadAfterSubmit:true});

 

发表评论

*为必填字段!