带有日期选择器的 Jqgrid答案

【问题标题】：Jqgrid with Datepicker带有日期选择器的 Jqgrid
【发布时间】：2014-12-31 06:38:37
【问题描述】：

我想在我的 jqgrid 中使用 datepicker。我已经尝试了一些我在这个网站上搜索过的东西，但它们没有用。请帮忙。

我有 jqgrid，它正在从 PHP 中获取数据。字段包括电子邮件和搜索日期。当网格加载时，它会显示来自数据库的数据。我想在 search_date 旁边显示当前数据和日历图标，以便用户也可以修改此字段。修改后应保存到数据库中。

我已经删除了我尝试过的所有内容。所以这是新代码：

function fileview(SITEURL){

    jQuery("#gridList").jqGrid({ 
        url:'/mycrm/process/viewjson',
        datatype: "json", 
        colNames:['Email','Search Date'], 
        colModel:[
                  {name:'email',index:'email', width:50, align:"center"},
                  {name:'search_date',index:'search_date', width:17, align:"center"},
                 ],
        rowNum:25, autowidth: true, 
        rowList:[25,50,100,200], 
        mtype: "POST",
        pager: jQuery('#pager1'), 
        sortname: 'id', 
        viewrecords: true, 
        sortorder: "DESC",
        multiselect: true,
        caption:"Details",
        height:'',width:'' }).navGrid('#pager1',{search:false,refresh:false,edit:false,add:false,del:false});
    ReloadGrid('/mycrm/process/viewjson');
}

目前显示的是 search_date 并希望添加日历图标以选择新日期然后将其修改到数据库中。

提前致谢。

【问题讨论】：

标签： php jquery jqgrid datepicker

【解决方案1】：

您的代码没有使用任何编辑网格。您必须在colModel 的列中包含editable: true 属性，您希望允许用户对其进行编辑，然后使用editing mode 中的一个。您可以在editoptions 的dataInit 回调函数中调用datepicker。您可以在 stackoverflow 上搜索 datepicker 和 dataInit 单词（查看结果 here），您会发现许多可以使用的代码示例。我建议您另外使用formatter: "date"。它可以将服务器返回的search_date 的输入数据转换为更易读的格式。通常，在与服务器通信时使用某种与语言无关的格式，例如 ISO 8601（字符串如 2014-12-31）。

【讨论】：