Удаление динамических элементов и изменение порядка их значений и идентификаторов
У меня есть функция, которая создает элемент DOM onClick. Этот элемент содержит входы сarray names.
В начале яalready have one элемент (такой же, как те, которые я создаю onClick).
<tbody id="elementsBody">
<tr id="element1"> // 1 becomes 2 and so on when new element is added
<td>
<input type="hidden" name="numbers[]" value="1" /> // 1 becomes 2 and so on when new element is added
</td>
<td>
<input type="text" name="titles[]" />
</td>
</tr>
// Newly created Elements goes in here!!!
</tbody>
Это моя функция, которая создает больше элементов, подобных приведенному выше.
А такжеcreates a Delete Button DIV для этого вновь созданного элемента.
function addElement() {
var elementsBody = document.getElementById('elementsBody');
var numbers = document.forms[1].elements['numbers[]'];
var number = numbers.length+1;
if (isNaN(number)) {
var number = 2;
}
var numberInput = '<td><input type="hidden" name="numbers[]" value="'+ number + '" /></td>';
var titleTd = '<td><input type="text" name="titles[]" /></td>';
// This is the Delete Button DIV
// I want to create a function (deleteElement) which Removes This Element
var deleteButton = '<td><div onClick="deleteElement('+ number + ')">Delete Element</div></td>';
elementsBody.insertAdjacentHTML('beforeend', '<tr id="element' + number + '">' + numberInput + titleTd + deleteButton + '</tr>');
}
I want to create a function (deleteElement) which Removes this Added Element по щелчку.
После удаления элемента я хочу, чтобы эта функцияreorder all the elements values and ID's, Например, если я удаляю Элемент № 2, значение и идентификатор третьего Элемента должны стать 2.
Не JQuery.
Пожалуйста, помогите мне с этим!