1

2 番目のドロップダウン ボックスで使用できるオプションを自動的に制限するスマート フォームを作成しようとしています。

背景: 発券システムを作成しています。ユーザーが [サイトの選択] ドロップダウンからサイトを選択すると、[ユーザーの選択] ドロップダウンには、最初のドロップダウンで選択したサイトにリンクされたユーザーのみが含まれるようになります。 、MySQL から入力されたすべての情報。

将来: そのユーザーに関連付けられているすべてのサービスを、[影響を受けるサービスの選択] の下にあるチェック ボックスで一覧表示したいと考えています。

私のjsはかなり貧弱です。これまでのところ、ここで検索して、ユーザーのコンピューター ID をテキスト フィールドに書き込むことができるコードを見つけることができました。しかし、コンピューター名 (別のテーブル) の出力とクエリを取得し、それをチェック ボックス オプションとして表示する方法や、同じ方法を使用して次の選択ボックスのロットを制限する方法がわかりません。以下にリストされているすべてのコードは、まだクレンジングしていません。アルファ段階です。

PHP のみを使用して段階的にこれを行うことができることを認識していますが、あちこちでコーディングをきれいにしようとしています。

ドロップダウンの表示:

    <h3>Assign Site</h3> 

    <select id="site_add" name="site_add" style="width:217px; height:20px !important;">
        <option value="-1"></option>';

  $o = "SELECT * FROM company_sites WHERE company_id = " . $company_id . " ORDER BY sitename";
$rs = mysql_query($o);
$nr = mysql_num_rows($rs);
for ($i=0; $i<$nr; $i++) {
$r = mysql_fetch_array($rs);
        echo '<option value="' . $r['id'] . '">' . $r['sitename'] . '</option>';
    }

    <h3>Assign User</h3> 
    <select id="comp_add" name="comp_add_1" style="width:217px; height:20px !important;">
        <option value=""></option>';

  $o = "SELECT * FROM company_staff WHERE company_id = " . $company_id . " ORDER BY id DESC";
$rs = mysql_query($o);
$nr = mysql_num_rows($rs);
for ($i=0; $i<$nr; $i++) {
$r = mysql_fetch_array($rs);

    $user_computer_id = $r['computer_id'];

        echo '<option value="' . $r['id'] . '">' . $r['firstname'] . ' ' . $r['lastname'] . '</option>';
    }

選択したユーザーのコンピューター ID をテキスト フィールドに出力する現在の JS:

<script type="text/javascript"> 
window.onload=function() { attachBehaviors(); }; 
// 
function attachBehaviors() { 
 document.getElementById(\'person\').onchange=function() { 
 loadUser(this.options[this.selectedIndex].value); // <-- check this, may be incorrect 
 } 
} 
function loadUser(optionvalue) { 
 // Always set a default 
 if (optionvalue==\'\') {  
 return; 
 }
 opts = optionvalue.split(\':\'); 
 var name = opts[0]; 
 var email = opts[1]; 
 document.getElementById(\'computer_id\').value=name; 
} 

</script> 

<select name="person" id="person"> 
    <option value=""></option>';


$result=mysql_query("SELECT * FROM company_staff"); 
while($row=mysql_fetch_array($result)) { 

$submit_firstname = $row['firstname']; 
$submit_lastname = $row['lastname']; 
$submit_staff_id = $row['id']; 
$submit_computer_id = $row['computer_id']; 


 echo '<option value="' . $submit_staff_id . '">' . $submit_firstname . ' ' . $submit_lastname . '</option>\n'; 
} 
echo '
</select> 
<input type="text" id="computer_id" name="name" placeholder="name" /> 
';

これを達成する方法についての推奨事項は大歓迎です!

前もって感謝します！

4

1 に答える 1

1

AJAX が必要です。これは PHP と JS の組み合わせです。(サーバーからの JavaScript 要求データ、php は要求を処理し、データを返します)。

この選択ボックスの作成方法を理解するには、AJAX を少し練習する必要があります。

これは理論上のプロセスです。

  1. 最初の選択ボックスを PHP で出力します。

  2. サーバーを呼び出して情報を取得する onchange イベント ハンドラを作成します。

    ..オプション..

  3. この updateNewDropDown 関数は、選択したサーバー応答から値を取得し、PHP を介して 2 番目の選択メニュー用に新しいデータを取得し、提供された AJAX 応答のデータを使用して新しい選択メニューを作成します。

AJAX チュートリアル:

http://api.jquery.com/jQuery.ajax/ http://www.w3schools.com/ajax/default.asp

于 2012-10-02T02:07:39.557 に答える