【问题标题】:Element with name not being sent with form data via POST带有名称的元素未通过 POST 与表单数据一起发送
【发布时间】:2018-09-06 08:11:19
【问题描述】:

我正在尝试将我的模态标题作为帖子数据提交,但它没有被发送。 我给元素一个名称属性。模态正文中的元素按我的预期提交。尝试在下面提交名称为“editModalTitle”的元素

HTML:

 <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModal" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <form action="/editItem" method="post" id ="editModalForm">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" name="eModalTitle"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
         <div class="form-group">
              <label>Quantity:</label>
              <div class="row">
                  <div class="col">
                      <select class="form-control" id="qtSelect">
                        <option>Set to</option>
                        <option>Add</option>
                        <option>Subtract</option>
                      </select>
                  </div>
                  <div class="col" id= "qtD">
                      <input type="text" class="form-control" id="qt" name="quantityTB" placeholder="Quantity">
                  </div>
              </div>
          </div>
        <div class="form-group" id="prD">
          <label>Price:</label>
          <input type="text" class="form-control" id="pr" name="priceTB" placeholder="Enter new price here...">
        </div>
        <div class="form-group">
              <label>Notes:</label>
              <div class="row">
                  <div class="col">
                      <select class="form-control" id="ntSelect">
                        <option>Set notes to:</option>
                        <option>Add to notes:</option>
                      </select>
                  </div>
                  <div class="col">
                      <input type="text" class="form-control" id="ntInput" name="notesTB"placeholder="Enter notes here...">
                  </div>
              </div>
          </div>
          <div class="form-group">
          <label>Location:</label>
          <input type="text" class="form-control" id="loc" name="locationTB" placeholder="Enter new location here...">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="submit" id="eSvBtn" class="btn btn-primary">Save changes</button>
      </div>
    </form>
    </div>
  </div>
</div>
</div>

Form data here

编辑 1:为模态添加了完整的 html。

【问题讨论】:

  • 请提供完整代码和发布操作(jquery 表单提交或按钮)
  • 您是否尝试过使用只读输入而不是 h5?
  • 或者您可以将 id 添加到标签
    中,其中包含您要提交的标题,并在提交之前使用 jQuery 获取它,例如: var titleToSubmit = $('#h5_id').attr("姓名”);或者,如果您需要不使用唯一 ID 使其更通用,您可以为
    并使用以下方法获取名称属性: var titleToSubmit = $('.h5_class_of_choice').attr("name");
  • 我没有尝试使用只读输入,使用它有什么好处?还有西格玛,我如何将不格式的数据提交到服务器?
  • 和 Sigma,我如何将不在表单中的数据提交到服务器?您有一个提交按钮,在这种情况下,当您使用表单操作单击提交按钮时,您将向操作页面提交
    内的所有数据

标签: html twitter-bootstrap bootstrap-4


【解决方案1】:
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModal" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form action="/editItem" method="post" id ="editModalForm">

            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" name="eModalTitle"></h5>
                        <!-- hidden value for modal title to post -->
                        <input type="hidden" id="Modal_title_to_post" name="Modal_title_to_post" value="eModalTitle">
                        <!-- hidden value for modal title to post -->
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body">
                    <div class="form-group">
                        <label>Quantity:</label>
                        <div class="row">
                            <div class="col">
                                <select class="form-control" id="qtSelect">
                                    <option>Set to</option>
                                    <option>Add</option>
                                    <option>Subtract</option>
                                </select>
                            </div>
                            <div class="col" id= "qtD">
                                <input type="text" class="form-control" id="qt" name="quantityTB" placeholder="Quantity">
                            </div>
                        </div>
                    </div>

                    <div class="form-group" id="prD">
                        <label>Price:</label>
                        <input type="text" class="form-control" id="pr" name="priceTB" placeholder="Enter new price here...">
                    </div>

                    <div class="form-group">
                        <label>Notes:</label>
                        <div class="row">
                            <div class="col">
                                <select class="form-control" id="ntSelect">
                                <option>Set notes to:</option>
                                <option>Add to notes:</option>
                                </select>
                            </div>
                            <div class="col">
                                <input type="text" class="form-control" id="ntInput" name="notesTB"placeholder="Enter notes here...">
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label>Location:</label>
                        <input type="text" class="form-control" id="loc" name="locationTB" placeholder="Enter new location here...">
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" id="eSvBtn" class="btn btn-primary">Save changes</button>
                </div>
            </div>

        </form>
    </div>
</div>

更新了模态标题隐藏值的代码:)

【讨论】:

  • 不幸的是,即使使用此更新的 html,标题仍未提交。顺便说一句,非常感谢您花时间帮助我。
  • FredF,提交按钮仅发布 标签中包含的所有数据,而不是段落或跨度或在您的情况下为 h5 标签,如果您想提交与 不同的其他数据,您必须使用 jQuery 获取这些数据并将数据作为 + 参数添加到提交
  • 谢谢你的解释!我终于让它工作了。
  • 不客气,更新后的代码也贴出标题,检查一下
猜你喜欢
  • 1970-01-01
  • 2016-03-11
  • 1970-01-01
  • 1970-01-01
  • 2018-06-13
  • 1970-01-01
  • 2017-09-06
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多