JQGrid /在"添加/编辑"窗口中选择日期

Question

我已经能够在线编辑时,日期选取器工作纳入jqGrid的,但我无法使用它添加/编辑窗口内.有没有人有关于如何做到这一点的说明或我可以看到的例子？

来自该网站的我想要做的演示:http://www.the-di-lab.com/demo/apples

我读到我可以使用以下方法但不确定如何集成它:

dataInit : function (elem) {
$(elem).datepicker();
}

Answer 1

添加datepicker是一项简单的任务:

colModel: [
  ... other column definitions ...
  {
    name:'my_date', index:'my_date', label: 'Date', width: 80,
    editable: true, edittype: 'text',
    editoptions: {
      size: 10, maxlengh: 10,
      dataInit: function(element) {
        $(element).datepicker({dateFormat: 'yy.mm.dd'})
      }
    }
  },
  ... other column definitions ...
]

而且,.datepicker你可以使用任何插件,如colorpicker或自动完成.

Answer 2

看起来他们正在使用“afterShowForm”将日期/颜色选择器附加到 div。
（查看源码）

jQuery("#list").navGrid("#pager",{edit:true,add:true,del:true},
                     {宽度：400，高度：400，closeAfterEdit：true，
            afterShowForm:function(){ $("#jsrs").load("/demo/apples/jsrs"); },
            onclickSubmit:function() { $("#jsrs").empty(); }
},

（查看源码）

http://www.the-di-lab.com/demo/apples/jsrs

//颜色选择器的Js
$('#color').ColorPicker({
    onSubmit：函数（hsb，十六进制，rgb）{
        $('#color').val("#"+hex);
    },
    onBeforeShow: 函数 () {
        $(this).ColorPickerSetColor(this.value);
    }
}).bind('keyup', function(){
    $(this).ColorPickerSetColor(this.value);
});


//日期选择器的Js
$('#date').DatePicker({
    格式：'Ymd',
    日期：$('#date').val(),
    当前：$('#date').val(),
    开始： 1,
    位置：'底部'，
    onBeforeShow: 函数(){
        $('#date').DatePickerSetDate($('#date').val(), true);
    },
    onChange：函数（格式化，日期）{
        $('#date').val(格式化);
    }
    });

感谢您找到这个示例，我也在寻找如何做到这一点。