asp.net-mvc - jqGrid中的日期选择器，简单的例子？

Question

有谁知道在 jqGrid 中添加 jquery UI DatePicker(或其他一些)的示例？我试图让它用于内联编辑网格。

我找到了一些例子，但没有任何效果。我想要一些非常简单的东西!

我的网格设置(不知道这个问题是否必要):

    $(function () {
    var lastsel;
    $("#list").jqGrid({
        url: '@Url.Action("ExampleData", "Home")',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['Namn', 'Födelsedag', 'Adress', 'Stad'],
        colModel: [
          { name: 'Name', index: 'Name', width: 130, editable: true },
          { name: 'Birthday', index: 'Birthday', width: 80, editable: true },
          // DatePicker for birthday 

          { name: 'Address', index: 'Address', width: 180, editable: true },
          { name: 'City', index: 'City', width: 80, editable: true },
        ],
        pager: '#pager',
        rowNum: 10,
        rowList: [10, 20, 30],
        sortname: 'Name',
        sortorder: 'desc',
        viewrecords: true,
        gridview: true,
        width: 700,
        onSelectRow: function (id) {
            if (id && id !== lastsel) {
                jQuery('#list').jqGrid('saveRow', lastsel);
                jQuery('#list').jqGrid('editRow', id, true);
                lastsel = id;
            }
        },
        editurl: '@Url.Action("Incoming", "Home")',
        caption: 'Kontaktpersoner'
    });

    jQuery("#list").jqGrid('navGrid', "#pager", { edit: false, add: false, del: true });
    jQuery("#list").jqGrid('inlineNav', "#pager");

Answer 1

正如您在 jqGrid documentation 中所读到的那样为此有一个 dataInit 选项。你应该记住，这个事件是在元素插入 DOM 之前引发的，所以使用 setTimeout 只是为了安全:

{ name: 'Birthday', index: 'Birthday', width: 80, editable: true editoptions: { dataInit: function(el) { setTimeout(function() { $(el).datepicker(); }, 200); } } },