picatree Posted August 21, 2016 Share Posted August 21, 2016 (edited) Why is javascript not working with my form? I can not return any form element with document.getelementsByID or document.getelmentsByname. I wanted to do a simple what is your name put a user's name and display it back. Also I wanted to position the form elements wherever I want. How do I accomplish all that? Any fix or suggestion on how I should have done this? Thank you in advance Frank <!DOCTYPE html><HTML><HEAD><TITLE>First Step </TITLE> <STYLE> Html, Body {margin:10;padding:0; }#Label1 {position: absolute;cursor: default;Left: 124px;top: 7px;z-index:-1;}#Label2 {position: absolute;cursor: default;Left: 124px;top: 69px;z-index:-1;}#Label3 {position: absolute;cursor: default;Left: 129px;top: 220px;z-index:-1;}#Textbox1 {position: absolute;Left: 124px;top: 100px;z-index:-1;}#Textbox2 {position: absolute;Left: 2px;top: 50px;z-index:-1;}#CommandButton1 {position: absolute;Left: 2px;top: 10px;height: 23px;width: 595px;z-index:-1;}</STYLE><SCRIPT LANGUAGE="JavaScript"><!--function OKClick() {//var x="By Frank" this works fine if i add it to Hello world.var x = document.getElementByname("Textbox1"); This doesn't work by ID or by Name it will put elements out of line.alert("Hello "+x )}// Do not Add or Remove anything past this line!//--------------------------------------------------------------------------// --></script> <BODY></BODY><FORM ID= "FirstStep" NAME="FirstStep" METHOD=POST ACTION="javascript:void(0)"><DIV ID="Label1"><Label for="Label1">Almost there! Please complete this form and click the button below to gain instant access.</label></DIV><DIV ID="Label2"><Label for="Label2">Enter your email address and click the button below to get Started.</label></DIV><DIV ID="Label3"><Label for="Label3">I hate SPAM and promise to keep your email address safe.</label></DIV><DIV ID="Textbox1"><INPUT TYPE="TEXT" NAME="textbox1" VALUE="Name" SIZE=" 39"</DIV><DIV ID="Textbox2"><INPUT TYPE="TEXT" NAME="Textbox2" VALUE="Email" SIZE=" 39"</DIV><DIV ID="CommandButton1"><h1><INPUT TYPE="button" Onclick= "OKClick() " value = "I'M WILLING TO TAKE ACTION NOW >>" </h1></DIV> </FORM> </HEAD></HTML> FirstStep.html Edited August 21, 2016 by picatree Link to comment Share on other sites More sharing options...
dsonesuk Posted August 21, 2016 Share Posted August 21, 2016 (edited) There is no such thing as getElementByname(); so it throws an error, it has to be correct in every way, it looks for a possible multiple elements using the same name attribute, not singular like ID, so its ('getElements'), is also must be CamelCase ('getElementsByName'); Then you need to tell it which element/s you wish to retrieve the information from by using index ref, since you have only one the index will be 0 var x = document.getElementsByName("Textbox1")[0], This will still fail, because there is no input with name value of 'Textbox1', it is case sensitive so 'textbox1' used for name attribute value of input <INPUT TYPE="TEXT" NAME="textbox1" VALUE="Name" SIZE="39"> and document.getElementsByName("Textbox1")[0] are treated differently. This also will only show that x is and html input object' var x = document.getElementsByName("Textbox1")[0]; You want retrieve value, so reference the value var x = document.getElementsByName("Textbox1")[0].value; You also have problems with inputs not closed properly with '>' so it will have problems with closing div elements cause its attempting to include </div> as part of its html. Edited August 21, 2016 by dsonesuk Link to comment Share on other sites More sharing options...
dsonesuk Posted August 22, 2016 Share Posted August 22, 2016 Attribute 'for' is bound to form element id not! div elements, it gives ability to toggle/select form inputs. Link to comment Share on other sites More sharing options...
James_Purcell Posted August 31, 2016 Share Posted August 31, 2016 (edited) As far as I understand, you main top level tags are wrong. <!DOCTYPE html> <HTML> <HEAD> <TITLE>First Step </TITLE> <STYLE> </STYLE> <BODY> <---------------- </BODY> </FORM> </HEAD> <--------------- </HTML> </HEAD> must be closed before the <body> can be opened. Edited August 31, 2016 by James_Purcell 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now