SitePoint Sponsor |
|
User Tag List
Results 1 to 8 of 8
Thread: Inputs from a form
-
May 30, 2007, 02:31 #1
- Join Date
- May 2007
- Posts
- 22
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Inputs from a form
What is the code to take an input from a form and assign it to a variable? Such as the in the form below with input "first".
Also, how do I display the result of a math operation back to the "result" value of the form?
<body>
<form name = "comparison" action = "">
<table border = "1">
<caption>Integer Comparison</caption>
<tr><td>Input First Integer</td>
<td><input name = "first" type = "text" />
</td></tr>
<tr><td>Input Second Integer</td>
<td><input name = "second" type = "text" />
</td></tr>
<tr><td><input type = "button" value = "Compare Inputs"
onclick = "comparison()" /></td></tr>
<tr><td>The First Integer is/td>
<td><input name = "result" type = "text" /></td></tr>
</table>
</form>
</body>
-
May 30, 2007, 03:28 #2
- Join Date
- Jan 2007
- Location
- Belgium
- Posts
- 591
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
The function comparison seems predefined or something, I renamed it.
HTML Code:<html> <head> <script language="javascript"> function $(v){return document.getElementById(v)} function compare() { var first = parseInt($('first').value); var second = $('second').value * 1; $('result').value = first+second; } </script> </head> <body> <form name="comparison" action=""> <table border="1"> <caption>Integer Comparison</caption> <tr> <td>Input First Integer</td> <td><input id="first" name="first" type="text" /></td> </tr> <tr> <td>Input Second Integer</td> <td><input id="second" name="second" type="text" /></td> </tr> <tr> <td colspan="2"><input type="button" value="Compare Inputs" onclick="compare();" /></td> </tr> <tr> <td>The First Integer is</td> <td><input id="result" name="result" type="text"/></td> </tr> </table> </form> </body> </head>
FOR SALE: 1 set of morals, never used, will sell cheap
-
May 30, 2007, 03:59 #3
Whole form must be passed to a JavaScript comparison function whatever is the result instead of returning it set the value of result's initial value attribute to this. All this can be done by JS
-
May 30, 2007, 05:20 #4
- Join Date
- May 2007
- Posts
- 22
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
HexB,
Could you explain these statements to me? newbie here.....
function $(v){return document.getElementById(v)}
var first = parseInt($('first').value);
var second = $('second').value * 1;
-
May 30, 2007, 06:09 #5
- Join Date
- Apr 2006
- Location
- Czech Republic
- Posts
- 236
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
This function call
Code:document.getElementById
Code:$('first').value
Code:document.getElementById("first").value
Code:parseInt($('first').value)
The third line is self-explanatory.
-
May 30, 2007, 08:44 #6
- Join Date
- May 2007
- Posts
- 22
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks for the info, what is the *1 for at the end of this statement?
var second = $('second').value * 1;
-
May 30, 2007, 10:19 #7
- Join Date
- Apr 2006
- Location
- Czech Republic
- Posts
- 236
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I don't know exactly, but it may be another way how to convert variable to number. PHP tries to retype vars automatically, so it attampts to canovrt them to numbers when they are part of mathematical statement. You can multiply them by one ore simply increment them by zero, it works too.
-
May 30, 2007, 12:37 #8
- Join Date
- Aug 2006
- Posts
- 266
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
As far as I know, it converts the string to number.
Code:<html> <head> <script language="javascript"> function $(v){return document.getElementById(v)} function compare() { var first = parseInt($('first').value); alert("typeof(first) : "+typeof(first)); var second = $('second').value ; alert("typeof(second) : "+typeof(second)); alert(first + second); second = $('second').value * 1; alert(typeof(second)); alert(first + second); $('result').value = first+second; } </script> </head> <body> <form name="comparison" action=""> <table border="1"> <caption>Integer Comparison</caption> <tr> <td>Input First Integer</td> <td><input id="first" name="first" type="text" /></td> </tr> <tr> <td>Input Second Integer</td> <td><input id="second" name="second" type="text" /></td> </tr> <tr> <td colspan="2"><input type="button" value="Compare Inputs" onclick="compare();" /></td> </tr> <tr> <td>The First Integer is</td> <td><input id="result" name="result" type="text"/></td> </tr> </table> </form> </body> </html>
http://www.jibbering.com/faq/faq_not...e_convert.html
var numValue = stringValue - 0;
/* or */
var numValue = stringValue * 1;
/* or */
var numValue = stringValue / 1;
var numValue = Number(stringValue);
Bookmarks