2017-02-19 34 views
1

我試圖使用MVC5將數據填充到kendo datagrid。雖然,我已經正確引用了javascript文件,但我收到了錯誤消息jQuery.Deferred異常:Kendo未定義ReferenceError:Kendo未定義。jQuery.Deferred異常:未定義Kendo ReferenceError:未定義Kendo

當我在控制檯窗口看到,誤差在下一行

var carsDataSource = new Kendo.Data.DataSource({ data: cars }); 

請參考下面

在佈局法師

<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>@ViewBag.Title - My ASP.NET Application</title> 

    @Styles.Render("~/Content/css") 
    <link href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css" rel="stylesheet" /> 
    <link href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.default.min.css" rel="stylesheet" /> 

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

    <script src="https://kendo.cdn.telerik.com/2017.1.118/js/kendo.web.min.js"></script> 
    @*<script src="https://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script>*@ 
</head> 

頭部部分中的代碼DataGridController

public class DataGridController : Controller 
    { 
     // GET: DataGrid 
     public ActionResult Index() 
     { 
      return View(); 
     } 
    } 

的Index.html

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 


<div id="cars"></div> 


<script> 

    $(document).ready(function() { 


     var cars = [ 
      { year: 2012, make: "Ferrari", model: "California" }, 
      { year: 2013, make: "Ferrari", model: "458 Italia" }, 
      { year: 2014, make: "Lambhorhini", model: "California" }, 
      { year: 2015, make: "Porche", model: "California" }, 
      { year: 2015, make: "Audi", model: "A7" }, 
      { year: 2016, make: "Mercedez", model: "E350" }, 
      { year: 2016, make: "Nisan", model: "California" }, 
      { year: 2015, make: "Ford", model: "California" }, 
      { year: 2014, make: "Jaguar", model: "California" }, 
      { year: 2015, make: "McLaren", model: "California" }, 
      { year: 2013, make: "Ferrari", model: "California" }, 
      { year: 2011, make: "Mercedez", model: "C200" }, 
      { year: 2017, make: "Mercedez", model: "GLA" }, 
     ]; 

     var carsDataSource = new Kendo.Data.DataSource({ data: cars }); 
     carsDataSource.read(); 

     $("#cars").kendoGrid({ dataSource: carsDataSource }); 

    }); 

</script> 

回答

1
  • 你有拼寫錯誤的構造
  • 以及看起來像註釋掉kendo.all.min.js JavaScript文件
  • 的當此錯誤顯示的主要原因是需要資源配置錯誤查看提供的運行示例並查看您是否缺少一些kendo相關的javascript文件並將其添加到您的軟件包中。包含的資源很可能有問題。

下面是劍道電網的最低要求配置

<head> 
    <title></title> 
    <link rel="stylesheet" href="styles/kendo.common.min.css" /> 
    <link rel="stylesheet" href="styles/kendo.default.min.css" /> 
    <link rel="stylesheet" href="styles/kendo.default.mobile.min.css" /> 

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

而且,除非你的網格自動綁定設置爲false,你不需要啓動read()函數。看看這個文檔read method of kendo grid

這裏是你的代碼的現場版本。

道場樣品這裏working dojo sample

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Untitled</title> 

    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.rtl.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.default.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.mobile.all.min.css"> 

    <script src="http://code.jquery.com/jquery-1.12.3.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2017.1.118/js/angular.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2017.1.118/js/jszip.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script></head> 
<body> 

<div id="cars"></div> 

<script> 

    $(document).ready(function() { 

     var carsList = [ 
      { year: 2012, make: "Ferrari", model: "California" }, 
      { year: 2013, make: "Ferrari", model: "458 Italia" }, 
      { year: 2014, make: "Lambhorhini", model: "California" }, 
      { year: 2015, make: "Porche", model: "California" }, 
      { year: 2015, make: "Audi", model: "A7" }, 
      { year: 2016, make: "Mercedez", model: "E350" }, 
      { year: 2016, make: "Nisan", model: "California" }, 
      { year: 2015, make: "Ford", model: "California" }, 
      { year: 2014, make: "Jaguar", model: "California" }, 
      { year: 2015, make: "McLaren", model: "California" }, 
      { year: 2013, make: "Ferrari", model: "California" }, 
      { year: 2011, make: "Mercedez", model: "C200" }, 
      { year: 2017, make: "Mercedez", model: "GLA" }, 
     ]; 

      var carsDataSource = new kendo.data.DataSource({data: carsList});    

      carsDataSource.read(); 

      $("#cars").kendoGrid({ dataSource: carsDataSource }); 

    }); 

</script> 
+0

感謝肖恩。它現在有效。 – Tom

+0

任何時候先生。你非常歡迎 –