2

我有一个 JSP 页面，其中有两种形式。

  • 一个是默认的，另一个是隐藏的。
  • 在默认表单上，有一个指向隐藏表单的链接。单击此链接后，会出现隐藏的表单，其中包含一些输入字段和提交按钮。
  • 当我单击提交时，显然表单已提交。

但是当输出出现时，页面被加载并显示默认表单。我想显示隐藏的表格。我应该怎么办？

我的 JSP 页面具有以下代码结构：

<div id="1st_form">

    <form id="defaultForm"  action="/searchModel/search">
       %{-- form input fields--}%

            <div style="float: left; margin-left: 15px;">
                <a href="javascript:advancedSearch();" style="color: #ffffff; font-size: 13px;">Advanced Search</a>
            </div>


    </form>
</div>

<div id="2nd_form" hidden="hidden">

    <form id="hiddenForm"  action="/searchModel/search">
       %{-- form input fields--}%
            <input type="submit" id="searchButton" value="Advanced Search" >

            <div style="float: left; margin-left: 15px;">
                <a href="javascript:normalSearch();" style="color: #ffffff; font-size: 13px;">Advanced Search</a>
            </div>


    </form>
</div>

和javascript函数如下：

function advancedSearch(){
        $("#1st_form").hide();
        $("#2nd_form").show();

    }

    function normalSearch(){
        $("#2nd_form").hide();
        $("#1st_form").show();

    }
4

1 回答 1

1

问题是，当您向客户端发送任何 HTML 页面时，您之前使用 Javascript 所做的所有更改都将丢失。这就是为什么您在提交后再次看到默认表单的原因。

你想做的是：

单击“高级搜索”按钮时，显示“高级搜索”表单并将“默认”表单隐藏在响应中。

您需要在服务器端做什么，因为客户端不知道哪个按钮将表单提交到服务器。

因此，您需要检查表单是否由服务器端的“高级搜索”按钮提交。为此，您需要为按钮命名：

<input type="submit" id="searchButton" 
       name="searchButton" value="Advanced Search" >

现在，当单击此按钮时，它的值将被发送到服务器。在这种情况下，Advanced Search。

接下来，您需要检查此值是否已在您的 JSP 中发送到服务器：

<div id="1st_form" ${param.searchButton == 'Advanced Search'?'hidden':''} >
    ...
</div>
<div id="2nd_form" ${param.searchButton == 'Advanced Search'?'':'hidden'} >
    ...
</div>

注意：param是Expression Language 中的隐式对象。

这样，当您第一次打开页面时，该页面param.searchButton将为空并显示默认搜索。当“高级搜索”按钮被提交时，param.searchButton将会Advanced Search显示高级搜索。

于 2013-09-11T07:31:10.180 回答