5

2つのドロップダウンリストを含む小さなPHPページがあります

最初のドロップダウンリストで選択した結果に従って、2番目のものを入力する必要があります....これは可能ですか？つまり、最初のドロップダウンリストから選択した値を使用し、2番目のドロップダウンリストに入力するために使用するdBクエリで使用する必要があります（ただし、これは最初のドロップダウンリストを選択したときに入力する必要があります。

これが可能であれば、何かヒントをお願いします。（dBから最初のドロップダウンリストにデータを入力できると想定できます）

ありがとう

4

5 に答える 5

2

オプション1：2番目の選択のデータを非表示要素またはJSオブジェクトとしてドキュメントに埋め込みます。最初の選択のchangeイベントハンドラーは、2番目の選択にデータを入力します。List Apartには、動的選択ページの例があります。

オプション2：AJAXを使用します。最初の選択が変更されたら、2番目の選択の内容をサーバーに要求し、それを入力します。JSライブラリ（jQueryなど）を使用すると、これは非常に簡単になります。

$('select#one').change(
  function (evt) {
    $('select#two').load('/thing/'+this.value);
  }
);

「/thing/ <val>」はサーバー側スクリプトを識別し、「<val>」に基づいてアイテムのリストを生成します（Webサーバーの書き換え機能を使用してURLパスを実際のスクリプトに解決します）。常に<option>要素を生成するようにすることもできますが、結果の形式を指定する方法を含めると、JSONまたはその他の形式を使用してリストを<li>として出力できるようになります。

$('select#one').change(
  function (evt) {
    $('select#two').load('/thing/'+this.value, {fmt: 'option'});
  }
);
于 2010-04-09T22:19:25.880 に答える
1

最初のドロップダウンの選択をサーバーに送信するには、AJAXを使用する必要があります。次に、データベースにクエリを実行し、2番目のドロップダウンを生成して、ユーザーに送り返すことができます。

于 2010-04-09T22:13:54.647 に答える
0

ページをリロードせずに、サーバーへの非同期コールバックが必要になります。（サーバーにポストバックするボタンが実際に必要かどうかは疑問です）したがって、AJAXはまさにそれを実行できるものです。最初のドロップダウンのイベント ハンドラーに AJAX 呼び出しを追加してonchange、選択内容をサーバーにポストし、2 番目のドロップダウンのコンテンツを返します。AJAX 呼び出しが新しい値を返したら、それを使用して 2 番目のドロップダウンのコンテンツを作成します。もちろん、これのほとんどは Javascript で行われますが、実際のサーバー部分は PHP に残ります。

于 2010-04-09T22:25:54.840 に答える
0

それには2つの方法があります。古い学校の「オプションを選択し、ページを再構築するために送信する」メソッドと、ページを更新せずに2番目のドロップダウンのコンテンツをロードするための新しいAJAXメソッド。

どちらにも一長一短がありますので、目的に合わせて最適なものを選んでください。古い学校の方法では、JavaScript はまったく必要ありませんが、サーバーを介してフォームを往復するため、「ウィンドウをクリアしてからページを再描画する」というちらつきが発生します。

AJAX メソッドはリフレッシュ フリッカーをバイパスしますが、Javascript が無効なブラウザーでも機能しません。AJAX 呼び出しとドロップダウンの入力を処理するには、クライアント側でもう少しコードが必要ですが、サーバー側のコードは両方の方法でほとんど同じです。同じクエリ、同じ取得ループ、異なる出力のみです。メソッド。

于 2010-04-10T02:49:20.720 に答える
0

@outis は.changejquery で使用するのに適しています。それ以外の場合は、コードonchangeでイベントを使用しselectます。

お気に入り

<select id='my_select' onchange='javascript:myfunc()'>
<option value='a'>a</option>
.
.
<option value='z'>z</option>

function myfunc(){
//write code to populate another dropdown based on selected value

}

他のドロップダウン値に基づいて、この動的に入力されるドロップダウンを確認できます

于 2013-12-15T06:32:05.277 に答える