2012-04-17 78 views
0

ユーザーがドロップダウンリストから選択した値を選択した後で表を表示する必要があります。私はコーディングの例をインターネットで検索しようとしましたが、何も見つかりませんでした。ドロップダウンリスト(HTML)から選択した値を選択した後の表を表示

<select name="ddlEqu" size="1" tabindex="1" onchange="select(this.value)" id="Equddl_source"> 
    <option selected value="select"><--Select--></option> 
    <option value="D1">T-Shirt</option> 
    <option value="D2">Jacket</option> 
    <option value="D3">Shoes</option> 
</select> 

ユーザーがTシャツを選択すると、Tシャツのリストが表形式で表示されます。このように:

ID | T-Shirt  | Description | Price 
1  | Mickey Mouse | Color = Black | RM 29.90 
2  | Camera Shirt | Color = Pink | RM 32.50 
3  |    |  = White | 

誰かが私を助けることができるあなたができるならば、...

+0

でもデータを取得する必要がありますか? – hjpotter92

答えて

0

はjQueryのを使用してください。その後、データを簡単にプルすることができます。 select(this.value)を実行する必要もなく、 "ItemSelectedEvent"のような関数を作成するだけです。

var id = 0; 

//This uses jquery 
function ItemSelectedEvent 
{ 
     id++; 
    if($(#Equddl_source).val() == "D1") //Might also try for example (.val() == "Jacket") 
    { 
     $(#TableName).append("<tr><td>" + id + " | " + $(#Equddl_source).val() + " | </td></tr>"); 
    } 
} 

これはちょうどあなたが見るかもしれないものの種類を示す非常に醜いと簡単な例です。あなたが欲しいものは、確かにGoogle上にある、ちょうど試し続けます。これはあなたに十分なジャンプスタートを与えるはずです。

0

ページの読み込み時にすべてのテーブルを読み込む必要があります。あなたはIDがtable_D1、table_D2、table_D3のアイテムD1、D2、D3の3つの隠しテーブルがあるとします。テーブルが既にロードされていない場合は、AJAX

$('#Equddl_source').change(function() { 
    $('#table_' + this.value).show();  
}); 
関連する問題