Question

我有一个允许用户动态添加行的表单。表单内部有数组单选按钮。

问题：

当我尝试点击第二行的单选按钮或其他原始按钮时，单选按钮值将仅显示在第一列，其他则有偏移错误。

一开始，我的概念是根据数组列存储的值不是。
因此，我尝试使用JavaScript设置每个原始单选按钮的值，但它显示此错误：

未捕获的TypeError：无法读取属性＆＃39; 2＆＃39;为null

＆＃13;

function addRow(tableID) {
	var table = document.getElementById(tableID);
	var radioB = document.getElementById(BX_related);
	var rowCount = table.rows.length;
							// limit the user from creating fields more than your limits
		var row = table.insertRow(rowCount);
		var colCount = table.rows[0].cells.length;

		for(var i=0; i<colCount; i++) {
			
			var newcell = row.insertCell(i);
			newcell.innerHTML = table.rows[1].cells[i].innerHTML; //row[which table u need to duplicate]
			table.rows[rowCount].cells[0].innerHTML = rowCount;
			}
			radioB[rowCount].value = rowCount;

}

＆＃13;

<table id="dataTable" class="form" border="0">
	<tbody>
		<tr><th>Bil.</th><th>Nama</th><th>Umur</th><th>Dij./Ting.</th><th>Pekerjaan</th><th>Catatan</th><th>Berkenaan</th></tr>
		<tr ><td>1</td>
		<td><input type="text" name="BX_name[]" size="30"></td>
		<td><input type="text" name="BX_age[]"size="2" ></td>
		<td><input type="text" name="BX_study[]"size="8"></td>
		<td><input type="text" name="BX_work[]" size="10"></td>
		<td><input type="text" name="BX_note[]"size="15"></td>
		<td> <input type="radio" name="BX_related[]" id="BX_related" value="" required></td></tr>
	</tbody>
	</table>

＆＃13;

PHP部分：

<?php 
            $i =0;
            if(isset($_POST)=='submit'){

                $BX_name=$_POST['BX_name'];
                $BX_age=$_POST['BX_age'];
                $BX_related = $_POST['BX_related'];         
                echo $BX_related;
                foreach($BX_name as $a => $b)
                    {   
                        $i ++;                              
                    echo "<br> $i";
                        echo "name: ";
                        echo $BX_name[$a];
                    }

}
            ?>

任何人都有更好的解决方案吗？

Answer 1

更改

<input type="radio" name="BX_related[]" id="BX_related" value="" required>

到

<input type="radio" name="BX_related[]" class="BX_related" value="" required></td>

同样在addRow函数中，而不是

  var radioB = document.getElementById(BX_related);

使用

  var radioB = document.getElementsByClassName('BX_related);

多数民众赞成!!

动态添加行

1 个答案: