Question

我有一个分页的表格，允许最终用户修改表格本身的内联。

我正在使用一个提交按钮，该按钮重定向并使用SSJS保存输入。

我的表可能有5k +条记录，并且该表将被分页。

我只想更新具有选中复选框的记录。

我正在使用此链接进行测试 https://www.w3schools.com/html/tryit.asp?filename=tryhtml_form_submit

使用以下代码：

 <!DOCTYPE html>
    <html>
    <body>
    
    <h2>HTML Forms</h2>
    
    <form action="/action_page.php">
    
    <table>
    <tr>
    <td>
    Check for save
    </td>
      <td>
      First name
      </td>
      <td>
    Last Name  
      </td>
      </tr>
    
      <tr>
      <td>
        <input type="checkbox" id="horns" name="feature" value="horns" />
      </td>
      <td>
      <input type="text" name="firstname" value="Mic1key">
      </td>
      <td>
      <input type="text" name="lastname" value="Mouse">
      </td>
    </tr>
      <tr>
      <td>
      <input type="checkbox" id="horns" name="feature" value="horns" />
      </td>
      <td>
      <input type="text" name="firstname" value="Mic1key">
      </td>
      <td>
      <input type="text" name="lastname" value="Mouse">
      </td>
    </tr>
      </table>
      <input type="submit" value="Submit">
    </form> 
    </body>
    </html>

之所以行之有效，是因为在SSJS中，我们可以检查哪些表具有被检查的值，但是一旦表中有5k +条记录，我就会担心性能问题。

是否仍然只提交选中了复选框的记录？还是有别有用心的逻辑？

Answer 1

如果只希望在选中复选框时提交表单，则可以为“ submit”事件添加事件侦听器，如果未选中此复选框，则可以阻止默认设置，例如：

let submitButton = document.getElementById('mySubmitBtn');
let checkbox = document.getElementById('myCheckbox');

submitButton.addEventListener('submit', function(e){
    if(!checkbox.checked){
        e.preventDefault();
    }
});

通过这种方式，仅在选中复选框后，表单才会提交。

这个问题似乎在这里Submit only non empty inputs

得到了解决。

HTML提交表取决于复选框

1 个答案: