当我尝试提交时,只提交了“备注”框,数量选择器中的当前数量被删除

When i try submitting, only the "notes" box gets submitted and the current quantity in the quantity selector gets deleted

提问人:Tim R 提问时间:11/1/2023 最后编辑:Tim R 更新时间:11/2/2023 访问量:27

问:

对于一个学校项目,我必须帮助一家比萨店提供一些 IT 解决方案,其中之一是笔记页面,收银员在其中选择数量并添加笔记(例如没有洋葱)。然后他应该能够提交这些笔记,以便将它们发送到购物车页面,但目前这还没有问题。我只需要修复提交部分。这是我当前的代码:

修复了它,但它将数据发送到调试控制台。我不知道这是否是正确的方法,但我希望我可以将信息发送到我制作的 Flask 服务器,如果有结果,明天会更新这个问题。

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <title>Notes</title>
        <style>
            .submission {
                text-align: center;
                padding: 5px;
                margin: 2%;
            }
        </style>
    </head>
    <body>

        <!-- Quantity selecter -->
        <form id='myform' method='POST' class='quantity' action='#'>
            <input type='button' value='-' class='qtyminus minus' field='quantity' />
            <input type='text' name='quantity' value='0' class='qty' />
            <input type='button' value='+' class='qtyplus plus' field='quantity' />
            <label for="quantity">Select a quantity: </label>
          </form>
          
          <style>
          #myform {
              text-align: center;
              padding: 5px;
              margin: 2%;
          }
          .qty {
              width: 40px;
              height: 25px;
              text-align: center;
          }
          input.qtyplus { width:25px; height:25px;}
          input.qtyminus { width:25px; height:25px;}
          label{
            display:block;
            margin-top: 10px;
            margin-bottom: 10px;
          }
          </style>
          
          <script>
           jQuery(document).ready(($) => {
                  $('.quantity').on('click', '.plus', function(e) {
                      let $input = $(this).prev('input.qty');
                      let val = parseInt($input.val());
                      $input.val( val+1 ).change();
                  });
           
                  $('.quantity').on('click', '.minus', 
                      function(e) {
                      let $input = $(this).next('input.qty');
                      var val = parseInt($input.val());
                      if (val > 0) {
                          $input.val( val-1 ).change();
                      } 
                  });
              });
              </script>
            <form>
            <!-- Notes input field -->
            <div class="submission">
            <label for="Notes">Notes: </label>
            <input type="text" id="Notes" name="Notes" placeholder="Margarita">
            </div>

            <!-- Submit button -->
            <div class="submission"><button type="submit"> Submit </button></div>          
            </form>
    </body>
</html>

我只是一个初学者,所以如果你对我的代码有任何意见,除了当前的问题,请告诉我,我很高兴学习。

我尝试在不同的论坛、谷歌上搜索,也通过我的好朋友 ChatGPT 进行搜索,但他们都没有为我提供有效的答案。

HTML jQuery 表单 提交

评论

0赞 Carsten Løvbo Andersen 11/1/2023
你的表单标签是我认为你错过了一些信息<form>
0赞 Tim R 11/2/2023
@CarstenL øvboAndersen,您认为缺少哪些信息?
0赞 Carsten Løvbo Andersen 11/2/2023
你知道,方法,行动等等

答: 暂无答案