2010-09-25 53 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>