根据所选值传递隐藏输入

Question

我正在尝试使用表单将几个隐藏值传递给 Servlet。问题是我只想在用户选择特定选项时传递它们。

<!-- FORM ABOVE -->

<input type="hidden" name="foo" id="foo" value="foo">
<input type="hidden" name="boo" id="boo" value="boo">

<fieldset id="selectProductSet">
  <div class="productListing">
    <input type="hidden" id="search" name="search" value="shoppingFor">
    <ul class="productList">
      <li data-value="A" onclick="boo();">product A</li>
      <li data-value="B" onclick="boo();">product B</li>
      <li data-value="C" onclick="boo();">product C</li>
    </ul>
    </input>
  </div>
</fieldset>

<!-- FORM BELOW -->

只有当用户在进行特定选择时提交表单时，我才可以传递这些值吗？

Answer 1

您可以在 boo 函数中放置代码，使 sets/removes 来自这些输入的 disabled 属性（如果它们被禁用，它们将不会与表单一起提交）。这是一个输入可见的示例和相应的 foo 函数（在 Product B 上）：

function boo() {
  document.getElementById('foo').setAttribute('disabled', '');
  document.getElementById('boo').removeAttribute('disabled');
}

function foo() {
  document.getElementById('boo').setAttribute('disabled', '');
  document.getElementById('foo').removeAttribute('disabled');
}

<input name="foo" id="foo" value="foo">
<input name="boo" id="boo" value="boo">

<fieldset id="selectProductSet">
  <div class="productListing">
    <input type="hidden" id="search" name="search" value="shoppingFor">
    <ul class="productList">
      <li data-value="A" onclick="boo();">product A</li>
      <li data-value="B" onclick="foo();">product B</li>
      <li data-value="C" onclick="boo();">product C</li>
    </ul>
    </input>
  </div>
</fieldset>

根据所选值传递隐藏输入

Passing hidden input based on selected value

html

javascript

forms

servlets

hidden-field