Question

新手在这里......目前正在开发我的第一个ASP.NET Web应用程序。我正在尝试使用SlickGrid。不知怎的，网格根本没有出现，甚至没有显示标题： - （

以下是我的Index.cshtml代码：

@model IEnumerable<E_2.Models.DYE>

<link href="@Url.Content("~/Content/slick.grid.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery.event.drag-2.0.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/slick.core.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/slick.grid.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/SlickGridTest.js")" type="text/javascript">

</script>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


<p>
    @Html.ActionLink("Create New", "Create")
</p>


<table width="100">
  <tr>
    <td>
      <div id="teamGrid" style="width:400px;height:300px;"></div>
    </td>
  </tr>
</table>

..这是我的SlickGridTest.js脚本

var grid;
var columns = [
    { id: "ID", name: "ID", field: "ID" },
    { id: "DESCRIPTION", name: "DESCRIPTION", field: "DESCRIPTION" },
];

var options = {
    enableCellNavigation: true,
    enableColumnReorder: false
};

$(function () {
    var myData = [];
    $.getJSON('/DYE/ReloadDyeData', function (data) {
        myData = data;
        grid = new Slick.Grid("#teamGrid", myData, columns, options);
    });

..我的模特

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;

namespace E_2.Models
{
    public partial class DYE
    {
        public int ID { get; set; }

        [Required]
        public string DESCRIPTION { get; set; }

        [StringLength(3)]
        public string COLOR_CODE { get; set; }
        public Nullable<System.DateTime> VALID_UNTIL { get; set; }
    }
}

* ..以及重新加载数据的控制器部分*

public string ReloadDyeData()
{
    var dyes = db.DYEs.ToList();
    JavaScriptSerializer serializer = new JavaScriptSerializer();
    return serializer.Serialize(dyes);
}

由于缺乏HTML，JavaScriot和ASP.NET的经验，我真的不知道根本问题会在哪里。

Answer 1

问题可能正在发生，因为您正在错误的地方加载.js文件。

在视图的底部（在最后一个cshtml代码之后），您需要为脚本添加一个部分，例如

</div>
@section scripts {
    <script type="text/javascript" src="~/Scripts/yourfile"></script>
}

这是一个快速的答案，很容易成为别的东西

Answer 2

据我所知，你没有包含jQuery，jQuery UI，而你正在使用过时的jquery.event.drag版本。您可以在此处获取更新版本：http://threedubmedia.com/code/event/drag

Answer 3

我在IDE中复制并粘贴了您的代码，并且在我们的slickGridTest.js代码末尾缺少括号和括号..

SlickGrid没有显示

3 个答案: