I am trying to make a simple javascript program bit it isn't working. Kindly help. In eclipse I have created a dynamic web project and in DD my welcome file is index.jsp. Given below is my code for index.jsp
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Duncan'S</title>
<script type="text/javascript">
function nameSubmit() {
alert(document.getElementsByName("username").value);
}
function CakeNumber() {
alert(document.getElementsByName("numOfCake").value);
}
</script>
</head>
<body>
<form action="myservlet.do">
<table>
<tr>
<td>Name:</td>
<td><input type="text" id="name" name="username" size="10"
onchange="nameSubmit();"></td>
</tr>
<tr>
<td>Number Of Duncan's Cake:</td>
<td><input type="text" id="numOfDunCake" name="numOfCake"
size="5" onchange="CakeNumber();"></td>
</tr>
</table>
</form>
</body>
</html>
In the above code both the functions are returning undefined.....!!How can I get the real value??
This question is related to
javascript
You have mentioned Wrong id
alert(document.getElementById("name").value);
if you want to use name attribute then
alert(document.getElementsByName("username")[0].value);
Updates:
input type="text" id="name" name="username"
id is different from name
document.getElementsByName("name") will get several elements called by same name .
document.getElementsByName("name")[Number] will get one of them.
document.getElementsByName("name")[Number].value will get the value of paticular element.
The key of this question is this:
The name of elements is not unique, it is usually used for several input elements in the form.
On the other hand, the id of the element is unique, which is the only definition for a particular element in a html file.
Here is the example for having one or more checkboxes value. If you have two or more checkboxes and need values then this would really help.
function myFunction() {_x000D_
var selchbox = [];_x000D_
var inputfields = document.getElementsByName("myCheck");_x000D_
var ar_inputflds = inputfields.length;_x000D_
_x000D_
for (var i = 0; i < ar_inputflds; i++) {_x000D_
if (inputfields[i].type == 'checkbox' && inputfields[i].checked == true)_x000D_
selchbox.push(inputfields[i].value);_x000D_
}_x000D_
return selchbox;_x000D_
_x000D_
}_x000D_
_x000D_
document.getElementById('btntest').onclick = function() {_x000D_
var selchb = myFunction();_x000D_
console.log(selchb);_x000D_
}Checkbox:_x000D_
<input type="checkbox" name="myCheck" value="UK">United Kingdom_x000D_
<input type="checkbox" name="myCheck" value="USA">United States_x000D_
<input type="checkbox" name="myCheck" value="IL">Illinois_x000D_
<input type="checkbox" name="myCheck" value="MA">Massachusetts_x000D_
<input type="checkbox" name="myCheck" value="UT">Utah_x000D_
_x000D_
<input type="button" value="Click" id="btntest" />Source: Stackoverflow.com