web-dev-qa-db-ja.com

kendo.syncReadyは関数ではありません

私は剣道UIを初めて使用しましたが、途中で問題が発生しました。参照問題を解決するBundleConfigurationを使用した後、エラーが表示されました：

kendo.syncReadyは関数ではありません

これが私の見解です：

<head>
    @Styles.Render("~/Content/kendo.common.min.css")
    @Styles.Render("~/Content/kendo.default.min.css")
    @Scripts.Render("~/Scripts/jquery.min.js")
    @Scripts.Render("~/Scripts/kendo.web.min.js")
    @Scripts.Render("~/Scripts/kendo.aspnetmvc.min.js")
    @Scripts.Render("~/Scripts/kendo.all.min.js")
    @Scripts.Render("~/Scripts/modernizr-2.6.2.js")
</head>
<body>
    @(Html.Kendo().DatePicker().Name("datepicker"))
</body>

これはChromeで発生します。 IEでは、datepickerが定義されていないことがわかります。おそらく私は参照または何かを逃していますか？または、誰かが私のjQueryスクリプトのバージョンを確認する方法を教えてもらえますか？それらのすべてをTelerik Free Trialから入手しました。

jquerykendo-uikendo-asp.net-mvc
10
George Great

_Layout.cshtmlビューに参照を追加することで問題を解決しました。

1
George Great

kendo.syncReady関数は、KendoUIの最近のバージョン（v2017.1 223付近）で追加されました。 Telerikの開発者がこれを forum post で書いた：

syncReadyメソッドがkendo.aspnetmvc.jsファイルに追加されました。これを含める理由は、jQuery 3.1の主な問題と、MVCでのテンプレートの生成方法でした。そのことを念頭に置いて、kendo.aspnetmvc.jsファイルが最新バージョンで更新されていることを確認することで、不足している関数のエラーを解決できます。

このエラーの原因となる主な条件は2つあります。

  1. ASP.NET MVCラッパーを使用して、剣道ウィジェットを生成します。
  2. MVCラッパーがKendoのJSコードを出力する場所afterを含めます（前の<body> close）。

ASP.NET MVCラッパーはKendo JSコードを生成し、そのコードをkendo.syncReady関数ですが、MVCラッパーによってページにKendo JSが挿入された後にKendoのスクリプトタグを含めると、kendo.syncReady関数はまだ存在せず、エラーが表示されます。

修正＃1

これを修正する最初の方法は、剣道を動かすことです<script>上記のタグは、MVCラッパーがKendo JSコードを出力する場所です。

<head>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.all.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.aspnetmvc.min.js"></script>
</head>
<body>
    @(Html.Kendo().DatePicker().Name("datepicker"))
</body>

これは2つの主な理由で理想的ではありません。これらのスクリプトはレンダリングをブロックすることと、kendo.all.min.jsファイルが1MBを超えています！

修正＃2

次のように、MVCラッパーからのスクリプト出力を延期することもできます。

@(Html.Kendo().DatePicker().Name("datepicker").Deferred(true))

これにより、MVCラッパーを使用するJSコードの出力が防止され、基本的にはレンダリングされたJSが保存されるため、ページ上の任意の場所に配置できます。

<body>
    @(Html.Kendo().DatePicker().Name("datepicker").Deferred(true))

    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.all.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.aspnetmvc.min.js"></script>

    @Html.Kendo().DeferredScripts(true)
</body>

さらなる議論

引き続きkendo.syncReady is not a functionエラー、生成されたHTMLのソースを表示し、MVCラッパーによって生成されたコードの前に剣道スクリプトタグが本当に出力されていることを確認してくださいbefore。また、適切なバージョンの剣道を使用していること、および剣道のバージョンがJSファイルとDLLファイルの間で同じであることを確認してください。

15
John Washam

Telerikサイトのブログエントリを読んだ後、修正はkendo.all.jsへの参照の後にkendo.aspnetmvc.jsへの参照を追加することであるかのように見えました。私は自分のサイトでバージョン2017.2.504を使用してこれを試し、問題を修正しました。

9
John Sully

次のスクリプトを_layout.cshtmlに追加しました。

<script type="text/javascript" asp-append-version="true" src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script>
1
Chris J