Disabling a text field for a particular selection in dropdown box
Question
My application includes a textField and a dropdown box. When i select "All Campaigns" i should have my textfield disabled and it should remain enabled when i select "This Campaign".The code is given below for reference but im not getting any errors or exceptions.Plese help me.
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>TextBoxDisabling</title>
<script type="text/javascript">
function findselected() {
document.getElementById('selmenu');
document.getElementById('txtField');
(state.value == "All Campaign") ? txtField.disabled = true
: txtField.disabled = false
}
</script>
</head>
<body>
<form action="" method="POST" name="form1">
<select name="selmenu"
onChange="findselected()">
<option value="1">This Campaign</option>
<option value="2">All Campaign</option>
</select> <input type="text" size="20" id="txtField" name="txtField"></form>
</body>
</html>
4 answers
solution1
2 2011-04-01 10:49:31
Try this
<script type="text/javascript">
function findselected() {
var selMenu = document.getElementById('selmenu');
var txtField = document.getElementById('txtField');
if(selMenu.value == '2')
txtField.disabled = true
else
txtField.disabled = false
}
</script>
<form action="" method="POST" name="form1">
<select name="selmenu" id="selmenu" onChange="findselected()">
<option value="1">This Campaign</option>
<option value="2">All Campaign</option>
</select>
<input type="text" size="20" id="txtField" name="txtField">
</form>
solution2
0 2011-04-01 10:38:01
For start.. your select is missing
id="selmenu"
And I also think, that your code
(state.value == "All Campaign")
Should be
(state.value == 2)
Because you are referencing value, not text.
solution3
0 2011-04-01 10:38:35
Your not assigning the values of your document.getElementById() calls to anything.
Try this:
function findselected() {
var selMenu = document.getElementById('selmenu');
var txtField = document.getElementById('txtField');
if(selMenu.value == 2) ? txtField.disabled = true
: txtField.disabled = false
}
Edit: Also, as previously suggested you need to give your select menu an ID of "selmenu".
solution4
0 2011-04-01 10:50:25
here is something that you need to do..
give your select element an id
<select name="selmenu" id='selMenu' onChange="findselected()">
and use this function:
function findselected() {
var state = document.getElementById('selmenu');
var txt = document.getElementById('txtField');
stateName = state.options[state.value-1].innerHTML;
(stateName == "All Campaign") ? txt.disabled = true : txt.disabled = false ;
} Note that the value of selection is 1 or 2 and not the text in option. For selecting the text in option you will have to read the innerHTML of the element of options array.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.