What is the difference between JavaScript's getElementById() and getElementsByName() functions?

The GetElementsByName method returns an array, and when you tried to call element.focus() you got an error because there is no focus method on an array. When you get an error in the event handler it won't prevent the form from posting.

Up vote 0 down vote favorite share g+ share fb share tw.

Other than the fact that my brief research tells me the latter will return a collection rather than a a single element with the ID passed. Consider the following code: function validateAllFields() { var clientid = document. GetElementById("clientid"); var programs = document.

GetElementById("programs"); var startmonth = document. GetElementById("startmonth"); var startday = document. GetElementById("startday"); var startyear = document.

GetElementById("startyear"); var completed = document. GetElementsByName("completed"); var goals = document. GetElementsByName("goals"); var errors = document.

GetElementById("errorMsg"); errors. InnerHTML = ""; if(isNumeric(clientid, errors, "Please enter a valid client ID")){ if(madeSelection(programs, errors, "Please select a program from the drop-down list")){ if(madeSelection(startmonth, errors, "Please enter a month for the start date")){ if(madeSelection(startday, errors, "Please enter a day for the start date")){ if(madeSelection(startyear, errors, "Please enter a year for the start date")){ if(checked(completed, errors, "Please choose an option that indicate whether the client has completed the program")){ if(checked(goals, errors, "Please choose an option that indicate whether the client has met his/her goals. ")){ window.

Alert("GOT IN TO RETURN TRUE"); return true; } } } } } } } return false; } The above code works perfectly after placing it in the onsubmit handler of the form. However, earlier, for the elements (programs, startmonth, startday, startyear) I was using getElementsByName(), the following happened: The code seems to get to the second line of the if blocks "if(madeSelection(programs...." and it displayed the error msg via innerHTML for a brief second and Proceeded to submit the form AS IF the JS had indeed returned true. As you can tell, there is a popup alert right before returning true and the popup DID NOT show up at all.

Bad data was submitted to my test database because the form had not been validated. (yet to write server-side validation with this form, but I will). Please assume the elements programs, startmonth, startday, and startyear are drop-down lists with the same id and name attributes.

Also, the madeSelection function is given as: function madeSelection(element, error, msg) { if (element0. Value == "none" || element0. ValueOf == "none" || element0.

Value == "") { error. InnerHTML = msg; element.focus(); return false; } else { return true; } } My code does work right now after I changed those elements to be using getElementById(), I was just wondering why getElementsByName presented such behavior. Javascript link|improve this question asked Jun 15 '11 at 0:01KyleL194 100% accept rate.

– kinakuta Jun 15 '11 at 0:04 @kinakuta - no, he doesn't: w3schools.com/jsref/met_doc_getelementsb... – cwolves Jun 15 '11 at 0:08 2 Your code is a mess with all that indentation. Consider returning false after each detected error and returning true in the end if there were no errors. – Zecc Jun 15 '11 at 0:15.

The GetElementsByName method returns an array, and when you tried to call element.focus() you got an error because there is no focus method on an array. When you get an error in the event handler it won't prevent the form from posting. If you use GetElementById you should use element to access the element, and if you use GetElementsByName you should use element0.

The name attribute is not designed to be unique, while the id attribute is.

1 In particular, inputs of type "radio" share the same name if they belong to the same group. – Zecc Jun 15 '11 at 0:11.

In order for the form to not be submitted, return false needs to be returned (you said you used the onsubmit handler) in the second line of your code, because a selection is indeed returned by getElementsByName (it would work with . GetElementsByName("test")0 ) a js error is thrown. The rest of the code is not executed, therefore nothing is returned and the form by-passes the rest of the validation completely.

GetElementsByName gets elements by their name, getElementById gets the element by its id. There may be many elements on a page with the same name (hence getElementsByName always returns a list of elements), but there is (must) only be one element with a given id (therefore getElementById only returns a single element).

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions