| mopsusha |
10.01.2018 03:45 |
Заменить name в input javascript
Есть код создания динамических таблиц, все работает хорошо, но для отправки формы на каждой строке таблицы name инпута должен заменяться на например
<tr>
<td>
<input name='0[stoimost]' >
</td>
<td>
<input name='0[usluga]' >
</td>
</tr>
<tr>
<td>
<input name='1[stoimost]' >
</td>
<td>
<input name='1[usluga]' >
</td>
</tr>
Однако он заменяет только если нажимаешь на кнопку добавления новой строки таблицы, а если таблица приходит из базы mysql первая строка таблицы заменяется, а остальные нет, остаются такими
<tr>
<td>
<input name='0[stoimost]' >
</td>
<td>
<input name='0[usluga]' >
</td>
</tr>
<tr>
<td>
<input name='stoimost' >
</td>
<td>
<input name='usluga' >
</td>
</tr>
Вот код JS
var DynamicTable = (function (GLOB) {
var RID = 0;
return function (tBody) {
/* Если ф-цию вызвали не как конструктор фиксим этот момент: */
if (!(this instanceof arguments.callee)) {
return new arguments.callee.apply(arguments);
}
//Делегируем прослушку событий элементу tbody
tBody.onclick = function(e) {
var evt = e || GLOB.event,
trg = evt.target || evt.srcElement;
if (trg.className && trg.className.indexOf("add") !== -1) {
_addRow(trg.parentNode.parentNode, tBody);
} else if (trg.className && trg.className.indexOf("del") !== -1) {
tBody.rows.length > 1 && _delRow(trg.parentNode.parentNode, tBody);
}
};
var _rowTpl = tBody.rows[0].cloneNode(true);
// Корректируем имена элементов формы
var _correctNames = function (row) {
var elements = row.getElementsByTagName("*");
for (var i = 0; i < elements.length; i += 1) {
if (elements.item(i).name) {
if (elements.item(i).type &&
elements.item(i).type === "radio" &&
elements.item(i).className &&
elements.item(i).className.indexOf("glob") !== -1)
{
elements.item(i).value = RID;
} else {
elements.item(i).name = RID + "["+ elements.item(i).name +"]";
}
}
}
RID++;
return row;
};
var _addRow = function (before, tBody) {
var newNode = _correctNames(_rowTpl.cloneNode(true));
tBody.insertBefore(newNode, before.nextSibling);
};
var _delRow = function (row, tBody) {
tBody.removeChild(row);
};
_correctNames(tBody.rows[0]);
};
})(this);
вот получение таблицы из mysql
<div id="tablici">
<form method="post" id="myForm" action="">
<table width="800" border="1" cellspacing="0" cellpadding="5">
<thead>
<tr>
<th scope="col">КОМНАТ в комм</th>
<th scope="col">КОРПУС</th>
<th scope="col">ЭТАЖ</th>
<th scope="col">S ОБЩАЯ</th>
<th scope="col">S ЖИЛАЯ</th>
<th scope="col">S КУХНИ</th>
<th scope="col">ОТДЕЛКА</th>
<th scope="col">БАЗОВАЯ СТОИМОСТЬ</th>
<th scope="col">ПЛАНИРОВКА</th>
<th scope="col">Кнопки</th>
</tr>
</thead>
<tbody id="dynamic">
<?
$keyk=0;
if($session_data){
foreach($session_data as $keym =>$v){
$v = unserialize($v);
foreach($v as $k => $valuee){
echo '<br>valuee<br>';
print_r($valuee);
echo '<br>valuee<br>k<br>';
print_r($k);
echo '<br>k<br>k<br>';
echo '<tr>';
if(is_array($valuee)){
$keyk++;
if(is_array($valuee)){
foreach($valuee as $titog=>$vitog){
echo $keyk.'<br>';
if ($keyk === 0){
echo "<td><label><input type='text' name='$titog' value='$vitog'>$vitog</td></label>";}
else {
echo "<td><label><input type='text' name='$titog' value='$vitog'>$titog</td></label>";
}
}
echo "<td><button type=\"button\" class=\"add\">+</button><button type=\"button\" class=\"del\">-</button></td>";
}
echo '</tr>';}
}
}
} else {echo 'session_data не массив';}
?>
</tbody>
</table>
<input name="sub" type="submit" style="margin: 10px">
</form>
</div>
<script src="dynamicTable.js"></script>
<script>
new DynamicTable( document.getElementById("dynamic") );
</script>
|