change text fields from JavaScript

Question

Hi

I have a small web page on my embedded device with such code:

<th width="310"
DHCP Relay:&nbsp;&nbsp;
</th>
<td>&nbsp;&nbsp;</td>
<td>
<% nvram_get("rg_dhcp_relay_enable""); %>
</td>

where 'nvram_get' returns either 1 or 0.I have two questions in this connection:

(1) I'd like to print "ON" or "OFF" instead of 1 or 0 respectively. Is it possible to do in <%...%> something like "if .. then .." or there is another way?

(2) This code works fine whenever I reload page. Also on this page I have select list, and I'd like the above text to be changed accordingly to item selected from list.

So I decided to write a JavaScript function and hook it on 'onChange' event. Sounds reasonable? I only don't know how to modify the text within .. from JS function.

Anyh ideas? Thanks!

Answer 1

1: It should be possible but you don't say what language, so I can't tell you the syntax to use. For Java (JSPs), it would be:

<% if(nvram_get("rg_dhcp_relay_enable") == 1) {%>ON<%}else{%>OFF<%}%>

2: Again not much information to help you. Your approach sounds reasonable, depending on how the page works. Some of them submit the form when you select a new value from a list.

Answer 2

1) Adding to Aaron Digulla's answer, If you use Java, it is better if you move the Java code to your servlet and store the result of the method call in an attribute. Then you could do like this in JSP using JSTL core 'out' tag,

<td> 
  <c:out value="${relayEnable == 1 ? 'ON' : 'OFF'}"> 
</td>

Here the 'relayEnable' is the name of the attribute which holds the result of the method call.

2) If you want to change the content of this 'td' when a select element is changed, you could use the 'onchange' event for the select and inside the event handler, you could set the innerHTML of the TD (referred by an id).

<table>
<tr>
  <td id="relayIndicator">
    <c:out value="${relayEnable == 1 ? 'ON' : 'OFF'}"> 
  </td>
</tr>
</table>

<select onchange="changeRelayIndicatorText(this.options[this.selectedIndex].value)">
    <option value="1">One<option>
    <option value="2">Two</option>
</select>

<script type="text/javascript">
  function changeRelayIndicatorText(value) {
    document.getElementById('relayIndicator').innerHTML = (value == 1) ? 'ON' : 'OFF';
  }
</script>