Question

我正在尝试使用javascript将表格的记录发送为表格。我尝试使用下面的方法。

我知道我的foreach函数没有捕获标签。我该如何解决，这样我才能发送到php并以POST ['SHOWTITLE']的身份接收

<tbody>
  <tr id="0">
    <td class="d-none">
      <input type="text" class="form-control transparent-input" name="1" value="1">
    </td>
    <td>
      <input type="text" class="form-control transparent-input" name="SHOWTITLE" value="The Accidental Astronauts" disabled="">
    </td>
  </tr>
  <tr>
  <td>
    <button onclick="submitRowAsForm(0)" id="btnRoom" class="btn btn-outline-success">Room</button>
  </td>
  </tr>
</tbody>

function submitRowAsForm(id) {
  form=document.createElement('form');
  form.method='POST';
  form.action='orderTicket.php';

  $("#"+id+" td").children().each(function() {
    $(this).clone().appendTo(form);
  });

  document.body.appendChild(form);
  form.submit();
}

Answer 1

请尝试执行此操作，即将“ disabled =“''删除为只读。如果元素被禁用，则其值不会发送到服务器。因此，正确的代码如下：

<tbody>
  <tr id="0">
    <td class="d-none">
      <input type="text" class="form-control transparent-input" name="1" value="1">
    </td>
    <td>
      <input type="text" class="form-control transparent-input" name="SHOWTITLE" value="The Accidental Astronauts" readonly>
    </td>
  </tr>
  <td>
    <button onclick="submitRowAsForm(0)" id="btnRoom" class="btn btn-outline-success">Room</button>
  </td>
</tbody>

function submitRowAsForm(id) {
  form=document.createElement('form');
  form.method='POST';
  form.action='orderTicket.php';

  $("#"+id+" td").children().each(function() {
    $(this).clone().appendTo(form);
  });

  document.body.appendChild(form);
  form.submit();
}

Answer 2

您可以像这样迭代所有输入标签：

function submitRowAsForm(id) {
  form=document.createElement('form');
  form.method='POST';
  form.action='orderTicket.php';

  $("tbody input[type=text]").each(function() {
    $(this).clone().appendTo(form);
  });

  document.body.appendChild(form);
  form.submit();
}

Answer 3

function submitRowAsForm(id) {
    form=document.createElement('form');
    form.method='POST';
    form.action='orderTicket.php';

    $("#"+id).children().each(function() {
      $(this).children().each(function(){
          $(this).clone().appendTo(form);
      });

    });
    document.body.appendChild(form);
    form.submit();

}

Answer 4

此html不需要任何JavaScript即可提交表单，是的，您需要编写CSS来使内在DIV内联，可以使用CSS flex轻松实现，请记住，这是仅用于一行，您必须迭代整个html以创建另一行。

<div>
    <form action="orderTicket.php" method="POST">
        <div>
            <input type="text" class="form-control transparent-input" name="1" value="1">
        </div>
        <div>
            <input type="text" class="form-control transparent-input" name="SHOWTITLE" value="The Accidental Astronauts" readonly>
        </div>
        <div>
            <button type="submit" class="btn btn-outline-success">Room</button>
        </div>
    </form>
</div>

如何使用foreach捕获输入元素

4 个答案: