带有复选框和可编辑输入框的HTML表单

HTML form with checkboxes and editable input boxes

本文关键字：HTML 表单 输入 编辑 复选框      更新时间：2023-09-26

让我试着描述一下我试图实现的目标：

我想使用表格显示表格，其中每行都有一个复选框、该行中项目的唯一标识符和建议数量。数量是可编辑的，用户可以选择行的子集。

该表格将提交以下内容：对于所选的每一行，将向服务器提交唯一的标识符和数量。

我可以用javascript来"激活"提交的行，但我无法想出一个UID+Qty配对的解决方案。

欢迎任何建议！

谢谢。

您可以制作这样的表单：

<?php
$width = 10; 
$height = 5;
echo '<form ...>';
echo '<table>';
for($i=0;$i<$height;$i++){
    echo "<tr>";
    for($j=0;$j<$width;$j++){
    echo <td>';
    echo '<input type="checkbox" name="'.$i.'x'.$j.'" />';
    echo '<input type="text" name="'.$i.'x'.$j.'value" value="la valeur" />';
    echo '</td>';
    }
    echo '</tr>';
    }
echo '</table>';
echo '<submit...>';
echo '</form>';

然后在处理部分，您可以进行两个循环，验证复选框是否选中，并更新值（如果是）

如果您的服务器端语言支持它，我建议使用数组语法。例如

<tr>
 <td>
  <input type="checkbox" />
 </td>
 <td>
  <span>NAME</span>
 </td>
 <td>
  <input type="text" name="qty[5]" value="10" />
 </td>
</tr>

然后，服务器端语言只需要运行POSTed qty数组，其中索引是UID，值是Quantity。这个模型可以这样扩展：

<tr>
 <td>
  <input type="checkbox" />
 </td>
 <td>
  <input type="text" name="name[5]" value="Name" />
 </td>
 <td>
  <input type="text" name="qty[5]" value="10" />
 </td>
</tr>
相关文章：