Question

我的数据显示方式有问题。输入第一个和第二个表的任何数据都不会显示，但输入第3个表的任何内容不仅会显示在第3个表中，还会显示在第1个和第2个表中。如何更改此设置，以便数据可以单独显示在每个表中。

以下是它的外观示例：

这是我的HTML / PHP相关代码：

<p>
<div class="border1">
<div id="rebate_400p">
<strong>400P</strong><br>
</div>

<?php if(isset($_POST['rows'])): ?>
    <table cellspacing="20">
        <tr align="center" class="table_row">
            <td>Tier</td>
            <td>Purchase Minimum</td>
            <td>Multiplier</td>
            <td>UOM</td>
            <td>Retro</td>
            <td>Guaranteed</td>
            <td>Paid</td>
        </tr>
        <?php 
            $count = 1;
            foreach($_POST['rows'] as $row): 
        ?>
            <tr align="center">
                <td><?php echo $count; ?></td>
                <td><?php echo $row['purchase_minimum']; ?></td>
                <td><?php echo $row['multiplier']; ?></td>
                <td><?php echo $row['uom']; ?></td>
                <td><?php echo $row['retro']; ?></td>
                <td><?php echo $row['guaranteed']; ?></td>
                <td><?php echo $row['paid']; ?></td>
            </tr>
        <?php 
            $count++;
            endforeach; 
        ?>
    </table>
<?php endif; ?>
</div>
</p>

<!-- 400M -->
<p>
<div class="border1">
<div id="rebate_400m">
<strong>400M</strong><br>
</div>

<?php if(isset($_POST['rows'])): ?>
    <table cellspacing="20">
        <tr align="center" class="table_row">
            <td>Tier</td>
            <td>Purchase Minimum</td>
            <td>Multiplier</td>
            <td>UOM</td>
            <td>Retro</td>
            <td>Guaranteed</td>
            <td>Paid</td>
        </tr>
        <?php 
            $count = 1;
            foreach($_POST['rows'] as $row): 
        ?>
            <tr align="center">
                <td><?php echo $count; ?></td>
                <td><?php echo $row['purchase_minimum']; ?></td>
                <td><?php echo $row['multiplier']; ?></td>
                <td><?php echo $row['uom']; ?></td>
                <td><?php echo $row['retro']; ?></td>
                <td><?php echo $row['guaranteed']; ?></td>
                <td><?php echo $row['paid']; ?></td>
            </tr>
        <?php 
            $count++;
            endforeach; 
        ?>
    </table>
<?php endif; ?>
</div>
</p>

<!-- 400D -->
<p>
<div class="border1">
<div id="rebate_400d">
<strong>400D</strong><br>
</div>

<?php if(isset($_POST['rows'])): ?>
    <table cellspacing="20">
        <tr align="center" class="table_row">
            <td>Tier</td>
            <td>Purchase Minimum</td>
            <td>Multiplier</td>
            <td>UOM</td>
            <td>Retro</td>
            <td>Guaranteed</td>
            <td>Paid</td>
        </tr>
        <?php 
            $count = 1;
            foreach($_POST['rows'] as $row): 
        ?>
            <tr align="center">
                <td><?php echo $count; ?></td>
                <td><?php echo $row['purchase_minimum']; ?></td>
                <td><?php echo $row['multiplier']; ?></td>
                <td><?php echo $row['uom']; ?></td>
                <td><?php echo $row['retro']; ?></td>
                <td><?php echo $row['guaranteed']; ?></td>
                <td><?php echo $row['paid']; ?></td>
            </tr>
        <?php 
            $count++;
            endforeach; 
        ?>
    </table>
<?php endif; ?>
</div>
</p>

以下是我的一些Javascript代码：

// ----- Deletes row for 400p -----
function deleteRow(row)
{
    var i=row.parentNode.parentNode;
    i.parentNode.removeChild(i);
}

// ----- Adds row for 400p -----
function insRow()
{
  var x=document.getElementById('tables');
  var new_row = x.rows[1].cloneNode(true);
  var len = x.rows.length;
  new_row.cells[0].innerHTML = len;

  var inp1 = new_row.cells[1].getElementsByTagName('input')[0];
  inp1.id += len;
  inp1.value = '';
  var inp2 = new_row.cells[2].getElementsByTagName('input')[0];
  inp2.id += len;
  inp2.value = '';

  var inputs = new_row.querySelectorAll('input[type=text]');

  for(var i=0;i<inputs.length;i++)
  {
      inputs[i].value='';
      inputs[i].name='rows[' + len + '][' + inputs[i].dataset.name + ']';
  }

  x.appendChild(new_row)
}

// ----- JS for 400M -----

// ----- Deletes row for 400m -----
function deleteRow1(row)
{
    var i=row.parentNode.parentNode;
    i.parentNode.removeChild(i);
}

// ----- Adds row for 400m -----
function insRow1()
{
  var x=document.getElementById('tables1');
  var new_row1 = x.rows[1].cloneNode(true);
  var len = x.rows.length;
  new_row1.cells[0].innerHTML = len;

  var inp1 = new_row1.cells[1].getElementsByTagName('input')[0];
  inp1.id += len;
  inp1.value = '';
  var inp2 = new_row1.cells[2].getElementsByTagName('input')[0];
  inp2.id += len;
  inp2.value = '';

  var inputs = new_row1.querySelectorAll('input[type=text]');

  for(var i=0;i<inputs.length;i++)
  {
      inputs[i].value='';
      inputs[i].name='rows[' + len + '][' + inputs[i].dataset.name + ']';
  }

  x.appendChild(new_row1)
}

// ----- JS for 400D -----

// ----- Deletes row for 400d -----
function deleteRow2(row)
{
    var i=row.parentNode.parentNode;
    i.parentNode.removeChild(i);
}

// ----- Adds row to 400d -----
function insRow2()
{
  var x=document.getElementById('tables2');
  var new_row2 = x.rows[1].cloneNode(true);
  var len = x.rows.length;
  new_row2.cells[0].innerHTML = len;

  var inp1 = new_row2.cells[1].getElementsByTagName('input')[0];
  inp1.id += len;
  inp1.value = '';
  var inp2 = new_row2.cells[2].getElementsByTagName('input')[0];
  inp2.id += len;
  inp2.value = '';

  var inputs = new_row2.querySelectorAll('input[type=text]');

  for(var i=0;i<inputs.length;i++)
  {
      inputs[i].value='';
      inputs[i].name='rows[' + len + '][' + inputs[i].dataset.name + ']';
  }

  x.appendChild(new_row2)
}

Answer 1

我发现了我的问题。在我的PHP代码中，对于每个表，我输入数据的每个文本框都有相同的名称。我更改了每个人的名字并解决了问题。

Answer 2

在你的js中你这样做：

var x=document.getElementById('tables1');

但是在你的html中，你没有给你的表个人ID：

<table cellspacing="20">

尝试

<table id="tables1" cellspacing="20">

等等。所有三个表都需要不同的id。

Answer 3

通过修改几个不同位置的代码解决了您的问题。在当前的代码中，您会得到混乱的结果，因为您使用相同的数组索引覆盖了某些值。为了确保它不冲突，我建议使用multidimensional arrays。一些变化：

1。第一个表包含多个索引：

添加了额外的[0]索引。这应该适用于所有输入，而不仅仅是purchase_minimum

<input type="text" id="rebate_tables" data-name="purchase_minimum" name="rows[0][0][purchase_minimum]">

在第二个表中我们做同样的事情，但是在第一个表中写入[1]而不是[0]（下一个索引的顺序递增）：

<input type="text" id="rebate_tables" data-name="purchase_minimum" name="rows[1][0][purchase_minimum]">

在第三个表格中，我们将[2]：

<input type="text" id="rebate_tables" data-name="purchase_minimum" name="rows[2][0][purchase_minimum]">

此外，重要的是要使最后一个索引（单词）没有数字（而不是purchase_minimum1，就像你的情况一样，使用purchase_minimum）。

2。在JavaScript中，我们做同样的事情+第二个索引应该是len - 1而不是len，否则会转到0,2,3,4 ......

第一桌：

for (var i = 0; i < inputs.length; i++) {
    inputs[i].value = '';
    inputs[i].name = 'rows[0][' + (len - 1) + '][' + inputs[i].dataset.name + ']';
}

对于第二张表，我们将：

inputs[i].name = 'rows[1][' + (len - 1) + '][' + inputs[i].dataset.name + ']';

在第三个：

inputs[i].name = 'rows[2][' + (len - 1) + '][' + inputs[i].dataset.name + ']';

3。在您的确认页面中，我们仅在所有区域更改foreach：

将是：

foreach($_POST['rows'][0] as $row):

而不是：

foreach($_POST['rows'] as $row):

此外，在每个foreach中，您必须删除（字符串）索引中的相同附加数字，例如：

<td><?php echo $row['purchase_minimum']; ?></td>

如果我遗漏任何内容，请告诉我，但仍然无效。

数据以HTML格式复制到其他动态表

3 个答案: