I asked a question regarding this problem about a few hours back and have noticed that this still isn't working correctly.
What I need is to show a textbox to the user if they select a two of the three choices. When the user clicks the submit button the dropdown needs to maintain the value chosen. I can do this with my application code but where the javascript fails is that the hidden div, even though it has a value that is dependent on the textbox being shown, will no longer show. It's because of the pager refresh.
Here is my code. Can someone please tell me what I need to change so that the textbox will reappear after a refresh IF a value other than "NONE" is selected?
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>
Just add the script call to ensure toggle gets called when the pages loads to initialize the divs visibility.
<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>
精彩评论