首页 > 解决方案 > 基于使用嵌套表单单击的按钮将输入字符串传递给不同的jsp页面

问题描述

我正在尝试trackingNo根据按下的按钮传递给 jsp 页面。我创建了 2 个按钮addnewsearch. addnew应该从输入字段获取输入并将其trackingNo传递给 tracking.jsp,如果它被按下,搜索应该trackingNo从输入字段获取输入并将其传递给 home_student_result.jsp。

我不确定正确的方法是什么,所以我尝试使用嵌套表单,其中一种形式为“add”id,另一种形式为“srch”id。运行后,只有最上面的表格有效。内部形式不起作用。任何人都可以帮助我,或者建议一个更好的方法吗?

 <div>
    <form id="add" method="post" action="tracking.jsp">
        <i class="fas fa-search"></i>
        <form id="srch" method="post" action="home_student_result.jsp">
            <input name="target" type="input" placeholder = "Search..." class = "text_search"/>
        </form>
    </form>
</div>
<button class="button_search" onclick="document.getElementById('add').submit()">
        Add New
</button>
<button class="button_search" onclick = "document.getElementById('srch').submit();">
    Search
</button>

标签: javajsp

解决方案


您只能使用一个form并单击按钮,您可以action根据按钮单击将值更改为特定值,然后提交您的form.

演示代码

function submit(value) {
  console.log(value)
  //if value is add
  if (value == "add") {
    //change action of form
    document.getElementById('forms').action = 'tracking.jsp'
    document.getElementById('forms').submit(); //submit
  } else {
    document.getElementById('forms').action = 'home_student_result.jsp'
    document.getElementById('forms').submit();
  }
}
<div>
<!--add id to form-->
  <form id="forms" method="post" action="tracking.jsp">
    <i class="fas fa-search"></i>

    <input name="target" type="input" placeholder="Search..." class="text_search" />

  </form>
</div>
<!--add function with parameter(value of button) -->
<button class="button_search" value="add" onclick="submit(this.value)">
                Add New
        </button>
<button class="button_search" value="srch" onclick="submit(this.value)">
            Search
        </button>


推荐阅读