怎么把jqgrid与My97DatePicker日历插件一起用,做到单击添加窗口的日期文本框时弹出日历...

引用正确路径下的WdatePicker.js后可以用以下两种方式
1.在定义列时在editoptions的dataInit写一个function,好处是不管是添加还是修改时都能显示日历控件,如下
{name:'dt',index:'dt',editable:true,
editoptions:{
  dataInit:function(el){
   $(el).click(function(){
    WdatePicker();
   });
  }
}
}
2.在分别添加和修改中的beforeShowForm写一个function,好处是分别控制,如果只想在添加或者修改时显示日历控件就可以在需要的地方写,如下
.navGrid('#pagerb',{
add:true,edit:true
}
,{
url:"url",
beforeShowForm:function(frmgr){
  jQuery("#dt",frmgr).click(function(){
   WdatePicker();
  });

},
{
url:"url",
beforeShowForm:function(frmgr){
  jQuery("#dt",frmgr).click(function(){
   WdatePicker();
  });

},
'',
'',
''
);
完整如下
jQuery("#list").jqGrid({
  url:"jqgriddata2.asp",
  datatype: "json",
  colNames:['No','date'],
  colModel:[
   {name:'id',index:'id',width:300},
   {name:'dt',index:'dt',width:400,sortable:false,search:false,editable:true,
    editoptions:{
     //方式1
//     dataInit:function(el){
//      $(el).click(function(){
//       WdatePicker();
//      });
//     }
    }
   ,editrules:{edithidden:true,required:true,date:true}}
  ],
  rowNum:30,
     rowList:[10,20,30],
  pager: jQuery('#pagerb'),
  caption: "test"
})
.navGrid('#pagerb',{
   add:true,edit:true
  }
  ,{
   //方式2
   url:"url",
   beforeShowForm:function(frmgr){
    jQuery("#dt",frmgr).click(function(){
     WdatePicker();
    });
   } 
  },
  {
   //方式2
   url:"url",
   beforeShowForm:function(frmgr){
    jQuery("#dt",frmgr).click(function(){
     WdatePicker();
    });
   } 
  },
  '',
  '',
  ''
);

不过发现用My97DatePicker有个bug,就是点击日期文本框弹出日历选择完后,再点击日期文本框的时候不能显示日历控件,要再次点击才能显示日历控件,使用jquery ui里面的datepicker就没这问题
而且jqgrid支持换肤,datepicker也支持,所以个人认为用datepicker好些,换肤的时候风格能保持统一。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值