向JSP页面添加新内容,而不会丢失现有的动态生成内容

时间:2013-11-08 02:59:01

标签: html jsp

我正在开发一个基本的Web应用程序,在我的first.jsp文件中添加一些输入数据后,数据通过servlet(比如AnalyzeServlet.java)处理,结果数据显示在results.jsp中。以下是我在results.jsp文件中显示输出的方法:

    <c:when test="${userChoice == 'student'}">
    <table border="1" width=100%>
    <th> STUDENT NUMBER</th>
    <th> STUDENT NAME</th>
    <th> STUDENT ADDRESS </th>
    <c:forEach items="${results}" var="result">
        <tr>
            <td>${result.number}</td>
            <td>${result.name}</td>
            <td>${result.address}</td>
         </tr>
    </c:forEach>
   </table>
  </c:when>

下面是输入输入的文本框,点击“提交”可以获得更多内容。

     <div id="resultPageForm1">
<form name="BForm1" action="NewServlet" method="POST">
    <input type="hidden" name="bChoice" value="grades">
    <h3> Paste name of a student in the text box and click on Submit to get grades</h3>
    <input type="text" name="input">
    <input type="submit" class="button" value="GET GRADES">
</form>
</div>
<h3>Grades are displayed below</h3>
<p>${Output1}</p>

我向用户提供了一个选项,可以将学生姓名从上面的输出输入到文本框中,点击提交后,本学期的成绩应显示在文本框中(即div)。但是,关键是现有的输出(即学号,地址,名称列表)应该仍然可见。但是,目前,成绩正在显示,上面的数据正在丢失,我必须按浏览器上的后退箭头才能检索此数据。所以我的问题是如何更新当前页面已经有一些动态生成的内容而不会丢失它?

1 个答案:

答案 0 :(得分:2)

有几种方法可以实现这一目标。

  1. 一种方法是使用AJAX。 AJAX是一种从服务器检索数据而无需重新加载网页的技术。因此,您将拥有包含表单和结果部分的单个页面。表单提交按钮将向您的servlet提交AJAX调用以检索结果。然后,您将使用JavaScript动态更新页面的结果部分。鉴于你现在拥有的,这将是一个重大的变化。另外,你不了解AJAX和Javascript,这对你来说很难。

  2. 可能更适合您所拥有的方法(表单JSP,结果JSP和servlet)将使用HTML框架。这是一种较旧的技术,可能在视觉上不那么令人愉悦,但它应该完成工作。这是一个非常快速的概述:

  3. a)创建一个框架集作为主页面。在页面上将提交表格。一帧用于显示结果:

    <frameset rows="50%,50%">
        <frame  name="resultsFrame">
        <frame src="f2.html" name="formFrame">
    </frameset>
    

    b)在您的formFrame中,填写您的表单。将目标属性设置为指向resultsFrame:

    <form name="BForm1" action="NewServlet" method="POST" target="resultsFrame">
        <input type="hidden" name="bChoice" value="grades">
        <h3> Paste name of a student in the text box and click on Submit to get grades</h3>
        <input type="text" name="input">
        <input type="submit" class="button" value="GET GRADES">
    </form>
    

    提交表单时,结果将显示在另一个框架中。