kendo 基本网格和 telerik 帐户混淆

kendo basic grid and telerik accounts confusion

我使用的是 kendo grid 的试用版,然后在许可证过期后我的雇主购买了它,所以我能够下载(他们允许访问我的帐户 - 雇主的帐户是独立的)

telerik.kendoui.professional.2016.3.1118.commercial.msi

现在的问题是这仍然不起作用,我已经完成了以下步骤来安装 kendo grid

我有 运行 这个安装程序,并且还手动添加到我的 asp.net-mvc 应用程序

  1. 我的应用程序 Scripts/kendo 文件夹下的 js 文件夹
  2. css 文件(样式文件夹)在我的应用程序的 Content/kendo 文件夹下

我的代码

@Scripts.Render("~/Scripts/kendo/jquery.min.js")

@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
@Scripts.Render("~/Scripts/kendo/kendo.all.min.js")

@Styles.Render("~/Content/kendo/kendo.common.min.css")
@Styles.Render("~/Content/kendo/kendo.default.min.css")

<script type="text/javascript">
 //shorter version of document.ready
$(function () {

    //kendo.ui.Grid

    $("#grid").kendoGrid(
     {

         sortable: true,
         dataSource: {
             pageSize: 1
         },
         pageable:true,
         resizable: true,
         columnMenu: true,
         scrollable:true
     }
  ); 
});

</script>

<div id="examplegrid">
<table id="grid">
    <colgroup>
        <col />
        <col />
        <col style="width:110px" />
        <col style="width:120px" />
        <col style="width:130px" />
    </colgroup>
    <thead>
        <tr>
            <th data-field="make">Car Make</th>
            <th data-field="model">Car Model</th>
            <th data-field="year">Year</th>
            <th data-field="category">Category</th>
            <th data-field="airconditioner">Air Conditioner</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Volvo</td>
            <td>S60</td>
            <td>2010</td>
            <td>Saloon</td>
            <td>Yes</td>
        </tr>
        <tr>
            <td>Audi</td>
            <td>A4</td>
            <td>2002</td>
            <td>Saloon</td>
            <td>Yes</td>
        </tr>
    </tbody>
</table>

我的浏览器没有任何错误。但是我在那里看不到 kendo 网格。

获得支持,它说您未获得任何产品的许可(这令人困惑,因为我从那里下载了商业版本)

我也已将此发布到他们的论坛(从我雇主的帐户),但他们至少需要 3 天才能回复!!

页面源快照

我也在添加查看源码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>About - My ASP.NET MVC Application</title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    <link href="/Content/site.css" rel="stylesheet"/>

    <script src="/Scripts/modernizr-2.6.2.js"></script>

</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title"><a href="/">your logo here</a></p>
            </div>
            <div class="float-right">
                <section id="login">
                        <ul>
    <li><a href="/Account/Register" id="registerLink">Register</a></li>
    <li><a href="/Account/Login" id="loginLink">Log in</a></li>
</ul>

                </section>
                <nav>
                    <ul id="menu">
                        <li><a href="/">Home</a></li>
                        <li><a href="/Home/About">About</a></li>
                        <li><a href="/Home/Contact">Contact</a></li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
    <div id="body">

        <section class="content-wrapper main-content clear-fix">



 <script src="/Scripts/kendo/jquery.min.js"></script>

 <script src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>

 <link href="/Content/kendo/kendo.common.min.css" rel="stylesheet"/>

<link href="/Content/kendo/kendo.bootstrap.min.css" rel="stylesheet"/>

<link href="/Content/kendo/kendo.default.min.css" rel="stylesheet"/>

<script src="/Scripts/kendo/kendo.all.min.js"></script>

更新

当我重新打开 visual studon 时,它让我可以选择更新我的 telerik 版本,我同意了,它显示了以下屏幕。

毕竟这个网格仍然是一样的 - 没有 kendo-网格皮肤 :S

更新

我读了这个话题Widgets Are Unavailable or Undefined 所以我删除了一个多余的 jquery 参考,现在网格看起来像附加的图像。

注意:这是一个单独的测试应用程序,我打算将此网格合并到我的主应用程序中。现在网格看起来像这样

我从 Bundle of Kendo UI is not working in IIS

找到了我的答案

所以我一重命名捆绑包

 bundles.Add(new StyleBundle("~/Content/kendo").Include(...));

  bundles.Add(new StyleBundle("~/Content/kendoui").Include(...));

效果很好!