Невозможно выделить строку для динамически созданного GridView из JavaScript - PullRequest
0 голосов
/ 14 июня 2011

Это было легко сделать, но я впервые генерировал GridView динамически. Каждая ячейка GridView имеет свой собственный стиль CSS при создании. В событии RowDataBound я настроил подсветку как обычно:

e.Row.Attributes.Add("onmouseover", "this.style.cursor='pointer';HilightRow(this);")
e.Row.Attributes.Add("onmouseout", "HilightRow(this);")

На стороне сценария у меня есть следующее:

var curSelRow = null;
function HilightRow(row) {
    var selRow = row;
    var i;
        .
        .
    if (selRow != null) {
        curSelRow = selRow;
        curSelRow.style.backgroundColor = '#FFEEC2';
    }
}

Я проследил это в скрипте, и он работает нормально, ошибок нет, и когда я наблюдаю за рассматриваемой строкой, он правильно показывает правильное значение цвета фона (например, # FFEEC2), однако hover не меняет цвет строки. Я озадачен Не уверен, почему это происходит, и, как я уже сказал, я делал это много раз раньше без проблем, но в прошлом просмотры сетки не были динамичными.

Ответы [ 3 ]

0 голосов
/ 17 июня 2011

Я наконец-то понял проблему. Прежде чем устанавливать выделение, нужно удалить текущий примененный стиль в строке, установив curSelRow.cells[i].style.backgroundColor = ''. Теперь вы можете выделить строку, используя curSelRow.style.backgroundColor = '#FFEEC2', которая установит в строке значение выделения.

Кроме того, вы должны сохранить собственный стиль каждой ячейки, прежде чем сбросить значения и восстановить значение каждой ячейки, когда курсор покинет эту строку. В противном случае вы получите белый цвет для каждого ряда, над которым вы наводите курсор. Опять же, не забудьте сбросить стиль для выделенной строки, прежде чем установить стиль каждой ячейки в том виде, в котором она была изначально.

Какая боль!

0 голосов
/ 17 июня 2011

Хорошее решение, я думаю, это добавление класса в строку. Как класс = "Hilightrow". И избегайте скриптов в html-элементах и ​​отделяйте структуру от поведения.

  var hiliclass = "Hilightrow";
    var trhilight = document.getElementById("mytable").getElementsByTagName("tr"); 
    var len = trhilight.length; 
    for(var i=0;i<len;i++) {
        if(trhilight[i].className == hiliclass) {
            trhilight[i].onmouseover = function() {
                  trhilight[i].style.backgroundColor = "red"; 
           }
           .... 

}

    }

И иметь скрипт внутри функции и вызывать его внутри window.onload или используйте самовозвратную функцию, подобную этой:

 function highlightrows() {
   ..// my code 
   }(); 
0 голосов
/ 14 июня 2011

Я не уверен, что вы показали весь свой код, но похоже, что обе функции over и out устанавливают один и тот же bgcolor (# FFEEC2).

И onmouseover, и onmouseout вызывают HilightRow(этот).Начальный onmouseover устанавливает bgcolor?

...