2009-08-29 5 views
2

私は週(日曜日から土曜日)のスケジュールを表示するスケジュールページを持っています。ダイアルポップアップメニューを作成する最良の方法

このスケジュールに従業員を追加する方法は、選択した値に基づいて変更される一連のポップアップメニューを使用して行います。

たとえば、最初のメニューは、<option>というジョブの値がjobsテーブルから伝播されたジョブです。

ここで、ユーザーがジョブポップアップメニューで「Cook」を選択したとします。次のメニュー「従業員」には、求人コードが「cook」に設定されている従業員テーブルのすべての従業員が表示されます。したがって、その日に利用可能なすべての料理を私に見せてください。

このような一連のメニューを作成するにはどうすればよいですか?

質の高いチュートリアルへのリンクがあれば幸いです。

答えて

1

これは、Javascript/AJAXを使用して行うことができます。ユーザーは最初のメニューから1つのオプションを選択し、次のメニューは最初のメニューで選択されたオプションを送信するサーバーへの要求でオプションを自動的に更新します。

これは、ブラウザのさまざまな問題を避けるために、jQueryを使用して次の方法で行うことをお勧めします。これは不完全ですが、起動あなたに大きな頭を与える必要があります:

HTML

<select id='jobs_menu' name='job'> 
    <option>Cook</option> 
    <option>Waiter</option> 
</select> 

<select id='employees_menu' name='employees'> 
    <option>John Doe</option> 
    <option>Doe John</option> 
    <option>Everyone else</option> 
</select> 

Javascriptを/ jQueryの

$(document).ready(function(){ 

    $('#jobs_menu').change (function() { 

     //ajax call 
     $.get('http://yourscript.com/script.php', { job: $('#jobs_menu').val() },  
      function() { 
       //parse the json and fill the #employees_menu with the results 
      }); 
    });  
}); 

PHP

if (isset ($_GET['job'])) 
{ 
    $names = array(); 
    $job = mysql_real_escape_string ($_GET['job']); 
    $res = mysql_query ("SELECT name FROM Employees WHERE job='$job'"); 

    while ($row = mysql_fetch_assoc ($res)) 
    { 
     $names[] = $row['name']; 
    } 

    echo json_encode ($names); 
} 
+0

ありがとうございました!私はそれを試してみましょう。私はそれがどのように動作するかを見て、オプションを記入するためにdocument.myform.selectname.options [0] = new Option()で$ nameをループすることができると思う。 – ian

関連する問題