Включить / выключить видимость кнопки в таблице - PullRequest
Новая
       15

Включить / выключить видимость кнопки в таблице

0 голосов
/ 22 ноября 2018

Я создаю таблицу с кнопкой в ​​5-м столбце.Сначала кнопка должна быть видна, когда пользователь нажимает на строку таблицы.У меня есть достоверная настройка видимости на ....

Вот мой код: 

for (var i = dataRaw.length; i > 0; i--) {

                var r = dataRaw[i-1];
                var row = table.insertRow(0);
                row.id = r[0];
                for (var x = 0; x < r.length; x++) {

                    if (i === 1) {
                        var headerCell = document.createElement("TH");
                        headerCell.innerHTML = r[x];
                        row.appendChild(headerCell);

                    } else {
                        var cell = row.insertCell(x);

                        if (x === 5) {

                            var btn = document.createElement('input');
                            btn.type = "button";
                            btn.className = "btn";
                            btn.id = r[0].toString();
                            btn.value = "Vis";
                            btn.style.backgroundColor = '#428bca';
                            btn.style.color = 'white';
                            btn.style.visibility = "hidden";
                            cell.appendChild(btn);

                        }
                        else {
                            cell.innerHTML = r[x];
                        }

                    }
                }
            }

У меня есть этот слушатель на столе: 

    $(function () {
        $('#errorTable').on('click', 'tr', function () {

            var requestID = this.id;

           document.getElementById(requestID).style.visibility = 'visible';

Кнопка"скрыто" при запуске, но я не могу показать это снова ..... Кто-нибудь?

1 Ответ

0 голосов
/ 22 ноября 2018

Предполагая, что в каждой строке есть одна кнопка, или вы хотите скрыть первую кнопку внутри строки \ 

$('#errorTable').on('click', 'tr', function () {

      //document.getElementById(requestID).style.visibility = 'visible';

       $(this).find('button').first().hide();           
       // or if you set your buttons as INPUTS:
       $(this).find('input[type=button]').first().hide();
}

Примечание: этот метод не требует уникального идентификатора строки, по которой был щелкнут.Если вы не хотите передать его обратно на сервер.

Редактировать

Ваш код, который генерирует кнопку, также может использовать некоторые модификации: 

if (x === 5) {
    var btn = $('<input>')
             .attr("type","button")
             .attr("id",r[0].toString())
             .attr("value","Vis")
             .css("background-color","#428bca")
             .css("color","white")
             .css("display","none")       // initially hidden
             .addClass("btn");

    btn.appendTo($(cell));
}

Редактировать 2

Чтобы снова переключить видимость кнопки, как вы описали в комментарии, здесь нет необходимости вызывать .first(), поскольку существует только один элемент с таким идентификатором. 

$("#" +requestID+ "btn").show();
...