0

だから私はdjangoを使用しており、次のようなページ/テンプレートを持っています(関連部分のみに簡略化されています)

<select id="printerSelect" name="printer_id">
<option>Select Printer</option>                             
<option>printer1</option>                           
<option>printer2</option>                           
</select>

そして後で私は次のようなものを持っています

<div id="printerInfo">
No printer Selected
</div>

したがって、printerSelect リストは、mongodb データベースにクエリを実行し、プリンター名を見つけて、django テンプレート/コンテキストなどを介してページの読み込み時に動的にリストに配置することによって設定されます。ユーザーがそのリストのオプションをいつ選択したかを知り、printerInfo div の内容を変更することは可能ですか?

それが役立つ場合、私はjqueryも知っています。主な質問は次のとおりだと思います。

  1. ユーザーがリスト内の選択をいつ変更したかを知る方法 (おそらく、バインドされた jquery リスナーで実行できますか?)
  2. 選択したオプションに基づいてデータベースに追加情報を照会する方法

編集

そこで、Sushanth が提案したことを使用して、これを行うハックな方法を実際に思いつきました。基本的に、django テンプレートでは、データベースから要求され、最終的に printerInfo に入る追加情報を保持する一連の div を作成します。

次に、jquery を使用すると、「printer1」、「printer2」をその情報へのマップ キーとして使用して、その情報を変数に保存する関数を作成できます。次に、これらの div を削除します。これはすべて、ページがロードされたときに正しく行われるため、ユーザーには何も表示されません。

次に、アイテムが選択されるたびに、選択テキストを、printerInfo div に入る値/テキストを含むマップへのキーとして使用します。次に、テキストフィールドを何にでも変更するだけの簡単な問題です

4

1 に答える 1

2

.change()イベントを使用して最初の要件を取得できます

$('#printerSelect').on('change' , function() {
     // Code here
     var $this = $(this);
    var text = "No Printer Selected";
    if($this.find('option:selected').index() !== 0){
        text = $this.find('option:selected').text() + ' Selected';
    }     
    $('#printerInfo').html(text);
}).change();​​​​

デモを確認

サーバーからデータを取得する場合は、特定のオプションの AJAX 要求を送信します。

于 2012-11-20T00:10:45.557 に答える