I want to change written value of JavaScript after I change the value of ComboBox, but it didn't work. Here is my code :
<script>var selGate = "empty"</script>
<SELECT NAME = "cmbGate" STYLE ="width: 600px" SIZE = 15 onchange="chGate()">
<OPTION Value = "opt1">Option 1</OPTION>
<OPTION Value = "opt2">Option 2</OPTION>
</SELECT>
<BR>
<form name="frGate">
Selected Gate is:
<script>document.write(selGate)</script>
</form>
<script>
function chGate()
{
selGate = document.getElementsByName("cmbGate").selectorText;
frGate.submit();
}
</script>
I want to change written value of JavaScript after I change the value of ComboBox, but it didn't work. Here is my code :
<script>var selGate = "empty"</script>
<SELECT NAME = "cmbGate" STYLE ="width: 600px" SIZE = 15 onchange="chGate()">
<OPTION Value = "opt1">Option 1</OPTION>
<OPTION Value = "opt2">Option 2</OPTION>
</SELECT>
<BR>
<form name="frGate">
Selected Gate is:
<script>document.write(selGate)</script>
</form>
<script>
function chGate()
{
selGate = document.getElementsByName("cmbGate").selectorText;
frGate.submit();
}
</script>
Share
Improve this question
edited Jan 21, 2023 at 12:26
Brian Tompsett - 汤莱恩
5,89372 gold badges61 silver badges133 bronze badges
asked Feb 24, 2012 at 4:52
NoreNore
1112 gold badges4 silver badges20 bronze badges
3
-
1
What do you mean by
change the value of javascript
? Can you describe what exactly is NOT working? – gideon Commented Feb 24, 2012 at 4:55 -
'I want to change written value of JavaScript' , the JavaScript variable that written to the document this one :
document.write(selGate)
– Nore Commented Feb 24, 2012 at 4:57 - and it's not changing after all – Nore Commented Feb 24, 2012 at 4:58
2 Answers
Reset to default 3You function would look like this:
function chGate()
{
var e = document.getElementById("cmbGate");//get the bobox
var selGate = e.options[e.selectedIndex].value;//get selected value
//you can also do use ^.text =>to get the text instead
document.getElementById("selected").innerHTML = "Selected Gate is:"+selGate;
//^^ set the text to the selected value
frGate.submit();
}
You html should change like this:
==> Change the select
<SELECT id="cmbGate" STYLE ="width: 600px" SIZE = 15 onchange="chGate()">
// ^^ set the id
==> Change the form
<form name="frGate">
<div id="selected">Selected Gate is:</div>
// ^^ set an id here also so you can update it
</form>
See a working demo: http://jsfiddle/Mr2CF/2/
There are a lot of problems with your code, mostly due to the fact that it's all over the place and half of it isn't bound to any event. What you really want is something like this:
<script type="text/javascript">
var selGate = 'empty';
document.getElementById('cmbGate').onchange = function () {
selGate = this.options[this.selectedIndex].text
document.getElementById('selectedGate').innerHTML = selGate;
}
</script>
<select id="cmbGate" name="cmbGate" style="width: 600px" size="15">
<option value="opt1">Option 1</option>
<option value="opt2">Option 2</option>
</select>
<br>
<form name="frGate" id="frGate">
<p>Selected gate is: <span id="selectedGate"></span></p>
</form>
See this in action here.