2つのネストしたテーブルがあります。親テーブルの行には、子テーブルが含まれています。両方のテーブルは、必要に応じて追加ボタンで行を追加できます。親表の値は、データベースのproduct_size表に挿入され、子表の値はproduct_color表に挿入されます。親テーブルにはサイズが含まれ、子テーブルにはそのサイズのアイテムの色と数量が含まれます。私は子テーブルの値(色&数量)を親テーブルの行に挿入したい。親の最初の行の子テーブル値が親の最初の行のみに挿入され、親テーブルの2番目の行にある子テーブルの値が親の2番目の行に挿入されることを意味します。現在のところ、私のコードは、親テーブルのすべての行からすべての子テーブルの値を取り、最初の行にデータベースに挿入し、親テーブルのすべての行からすべての子テーブルの値を取り込み、データベースの2番目の行に挿入します。親テーブル。私のコードをチェックし、私のコードのどこに問題があるのかを教えてください。/PHP CODE/ネストされた子テーブルの値を親テーブルの行に関連付ける方法と、子テーブルの値を挿入する方法は、phpの親テーブルの行に対応しています
if (isset($_POST['submit']))
{
$con=mysqli_connect("localhost", "root", "");
mysqli_select_db($con,"login");
for ($i=0; $i<count($_POST['size']); $i++){
$size = $_POST['size'][$i];
$qry1="INSERT INTO product_size (product_size) VALUES ('$size')";
$result1=mysqli_query($con,$qry1);
$product_size_id = mysqli_insert_id($con);
for ($j=0; $j<count($_POST['color']); $j++){
$quantity = $_POST['dress_quantity'][$j];
$color = $_POST['color'][$j];
$qry2="INSERT INTO product_color (product_size_id, product_color, product_quantity) VALUES ('$product_size_id', '$color', '$quantity')";
$result2=mysqli_query($con,$qry2);
if($result2)
{
echo '<script>alert("Record Added Successfully!")</script>';
echo '<script>window.location="try.php"</script>';
}
else
{
die("Error While Adding Stock! Please Try Again.");
}
}
}
}
/HTMLとJavascript/
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[1].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
if (i == colCount - 1) //last column which adds child table
{
//Get child table id of first row
var tableID = table.rows[1].cells[i].childNodes[1].getAttribute("id");
//Replace all occurances of parent table id's with new unique table id for child table before writing the information to DOM
newcell.innerHTML = table.rows[1].cells[i].innerHTML.replace(new RegExp(tableID,"g"), "dataTable" + Math.floor((Math.random() * 1000) + 1));
}
else //For other columns there is no need to assign unique id for controls
newcell.innerHTML = table.rows[1].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) {
alert("Cannot delete all the rows.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
function addRow1(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[1].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[1].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}
function deleteRow1(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) {
alert("Cannot delete all the rows.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
table {
border-collapse: collapse;
width: 100%;
border:1px solid #1E90FF;
}
th, td {
text-align: left;
padding: 8px;
border:1px solid #1E90FF;
}
th {
background-color: #1E90FF;
color: white;
}
<TABLE id="dataTable">
<thead>
<tr>
<th style="text-align: center;"> Select </th>
<th style="text-align: center;"> <b>Size</b> </th>
<th style="text-align: center;"> <b>Color & Quantity</b> </th>
</tr>
</thead>
<tbody>
<tr id='C1' class='customer'>
<td><input type="checkbox" name="chk"/></td>
<td><select name="size[]" id="size" required="" >
<option value="">Select Size</option>
<option value="Small">Small</option>
<option value=">Medium">Medium</option>
<option value="Large">Large</option>
</select></td>
<td>
<TABLE style="margin-top: 20px;" id="dataTable1" width="400px" border="1">
<thead>
<th> Select </th>
<th> <b>Color Quantity</b> </th>
</thead>
<TR>
<TD><INPUT type="checkbox" name="chk"/></TD>
<TD>
<select name="color[]" required="" >
<option value="">Select Color</option>
<option value="Red">Red</option>
<option value="Green">Green</option>
<option value="Yellow">Yellow</option>
<option value="Blue">Blue</option>
</select>
<input style="width: 120px; height: 26px; " oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);" type="number" name="dress_quantity[]" class="qty1" min="1" max="1000" maxlength="4" placeholder="Size Quantity" value="" required="">
</TD>
</TR>
</TABLE>
<INPUT type="button" value="Add Row" onclick="addRow1('dataTable1')" />
<INPUT type="button" value="Delete Row" onclick="deleteRow1('dataTable1')" />
</td>
</tr>
</tbody>
</TABLE>
<INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
<INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
、すべてのあなたの子供あなたが言ったようにすべてのサイズとすべての色とドレスの数量をループして同じ名前(すなわち、colorまたはdress_quantity)と呼びます。代わりに、各親行size1 []、size2 [] ... sizeN []の名前を変更してから、親行size1 []に対してcolor1 []、次にsize2 []に対してcolor2 []の子カラー配列を作成すると、あなたのフォームを介して、color2 []からcolor2のみを挿入します。 –
@ bio_sprite私のデータは静的ではないので、size1 []、size2 []などの名前をどのように置き換えることができますか? –
助けてもらえますか? –