Я пытаюсь разместить две кнопки ниже TD текущей активной строки таблицы. Я хочу, чтобы они выглядели так:
Я попробовал несколько десятков методов, но ни один из них не дал желаемого результата: либо кнопки не появляются вообще, либо они появляются после текущего активного TD, либо после всех строк таблицы.
Единственный работающий (вроде как) метод, который я нашел, это:
$(this).next().prepend(buttons); Но результат не особо эстетичен:
Точно такой же результат достигается с помощью:
$(this).next().append(buttons); Если я использую
$(this).append(buttons); Кнопки вставляются внутри ячейки, которую я редактирую, и их HTML-код тоже сохраняется, поэтому это не работает.
Я даже пытался создать специальный пустой TD в следующей строке таблицы (), в который можно было бы вставить кнопки, но я не могу найти правильный код для этой конкретной ячейки и других. Однако этот подход не самый лучший, поскольку кнопки появятся в первой ячейке следующей строки как для исходной, так и для целевой ячейки. Моя конечная цель — выполнить то, что показано на первом снимке экрана: кнопки должны появиться сразу под активной в данный момент ячейкой.
Вот некоторые из методов jQuery, которые я пробовал:
$(this).next('td.controls').append(buttons); /* ничего не отображается */ $(this).next('tr td.controls').append(buttons); /* ничего не отображается */ $(this).parent().append(кнопки); /* кнопки появляются после таблицы и за ее пределами */ $(this).parent().prepend(кнопки); /* кнопки появляются перед первой ячейкой активной строки */ $(this).parent().next().prepend(кнопки); /* кнопки вставляются внутрь ячейки `td.controls`, но как для источника, так и для цели */ Вот скрипка: https://jsfiddle.net/cheeseus/cf5qkba7/4/
Надеюсь, я предоставил всю необходимую информацию и код. Если нет, дайте мне знать.
