Используйте Kendo Jquery в PHP Symfony Project
Итак, я скачал Kendo для Jquery и пытаюсь импортировать его в мое приложение Symfony.
Я добавил файлы css и JQuery, а также файл kendo.all js в заголовок моей основной ветки. Это выглядит так:
<head>
<!-- Common Kendo UI CSS for web widgets and widgets for data visualization. -->
<link rel="stylesheet" href="{{ asset('build/kendo_css/kendo.common.min.css') }}">
<!-- Default Kendo UI theme CSS for web widgets and widgets for data visualization. -->
<link rel="stylesheet" href="{{ asset('build/kendo_css/kendo.default.min.css') }}">
<script src="{{ asset('build/kendo_js/jquery.min.js') }}"></script>
<script src="{{ asset('build/kendo_js/kendo.all.min.js') }}"></script>
</head>
Теперь, если я попытаюсь сделать встроенный javascript для сетки кендо, вот так:
<script>
$("#grid").kendoGrid({
columns: [{
field: "FirstName",
title: "First Name"},
{
field: "LastName",
title: "Last Name"}],
dataSource: {
data: [{
FirstName: "Joe",
LastName: "Smith"},
{
FirstName: "Jane",
LastName: "Smith"}]
}
});
</script>
(это все в моей базовой ветке) это работает.
Но если я попытаюсь добавить его в новый файл js и импортировать этот файл js в другую ветку, которая расширяет базовую ветку (в основном все загружается css и js, jquery, kendo и мой пользовательский файл js), я не могу получить доступ к методу kendoGrid , Это говорит:
jQuery.Deferred exception: $(...).kendoGrid is not a function TypeError: $(...).kendoGrid is not a function
at HTMLDocument.<anonymous> (http://127.0.0.1:8000/build/admin/users/index_js.js:10456:16)
at mightThrow (http://127.0.0.1:8000/build/admin/users/index_js.js:3609:29)
at process (http://127.0.0.1:8000/build/admin/users/index_js.js:3677:12) undefined
jQuery.Deferred.exceptionHook @ jquery.js:3818
jquery.js:3827 Uncaught TypeError: $(...).kendoGrid is not a function
at HTMLDocument.<anonymous> (index.js:4)
at mightThrow (jquery.js:3534)
at process (jquery.js:3602)
Другая веточка выглядит так:
{% extends 'base.html.twig' %}
{% block javascripts %}
{{ parent() }}
<script src="{{ asset('build/admin/users/index_js.js') }}"></script>
{% endblock %}
{% block base_body %}
<div id="grid" class="row">
</div>
{% endblock %}
и пользовательский файл JS:
$(document).ready(function () {
$("#grid").kendoGrid({
columns: [{
field: "FirstName",
title: "First Name"},
{
field: "LastName",
title: "Last Name"}],
dataSource: {
data: [{
FirstName: "Joe",
LastName: "Smith"},
{
FirstName: "Jane",
LastName: "Smith"}]
}
});
});
Решение
Задача ещё не решена.
Другие решения
Других решений пока нет …