2010-09-25 54 views
0

我問了幾個小時後關於這個問題的問題,並且注意到這仍然不能正常工作。Javascript sticky dependent dropdown

我需要的是顯示一個文本框給用戶,如果他們選擇三個選擇中的兩個。當用戶點擊提交按鈕時,下拉菜單需要保持所選的值。我可以用我的應用程序代碼來做到這一點,但是JavaScript失敗的地方在於隱藏的div,即使它具有取決於顯示的文本框的值,也不會再顯示。這是因爲尋呼機刷新。

這是我的代碼。有人可以告訴我需要更改什麼,以便在刷新後文本框會重新出現如果選擇「NONE」以外的其他值?

function toggleTbox(chosen) 
{ 
    var hide = document.getElementById("otherValues"); 
    if (chosen == 'PHASE1') { 
     hide.style.display = 'block'; 
    } else if(chosen == 'PHASE2') { 
     hide.style.display = 'block'; 
    } else { 
     hide.style.display = 'none'; 
    } 
} 

<tr> 
    <td> 
    <label for="sales">Sales:</label><br /> 
    <select name="sales" onchange="toggleTbox(document.salesEntry.salesEntry.options[ document.salesEntry.rxGateway.selectedIndex ].value);"> 
    <option value="[server]">[server]</option> 
    <option value="NONE">NONE</option> 
    <option value="PHASE1">PHASE1</option> 
    <option value="PHASE2">PHASE2</option> 
    </select> 
    </td> 
    <td> 
    <div id="otherValues" style="display:none"> 
     <label for="salesNumber">Sales No</label><br /> 
     <input type="text" name="salesNumber" id="salesNumber" value="[server]" /> 
    </div> 
    </td> 
</tr> 

回答

1

只需添加腳本調用,以確保切換被調用時,頁面加載初始化div的可見性。

<tr> 
    <td> 
    <label for="sales">Sales:</label><br /> 
    <select name="sales" onchange="toggleTbox(document.salesEntry.salesEntry.options[ document.salesEntry.rxGateway.selectedIndex ].value);"> 
    <option value="[server]">[server]</option> 
    <option value="NONE">NONE</option> 
    <option value="PHASE1">PHASE1</option> 
    <option value="PHASE2">PHASE2</option> 
    </select> 
    </td> 
    <td> 
    <div id="otherValues" style="display:none"> 
     <label for="salesNumber">Sales No</label><br /> 
     <input type="text" name="salesNumber" id="salesNumber" value="[server]" /> 
    </div> 
    <script type="text/javascript"> 
     toggleTbox(document.salesEntry.salesEntry.options[document.salesEntry.rxGateway.selectedIndex ].value); 
    </script> 
    </td> 
</tr>