0

ASP.NETMVCプロジェクトの一部のレコードを編集するためにSlickGridを使用してグリッドを作成しようとしています。

現時点では、レコードを実際にテーブルとして表示する方法を理解できません。SlickGridは次のように表示されます。 現在のグリッド

私はこれを引き起こす可能性のあるものをスタイルシートとjavascriptファイルで探してきましたが、何を探すべきか本当にわかりません。誰か助けてもらえますか？

私が知る限り、私はSlickGridの例にかなり厳密に従った。

スタイルシートには次のものが含まれます。

<link href="../../Content/SlickGrid/slick.grid.css" rel="stylesheet" type="text/css" />
<link href="../../Content/SlickGrid/smoothness/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />

Javascriptには次のものが含まれます。

<script type="text/javascript" src="../../Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.10.0.custom/js/jquery-ui-1.10.0.custom.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.event.drag-2.2.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.jsonp-2.4.0.min.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/slick.core.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/plugins/slick.cellrangedecorator.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/plugins/slick.cellrangeselector.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/plugins/slick.cellselectionmodel.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/slick.editors.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/slick.remotemodel.js"></script>
<script type="text/javascript" src="../../Scripts/SlickGrid/slick.grid.js"></script>

Javascriptコード：

    var columns = [
        { id: "FileTypeId", name: "File Type", field: "FileTypeId", editor: Slick.Editors.Integer, sortable: false },
        { id: "DateCp", name: "Date/CP", field: "DateCp", editor: Slick.Editors.Date, sortable: false },
        { id: "VesselId", name: "Vessel", field: "VesselId", editor: Slick.Editors.Integer, sortable: false },
        { id: "FixtureNo", name: "Fixture No", field: "FixtureNo", editor: Slick.Editors.Text, sortable: false },
        { id: "VoyageNo", name: "Voy No", field: "VoyageNo", editor: Slick.Editors.Integer, sortable: false },
        { id: "VegoilVoyageNo", name: "Vegoil Voy No", field: "VegoilVoyageNo", editor: Slick.Editors.Text, sortable: false },
        { id: "Remarks", name: "Remarks", field: "Remarks", editor: Slick.Editors.LongText, sortable: false }
    ];
    var options = {
        editable: true,
        enableAddRow: true,
        enableCellNavigation: true,
        asyncEditorLoading: false,
        enableColumnReorder: false,
        autoEdit: true
    };

    var grid;
    $(function () {
        $.getJSON('<%= Url.Action("BoxFiles", "Box", new { id = Model.Id }) %>', function (data) {
            grid = new Slick.Grid("#files", data, columns, options);
            grid.render();
        });
    });
4

1 に答える 1

0

スタイルシートはの後slick.grid.cssに含める必要があります。 jquery-ui-1.8.16.custom.css

于 2013-01-24T02:34:36.380 に答える