Хобрук: Ваш путь к мастерству в программировании

Сетка кендо заполняется под вкладками кендо

Я не вижу примеров создания сетки кендо с вкладками кендо. Разве это невозможно? Когда я попробовал демо-версию kendo-tabstrip и демо-версию kendo-grid. Оба работают круто по отдельности, но когда я объединяю вкладки кода, они не отображаются должным образом.



Ответы:


1

Я успешно использую сетку кендо внутри вкладки. Сетка не будет отображаться внутри вкладки, если я не удалю "‹!DOCTYPE html›". Если присутствовал DOCTYPE, вкладка всегда была пустой. Я не уверен, почему это решило проблему. Что именно вы подразумеваете под "не показывает должным образом"?

Редактировать: я думаю, что моя проблема на самом деле была вызвана тем, что у нас был разделитель и сетка внутри вкладки.

16.09.2013

2

Мне удалось добавить сетку кендо внутрь вкладки кендо. После добавления необходимых файлов js jquery-3.2.1/kendo.all.min.js и необходимых файлов css kendo.common-bootstrap.min.css/kendo.black.min.css.

Мой HTML

$(document).ready(function () {
    $("#tabstrip").kendoTabStrip({
        animation: {
            open: {
                effects: "fadeIn"
            }
        }
    });
    $("#grid1").kendoGrid({
        dataSource: {
            type: "odata",
            transport: {
                read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
            },
            pageSize: 20
        },
        height: 550,
        groupable: true,
        sortable: true,
        pageable: {
            refresh: true,
            pageSizes: true,
            buttonCount: 5
        },
        columns: [{
            template: "<div class='customer-photo'" +
                            "style='background-image: url(../content/web/Customers/#:data.CustomerID#.jpg);'></div>" +
                        "<div class='customer-name'>#: ContactName #</div>",
            field: "ContactName",
            title: "Contact Name",
            width: 240
        }, {
            field: "ContactTitle",
            title: "Contact Title"
        }, {
            field: "CompanyName",
            title: "Company Name"
        }, {
            field: "Country",
            width: 150
        }]
    });

});
<div id="tabstrip">
    <ul>
        <li>Tab with Grid</li>
        <li>Tab without Grid</li>
    </ul>
    <div>
        <div id="grid1"></div>
    </div>
    <div>
        <div>Normal content</div>
    </div>
</div>

Мне не пришлось удалять ‹!DOCTYPE html›. Код табуляции и сетки был взят из демонстраций кендо. здесь: https://demos.telerik.com/kendo-ui/tabstrip/index и здесь: https://demos.telerik.com/kendo-ui/grid/index

21.12.2017
Новые материалы

Как я могу подписаться на тему изображений в ROS Matlab и получить изображение RGB?
Привет, Пожалуйста, как я могу извлечь изображение из сообщения ROS Image, за которым следует imshow? Я уже подписался на правильную тему, но message.getData() дает мне объект..

Понимание СТРУКТУРЫ ДАННЫХ И АЛГОРИТМА.
Что такое структуры данных и алгоритмы? Термин «структура данных» используется для описания того, как данные хранятся, а алгоритм используется для описания того, как данные сжимаются. И данные, и..

Как интегрировать модель машинного обучения на ios с помощью CoreMl
С выпуском новых функций, таких как CoreML, которые упростили преобразование модели машинного обучения в модель coreML. Доступная модель машинного обучения, которую можно преобразовать в модель..

Создание успешной организации по науке о данных
"Рабочие часы" Создание успешной организации по науке о данных Как создать эффективную группу по анализу данных! Введение Это обзорная статья о том, как создать эффективную группу по..

Технологии и проблемы будущей работы
Изучение преимуществ и недостатков технологий в образовании В быстро меняющемся мире технологии являются решающим фактором в формировании будущего работы. Многие отрасли уже были..

Игорь Минар из Google приедет на #ReactiveConf2017
Мы рады сообщить еще одну замечательную новость: один из самых востребованных спикеров приезжает в Братиславу на ReactiveConf 2017 ! Возможно, нет двух других кланов разработчиков с более..

Я собираюсь научить вас Python шаг за шагом
Привет, уважаемый энтузиаст Python! 👋 Готовы погрузиться в мир Python? Сегодня я приготовил для вас кое-что интересное, что сделает ваше путешествие более приятным, чем шарик мороженого в..