2

バックグラウンド

私は、javascriptを排他的に使用して最大5,000エントリ（サプライヤ）を検索し、それらから選択したドロップダウン（工場、最大10,000エントリ）を入力するこのフォームを持っています。現在、これはjavascriptが必要なフォームです。javascriptエラーによってフォームが使用できなくなることがないようにしたいと思いますが、エントリの数とエントリのシーケンシャルな性質により、基本的なhtmlバージョンだけを提供する慣用的な方法がありません。

問題

順次/階層ドロップダウン

シーケンスが重要なドロップダウンの例： http ：//www.javascriptkit.com/javatutors/selectcontent2.shtml

これは、順次/階層ドロップダウンコンテンツの「フィルタリング」を示しています。ここで、2番目のCityドロップダウンの選択は、最初のCountryドロップダウンの選択に基づいてフィルタリングされます。しかし、JavaScriptを削除すると、すぐに混乱する可能性があります。アメリカのマドリッド？フランスのベルリン？シーケンスが破損します。

膨大な数のオプションがあるドロップダウン

10kの可能なオプションを含む選択ドロップダウンがある場合、javascriptを使用してそれらをフィルタリング/検索するのは非常に簡単です。一方、javacriptを使用せずにこれらのオプションを処理することは、はるかに困難です。

すべてのオプションをロードするだけでブラウザが爆発する場合、どのようにしてすべての可能性をユーザーに提供しますか？

可能な解決策

順次/階層選択ボックス：

  • サーバー側の2部構成のフォーム。
  • ？オプショングループを選択しますか？
  • ???

膨大な数のオプションで選択：

  • サーバー側の2部構成の検索フォーム。
  • エントリ名のサーバー側テキスト検索マッチング。
  • ???

機知に富んだソリューションへの簡単なリンクを歓迎します。

4

1 に答える 1

0

私が考えることができる唯一の解決策は、結果を絞り込む必要があるたびにフォーム送信を使用することです。まず、サプライヤーの国を選択するページを表示します。これにより、選択した国がテキストとして表示され、都市などの次のフィールドを選択するためのドロップダウンが表示されたページが送信されて返されます。このようにして、サーバーは各レベルでフィルタリングを実行できます。

以下にJSPの例を示します。

<c:choose>
    <c:when test="${empty country}">
        Country: 
        <form>
            <select>
                <option value="USA">America</option>
                <option value="DEU">Germany</option>
                <%-- ... --%>
            </select>
        </form>
    </c:when>
    <c:otherwise>
        Country: ${country} 
        <c:choose>
            <c:when test="${empty city}">
                <input type="submit" value="Change" />   <%-- Button to change the previous value --%>

                <%-- your form for choosing a supplier's city --%>                    
            </c:when>
            <c:otherwise>
                <%-- continue filtering until you have all of the data --%>
            </c:otherwise>
        </c:choose>

    </c:otherwise>
<c:choose>

国を選択すると、フォームが送信されます。サーバーは国を処理し、countryフィールド値と次のドロップダウンに使用できる都市のリストを含む同じページを返します。このようにすると、（JavaScriptではなく）フォームの送信のみに依存してデータを順番にフィルタリングできます。サーバーは、ユーザーの距離を追跡する責任があります。このソリューションの明らかな欠点は、すべてのネストされた<c:choose>ブロックを使用すると、JSPがかなり乱雑になることです。

ハイブリッドソリューションを試すこともできます。ページが読み込まれたときに、JavaScriptが読み込まれたかどうかを確認します。その場合は、送信フォームを、背後にAJAXがあるプレーンHTMLに置き換えて、次のオプションセットを入力します。そうすれば、JavaScriptが更新するときにページを更新する必要がありません。ロードしますが、JavaScriptがロードされない場合でも機能します。ちょっとした考え。

于 2010-12-29T19:18:10.717 に答える