0

first.jsp ファイルにいくつかの入力データを追加した後、データがサーブレット (AnalyzeServlet.java など) を介して処理され、結果のデータが results.jsp に表示される基本的な Web アプリケーションを開発しています。ここでは、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) に表示されます。ただし、重要なのは、既存の出力 (つまり、学生番号、住所、名前のリスト) が引き続き表示されることです。ただし、現在、成績が表示されており、上記のデータが失われているため、ブラウザの戻る矢印を押してこのデータを取得する必要があります。私の質問は、動的に生成されたコンテンツが既にある現在のページを失うことなく更新するにはどうすればよいですか?

4

1 に答える 1

2

これを行うにはいくつかの方法があります。

  1. 1 つのアプローチは、AJAX を使用することです。AJAX は、Web ページをリロードせずにサーバーからデータを取得する技術です。したがって、フォームと結果セクションの両方を含む 1 つのページが作成されます。フォーム送信ボタンは、AJAX 呼び出しをサーブレットに送信して結果を取得します。次に、JavaScript を使用して、ページの結果セクションを動的に更新します。あなたが今持っているものを考えると、これは大きな変化になるでしょう。さらに、AJAX と Javascript を知らないので、これは難しいでしょう。

  2. あなたが持っているもの (フォーム JSP、結果 JSP、およびサーブレット) により適したアプローチは、HTML フレームを使用することです。これは古い手法であり、見た目には少し劣るかもしれませんが、仕事は完了するはずです。ここに非常に簡単な概要があります:

a) メイン ページとしてフレーム セットを作成します。フォームを送信するためのページになります。1 つのフレームは結果を表示するためのものです。

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

b) formFrame にフォームを配置します。resultsFrame を指すようにtarget属性を設定します。

<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>

フォームを送信すると、結果が別のフレームに表示されます。

于 2013-11-08T03:48:17.783 に答える