0

一段时间以来,我一直在尝试使用 TreeGrid 和 GridDnD 功能实现 JqGrid,但遇到了麻烦。我以前看过它,所以我知道它可以做到。

这是我用来创建 TreeGrid 的代码,它可以按需要工作:

$("#documentmanagementtree").jqGrid({
            url: '<%: Url.Action("GetDocumentManagementFolderStructure", "Document") %>',
            datatype: 'json',
            mtype: 'post',
            colNames: ['Id','Type',
        '<%: Html.TranslateUiElement(Function(x) x.SharedTranslations.EntityTypeCaption) %>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.FileNameCaption)%>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.DocumentFileSizeCaption) %>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.LastCheckinDateCaption)%>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.DocumentDownloadCaption) %>'],
            colModel: [
        { name: 'id', index: 'id', hidden: true },
        { name: 'type', index: 'type', hidden: true },
        { name: 'icon', index: 'icon', width: 5, align: 'left' },
        { name: 'name', index: 'name', width: 15 },
        { name: 'size', index: 'size', width: 5, sortable: false, align: 'right' },
        { name: 'lastcheckindate', index: 'lastcheckindate', width: 10, align: 'center', sorttype: 'date', datefmt: '<%= Html.GetGridDateFormat()%>' },
        { name: 'downloadlink', index: 'downloadlink', width: 5, align: 'center' }
        ],
            height: 'auto',
            width: 1013,
            sortname: 'id',
            treeGrid: true,
            cellEdit: true,
            treeGridModel: 'adjacency',
            treedatatype: "json",
            ExpandColumn: 'icon'
        });

现在,当我实现 GridDnD 功能时,(我在其他页面中正常工作)没有任何反应。虽然,当我从 jqGrid 代码中注释掉“treeGrid:true”行时,我可以成功拖放。

注意:我使用“#”连接,因为我实现了 jqGrid 拖放到自身,我使用 jquery 的 droppable,它工作得很好。

$("#documentmanagementtree").gridDnD({
            connectWith: '#'
        });

所以问题是我无法让 TreeGrid 与 GridDnd 一起工作,尽管我可以让这两个功能单独工作得很好,而且我知道它可以完成,因为我已经看到了这种情况的演示(其中我无法重现结果)。

让我知道您可以建议帮助的任何事情,在此先谢谢大家。

4

1 回答 1

0

我已经使用 tableDnD 找到了一些东西,这是生成的代码:

            $("#documentmanagementtree").tableDnD({ scrollAmount: 0 });

            $("#documentmanagementtree").jqGrid({
            url: '<%: Url.Action("GetDocumentManagementFolderStructure", "Document") %>',
            datatype: 'json',
            mtype: 'post',
            colNames: ['Id', 'Type',
        '<%: Html.TranslateUiElement(Function(x) x.SharedTranslations.EntityTypeCaption) %>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.FileNameCaption)%>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.DocumentFileSizeCaption) %>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.LastCheckinDateCaption)%>',
        '<%: Html.TranslateUiElement(Function(x) x.DocumentTranslations.DocumentDownloadCaption) %>'],
            colModel: [
        { name: 'id', index: 'id', key: true, hidden: true },
        { name: 'type', index: 'type', hidden: true },
        { name: 'icon', index: 'icon', width: 5, align: 'left' },
        { name: 'name', index: 'name', width: 15 },
        { name: 'size', index: 'size', width: 5, sortable: false, align: 'right' },
        { name: 'lastcheckindate', index: 'lastcheckindate', width: 10, align: 'center', sorttype: 'date', datefmt: '<%= Html.GetGridDateFormat()%>' },
        { name: 'downloadlink', index: 'downloadlink', width: 5, align: 'center' }
        ],
            height: 'auto',
            width: 1013,
            sortname: 'id',
            treeGrid: true,
            viewrecords: true,
            treeGridModel: 'adjacency',
            ExpandColumn: 'icon',
            gridComplete: function () {
                $("#documentmanagementtree").tableDnDUpdate();
            }
        });

jqgrid 的重要补充是:

            gridComplete: function () {
                 $("#documentmanagementtree").tableDnDUpdate();
            }

尽管此拖放功能不如 gridDnD 功能好,但可以将其与 treeGrid 结合使用以更好地工作。

如果您遇到类似的问题,请尽情享受!

于 2012-07-16T14:02:50.757 回答