Получить дочерние элементы из определенной ячейки в HTMLTableRowElement и скрыть / удалить их? - PullRequest
1 голос
/ 15 февраля 2012

Я работаю с некоторыми пользовательскими функциями Ajax с использованием Telerik MVC Grid и пытаюсь скрыть / удалить дочерние элементы ячейки на основе определенных критериев. Я нашел похожий вопрос здесь: Telerik MVC Grid делает столбец краснымЦвет основан на значении другого столбца , но он не может работать правильно.

В основном, когда строка привязана к базе данных в сетке, это событие вызывается:

 function onRowDataBound(e) {
        if (e.dataItem.Status == "Submitted") {
            $.each(e.row.cells, function (index, column) {
                alert(column.innerHTML);
                //var $header = $(column).closest('table').find('th').eq($(column).index());
                //if(header text == "Actions)
                //{
                     //Get the <a> child elements in the 'Actions' column whose class contains t-grid-Edit, 
                     //t-grid-edit, t-grid-Delete, or t-grid-delete and set their display to none, add a css class, and remove the element entirely
                //}
            }

        }
    }

Пока это работаетв том, что я могу получить и перебрать каждый столбец в строке, но я не уверен, что делать на этом этапе, я нашел это Как я могу получить соответствующий заголовок таблицы (th) из ячейки таблицы (td)? чтобы убедиться, что имя столбца называется Actions, но я не смог заставить его работать.Я не уверен, как преобразовать javascript-объект HTMLTableCellElement в объект jQuery, чтобы я мог использовать синтаксис, с которым я более знаком.

Вот что мне нужно сделать после этого:

  1. Получить дочерние элементы в 'Действиях' (должен идти по имени заголовка столбца вместо индекса ячейки, потому что числостолбцы могут измениться) столбец, класс которого содержит t-grid-Edit, t-grid-edit, t-grid-Delete или t-grid-delete
  2. Возьмите эти элементы и (каждое из этих действийбудет использоваться на разных страницах с использованием аналогичных настроек):

    • a.Установите стиль отображения элемента на none

    • b.Добавьте класс к элементу с именем "Hidden"

    • c.Полностью удалите элемент из кода

Как я могу добавить вышеуказанную функциональность в мою функцию onRowDataBound?

Спасибо, ТАК =).

1 Ответ

3 голосов
/ 15 февраля 2012

Я смог понять это с большим количеством игр:

function onRowDataBound(e) {
        if(e.dataItem.Status == "Submitted"){
            var $row = $(e.row);
            $.each($row.children("td"), function (index, column) {
                var $column = $(column);
                var $headerText = $column.closest('table').find('th').eq($column.index()).children(".t-link").text();
                if ($headerText == "Actions") {
                    $.each($column.children("a.t-grid-delete, a.t-grid-Edit"), function (subIndex, link) {
                        $(link).remove();

                    });
                }

            }); 
        }
    }
...