1

在我的 jqgrid 中需要一个用于 EntryDate 的弹出日期选择器..但不要有什么问题

<script type="text/javascript"> 
    jQuery("#Countrylist").jqGrid({
        url: '/Country/GetAllCountries/',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['EntryDate','EntryBy'],
        colModel: [
         {
             name: 'EntryDate', index: 'EntryDate', width: 90, editable: true,
             editoptions: {
                 dataInit: function (el)
                 { setTimeout(function () { $(el).datepicker(); }, 200); }
             }
         },
          { name: 'EntryBy', index: 'EntryBy', width: '200', align: 'center', editable: true, editable: true }

        ],
        editurl: "/Country/Edition",
        }); jQuery("#Countrylist").jqGrid('navGrid', '#Countrypager',
    { edit: true, add: true, del: true, search: false, refresh: true },
             {
                 closeOnEscape: true, reloadAfterSubmit: true,
                 closeAfterEdit: true, left: 450, top: 300, width: 520
             },
             { closeOnEscape: true, reloadAfterSubmit: true, left: 450, top: 300, url: "/Country/Deletion", mtype: "POST" },
            { closeOnEscape: true, reloadAfterSubmit: true, left: 450, top: 300 });
  });
    </script>

在我的布局页面中，我有以下参考

<link href="~/Scripts/jquery.jqGrid-4.5.2/css/ui.jqgrid.css" rel="stylesheet" />
        <link href="~/Scripts/pepper-grinder/jquery.ui.theme.css" rel="stylesheet" />
        <script src="~/jquery-ui-1.9.2.custom/js/jquery-1.8.3.js"></script>
        <script src="~/jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.min.js"></script>
        <script src="~/jquery-ui-1.9.2.custom/development-bundle/ui/jquery.ui.datepicker.js"></script>
        <script src="~/Scripts/jquery.jqGrid-4.5.2/src/jquery.jqGrid.js"></script>
        <script src="~/Scripts/jquery.jqGrid-4.5.2/src/i18n/grid.locale-en.js"></script>
        <script src="~/Scripts/jquery.jqGrid-4.5.2/src/jquery.jqGrid.js"></script>
        <script src="~/Scripts/jquery.jqGrid-4.5.2/src/jqModal.js"></script>
        <script src="~/Scripts/jquery.jqGrid-4.5.2/src/jqDnR.js"></script>

firebug 显示以下错误

$(...).datepicker 不是函数

但我可以看到 datepicker 在 firebugs net 选项卡中成功加载

4

3 回答 3

2

在这种情况下，您需要等到所有内容都加载完毕后再初始化插件 

$(function () {
   jQuery("#Countrylist").jqGrid({ 
        url: '/Country/GetAllCountries/',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['EntryDate','EntryBy'],
        colModel: [
         {
             name: 'EntryDate', index: 'EntryDate', width: 90, editable: true,
             editoptions: {
                 dataInit: function (el)
                 { setTimeout(function () { $(el).datepicker(); }, 200); }
             }
         },
          { name: 'EntryBy', index: 'EntryBy', width: '200', align: 'center', editable: true, editable: true }

        ],
        editurl: "/Country/Edition",
        }); jQuery("#Countrylist").jqGrid('navGrid', '#Countrypager',
        { edit: true, add: true, del: true, search: false, refresh: true },
             {
                 closeOnEscape: true, reloadAfterSubmit: true,
                 closeAfterEdit: true, left: 450, top: 300, width: 520
             },
             { closeOnEscape: true, reloadAfterSubmit: true, left: 450, top: 300, url: "/Country/Deletion", mtype: "POST" },
            { closeOnEscape: true, reloadAfterSubmit: true, left: 450, top: 300 });
   });
});

编辑：您可以在http://api.jquery.com/ready/获得更多信息

于 2013-08-22T11:59:55.397 回答
0

我过去做过他的 http://jsfiddle.net/Yenros/bbPeP/

打扰一下......但我已经有一段时间没有使用这个组件了，但是代码应该仍然是相关的

   initDateEdit = function (elem) {
            setTimeout(function () {
                $(elem).datepicker({
                    dateFormat: 'dd-M-yy',
                    ...
                });
            }, 100);
        };

然后在你的 col 模型中

{ name: 'Week_Start', formatter: 'date', formatoptions: { newformat: 'd-M-Y' }, datefmt: 'd-M-Y', editoptions: { dataInit: initDateEdit }, searchoptions: { dataInit: initDateSearch } }
于 2013-08-22T12:08:18.067 回答
0

我刚刚删除

@Scripts.Render("~/bundles/jquery")

现在从我的 layout.cshml

$(function () {
        jQuery("#Countrylist").jqGrid({**mycode**})});

正如@TheCodeDestroyer 所说..现在它正在工作

于 2013-08-22T12:15:26.440 回答