1

NetBeans と mysql を使用して Java で Web アプリケーションを作成しています。データベース「Category」と「SubCat」には 2 つのテーブルがあります。また、データベースからデータを抽出するためのエンティティ クラスとセッション Bean があります。jsp フォームには 2 つのドロップダウン リストがあります。最初のドロップダウン リストでカテゴリを選択すると、そのカテゴリ ID がサーブレットに表示されなくなり、そこから、関連するサブカテゴリのみのリストが 2 番目のドロップダウン リストに表示されます。どうすればそれを手に入れることができますか？

私のJSPコードは次のとおりです

    <form action="<c:url value='submit_site'/>" method="POST">
    <table border="0">
        <tbody>
               <tr>
                <td><label for="cat">Category</label></td>
                <td> 
                    <select name="category">

                        <c:forEach var="cat" items="${categories}">
                            <option name="catId" value="${category.id}">${cat.id}. ${cat.catName}</option>
                        </c:forEach>
                    </select> 
                </td>
            </tr>   
            <tr>
                <td><label for="SuCat">SubCategory</label></td>
                <td>
                    <select name="subcat">
                        <option>Select...</option>
                        <c:forEach var="subcat" items="${subCategories}">
                            <option name="subId" value="${subcat.subId}">${subcat.subCatName}</option>
                        </c:forEach>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="submit" 
                           value="Submit"/>
                </td>
                <td colspan="2">
                    <input type="reset" 
                           value="Reset" />
                </td>

            </tr>
        </tbody>
    </table>

</form>

データベースのすべてのカテゴリが最初のドロップダウン リストに表示されますが、最初のドロップダウン リストからは、選択したカテゴリの ID がサーブレットに入らず、サブカテゴリが 2 番目のドロップダウン リストに表示されません。2 番目のドロップダウンで関連するサブカテゴリを取得するにはどうすればよいですか? 2週間からこれにこだわっています。

Webで検索しましたが、混乱を解決できません。ドロップダウン リスト用の JavaScript がありますが、これらのスクリプトを理解できません。javascript codを使用せずにそれを行うことはできますか?

4

1 に答える 1

1

まあ、私はあなたがjavascriptから逃げることができないと思います:-)。ボタンを使用して完全な送信を行うことができます。2番目のコンボをロードすると、ユーザーは2番目のコンボを選択します。それはかなり奇妙なユーザーエクスペリエンスになります:-)。

問題は2つの方法で解決できます。

  • JavaScriptの全ページ送信
  • AJAX呼び出し

AJAX呼び出しが望ましく、よりユーザーフレンドリーです。完全な送信は実装が簡単ですが、ページがフラッシュされてコンテンツが再読み込みされます。

完全な送信は、コンボボックスでオプションを選択する際の送信を使用して実行できます（ドキュメントにフォームが1つしかない場合）。

<select name="subcat" onchange="document.forms[0].submit()">
  <option>Select...</option>
  <c:forEach var="subcat" items="${subCategories}">
    <option name="subId" value="${subcat.subId}">${subcat.subCatName}</option>
  </c:forEach>
</select>

AJAX呼び出しの場合、XmlHttpObjectを使用して自分で実装できますが、それは車輪の再発明です。jqueryのようなJSフレームワークに固執します。

更新：申し訳ありませんが、間違った順序でリンクを投稿しました。これは、サーブレットでjqueryを使用する例です。基本的には、JSON（またはこのリンクのようにHTML）を使用してサブカテゴリのリスト全体をシリアル化し、javascriptを使用してコンボボックスをリロードするのがクールです。

于 2013-01-14T14:12:36.650 に答える