Как я могу выбрать все строки в дочерней сетке, когда выбрана ее родительская строка, с использованием сетки кендо?

Question

Как я могу выбрать все строки в дочерней сетке, когда выбрана ее родительская строка, с использованием сетки кендо?

0

У меня есть иерархическая иерархия кендо. Когда я нажимаю строку в родительской сетке, родительская строка выбирается и расширяется, чтобы показать дочернюю сетку. Моя проблема в том, что мне нужно иметь возможность изменять все дочерние строки в выбранном состоянии.

Вот как я могу изменить родительскую строку в выбранное состояние:

$("#gridMasterInfo").delegate('tbody>tr', 'click', function (e) {
     var row = $(this);
     $(this).toggleClass('k-state-selected');                       
});

Вот пример JSFiddle выбора строки до сих пор

Любая помощь приветствуется, спасибо.

Carlos Mendieta 29 апр. 2014, в 19:53

Источник

0

ты получил решение для этого?
Dave 29 апр. 2014, в 18:14
0

пока нет, все еще ищу
Carlos Mendieta 29 апр. 2014, в 18:28
0

Вы имеете в виду, что вы также хотите редактировать вложенную сетку, которая появляется, когда вы щелкаете по родительской строке. если это так, какие данные должны быть показаны в подсетке.
Dave 29 апр. 2014, в 18:29
0

нет, я не хочу ничего редактировать. я просто хочу выделить все строки дочерней сетки, когда строка родительской сетки выбрана / выделена
Carlos Mendieta 29 апр. 2014, в 18:56
1

Таким образом, вы ищете только стандартный способ кендогрида, чтобы выделить его, или это можно сделать с помощью пользовательского события щелчка jquery (я хотел проверить и выбрать дочерний идентификатор сетки и выделить все строки с помощью jquery, добавив класс css)
Dave 29 апр. 2014, в 19:02
0

мне нужно пользовательское событие jquery click, подобное тому, которое было опубликовано выше, но в то же время, когда оно запускается, мне нужно, чтобы все дочерние строки включали их k-state-selected
Carlos Mendieta 29 апр. 2014, в 19:12

Показать ещё 4 комментария

Теги:

jquery

kendo-ui

kendo-grid

1 ответ

Ещё вопросы

Вы имеете в виду, что вы также хотите редактировать вложенную сетку, которая появляется, когда вы щелкаете по родительской строке. если это так, какие данные должны быть показаны в подсетке.
нет, я не хочу ничего редактировать. я просто хочу выделить все строки дочерней сетки, когда строка родительской сетки выбрана / выделена
Таким образом, вы ищете только стандартный способ кендогрида, чтобы выделить его, или это можно сделать с помощью пользовательского события щелчка jquery (я хотел проверить и выбрать дочерний идентификатор сетки и выделить все строки с помощью jquery, добавив класс css)
мне нужно пользовательское событие jquery click, подобное тому, которое было опубликовано выше, но в то же время, когда оно запускается, мне нужно, чтобы все дочерние строки включали их k-state-selected

OnaBai · Accepted Answer · 2014-04-29T18-06-00.000Z

Вам нужно немного программирования и знать, как выбирать и отменить выбор строк...

Самое первое, что создает метод detailInit для вашей сетки, вы, вероятно, знакомы с этим, и единственное, что здесь, это добавить небольшой трюк, чтобы легко найти строки данных в родительской сетке.

function detailInit(e) {
    $("<div class='ob-child-grid'/>").appendTo(e.detailCell).kendoGrid({
        ...
    });
}

Как вы можете видеть, я добавил ob-child-grid в контейнер сетки. Я действительно могу полагаться на k-secondary (этот класс добавлен интерфейсом Kendo UI к этому узлу), но я предпочитаю не полагаться на не документированную функциональность, поэтому код менее уязвим для будущих модификаций KendoUI.

Далее задается обработчик change который вызывается при выборе строки в родительском элементе. Эта функция должна:

Удалите ранее выбранные строки в сетке деталей. Я предполагаю, что после того, как вы выберете новую строку в родительском, вы хотите, чтобы дети из ранее выбранного родителя были отменены.
Найдите дочернюю сетку текущей выбранной строки.
Выберите каждый элемент в дочерней сетке.

Давайте посмотрим, как это сделать:

// Remove previous selections
$("tr", ".ob-child-grid").removeClass("k-state-selected");

Как вы видите, этот шаг довольно прост, просто удалите "k-state-selected", это все, что вам действительно нужно.

// Find the child grid.
var child = this.select().next().find(".ob-child-grid");

this.select() получает в настоящее время выбранную строку, а next() получает следующую строку, где KendoUI помещает дочернюю сетку. С помощью find(".ob-child-grid") мы находим узел, где на самом деле сетка.

// Select every row
$("tr", child).addClass("k-state-selected");

Мы добавляем k-state-selected который является классом, который отмечает выбранную строку.

Вы можете играть с этой идеей здесь: http://jsfiddle.net/OnaBai/XaMer/

Это чудесно! единственное отличие состоит в том, что мне действительно нужно сохранять состояние выбранных дочерних элементов до тех пор, пока родительский элемент не будет отключен (независимо от того, какой другой родительский ряд выбран). Большое спасибо за помощь. Я очень ценю это.