0

フォームに複数の行があります。基本的に、各行に 2 つのドロップダウン ボックスがあります。2 番目のドロップダウン ボックスの値は、最初のドロップダウン ボックスでの選択に基づいて更新されます。一度に個々の行にJavaScriptを適用するにはどうすればよいですか? 2 行目の最初のドロップダウン ボックスを変更すると、2 行目でのみ 2 番目のドロップダウンを更新したいとします。また、配列を使用して複数の行データを同じデータベースに更新するにはどうすればよいですか。これが私のコードです：

<form action='purchase.php' method="POST"> 
<table><tr><td>Supplier</td><td>Item Name</td></tr>
<tr><td><select name ="supplier" id = "supplier" onchange = "updatesup()">
<option value = "1"> SUPA </option><option value = '2'>SUPB</option></select> </td>
<td> <Select name ="itemname" id="itemname"><option value = ""> Select Item</option></select>/td></tr>
<tr><td><select name ="supplier" id = "supplier" onchange = "updatesup()">
<option value = "1"> SUPA </option><option value = '2'>SUPB</option></select> </td>
<td> <Select name ="itemname" id="itemname"><option value = ""> Select Item</option></select>/td></tr></table></form>

サプライヤを選択する際に..itemname ドロップダウン リストのアイテムを変更したい..しかし、それぞれのドロップダウン リストだけを変更したい...どうすればよいですか?

これは私が使用しているjavascriptです

array iteam_a;
item_a[0] = [1, item1, 1];
item_a[1] = [2, item2, 1];
item_a[2] = [3, item2, 1];
item_a[3] = [4, item4, 2];
item_a[4] = [5, item5, 2];
item_a[5] = [6, item6, 2];
function updatesup(){
    removeAllOptions(document.getElementById('itemname'));
    addOption(document.getElementById('itemname'), "", "Select Item");

    for (var i = 0; i <= item_a.length-1; i++){
        if (item_a[i][2] === document.getElementById('supplier').value){
                addOption(document.getElementById('itemname'), item_a[i][0], item_a[i][1]);
            }
     }   

 }

function addOption(selectbox, value, text ){
    var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;

selectbox.options.add(optn);
 }               

function removeAllOptions(selectbox)
{
var j;
for(j=selectbox.options.length-1;j>=0;j--)
{
    selectbox.remove(j);
}
   }
4

2 に答える 2

1

ノックアウト.jsを見てください

Javascript で MVVM モデルを構築でき、必要なものを簡単に実現できます。サイトにはたくさんの例があります。Channel 9では、Steve Sanderson による knockout.js の素晴らしいプレゼンテーションがあります。

于 2012-09-04T17:39:18.793 に答える
0

updatesetup メソッドの署名を変更できます。

次のような、その行から各要素のインデックスを受け取る必要がある mainindex と subindex の 2 つのパラメーターを定義します。

function updatesup(mainindex, subindex){
    removeAllOptions(document.getElementById('itemname_' + subindex));
    addOption(document.getElementById('itemname_' + subindex), "", "Select Item");

    for (var i = 0; i <= item_a.length-1; i++){
        if (item_a[i][2] === document.getElementById('suplier_' + subindex).value){
                addOption(document.getElementById('itemname_' + subindex), item_a[i][0], item_a[i][1]);
        }
 }

検索するIDを変更したことに注意してください...したがって、yout htmlでは、インデックスシーケンスを使用してth行を構築しました

<form action='purchase.php' method="POST"> 
<table><tr><td>Supplier</td><td>Item Name</td></tr>
<tr><td><select name ="supplier_0" id = "supplier_0" onchange = "updatesup()">
<option value = "1"> SUPA </option><option value = '2'>SUPB</option></select> </td>
<td> <Select name ="itemname_0" id="itemname_0"><option value = ""> Select Item</option>        </select>/td></tr>
<tr><td><select name ="supplier_1" id = "supplier_1" onchange = "updatesup()">
<option value = "1"> SUPA </option><option value = '2'>SUPB</option></select> </td>
<td> <Select name ="itemname_1" id="itemname_1"><option value = ""> Select Item</option>        </select>/td></tr></table></form>
于 2012-09-04T17:47:13.023 に答える