如何在jqGrid的“添加行"对话框中添加datepicker? [英] How do I add datepicker in the add row dialog in jqGrid?
问题描述
我正在使用jqGrid，我想知道，在添加行对话框中，如何将jQueryUI的datepicker添加到某些输入字段中?
Hi I'm using jqGrid and I'm wondering, how do I add jQueryUI's datepicker to some of the input fields when in the add row dialog?
我还要如何检查输入的内容是否有效?
Also how do I check if the input entered are valid?
提前谢谢！
推荐答案
前不久，我对此进行了研究，然后根据来自其他人的各种输入，将它们混在一起.我假设您已经有CSS和JS datepicker文件.如果没有，请告诉我，我们会为您追踪.在<head>标记内，在<link rel="stylesheet"... href="css/ui.jqgrid.css" />行的之后放置以下:
After researching this myself a while back, this is what I mashed together based off various input from others. I'm making the assumption that you already have the CSS and JS datepicker files. If not, let me know and I'll track them down for you. Within the <head> tags, place the following after your <link rel="stylesheet"... href="css/ui.jqgrid.css" /> line:
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.datepicker.css" />
然后，仍然在<head>标记内，在<script src="js/jquery-ui-1.7.2.custom.min.js" ...></script>
Then, still within the <head> tags mind you, insert the the following after your <script src="js/jquery-ui-1.7.2.custom.min.js" ...></script>
<script type="text/javascript" src="js/ui.datepicker.js"></script>
现在，在colmodel数组中，您将将datepicker JS代码添加到将使用datepicker的字段中.就我而言，我有一个上次修改日期"字段.因此，在colmodel数组中，您的代码应如下所示:
Now, within the colmodel array, you are going to add your datepicker JS code to the field of which the datepicker will be used. In my case, I had a 'Last Modified Date' field. So within the colmodel array, your code should look something like this:
{name:'last_modified_date', index:'last_modified_date', width:90, editable:true, editoptions:{size:20,
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;
}
}
},
此外，我确定您已经检查了此内容，但是请确保访问 jqGrid Wiki . Wiki包含该工具的文档，博客还具有论坛，每天都在这里提问.实际上，我认为该插件的作者Tony甚至在其示例页面上也有一个UI datepicker示例.
Also, I'm sure you have already checked this out but be sure to visit the jqGrid wiki. The wiki has documentation for the tool and the blog also has forums where questions are asked daily. In fact, I think Tony, the author of the plugin, even has a UI datepicker example on his example page.
希望这会有所帮助.
这篇关于如何在jqGrid的“添加行"对话框中添加datepicker?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
