Asked By
Raymond
140 points
N/A
Posted on - 04/30/2011
Hello experts,
I have a small problem in using JavaScript. I am attempting to access a text box using the code as attached.
Internet Explorer the code works fine but does not work in Firefox. IÂ get a "object required" error right where the IF condition starts. I am pretty sure the syntax is correct!
HTML and JavaScript problem. Cannot get the required element using JavaScript
Your code looks fine. Can you post the HTML portion of the code as well ?
The reason is that the HTML of the input element plays a major role in how each browser processes the HTML document tree. The property values of each element must be enclosed in single or double quotes and each HTML element need to be properly closed.
I believe it might be a problem with the syntax of the "firstname" input. Please post the HTML code for us to see.
Answered By
iRandom
0 points
N/A
#89717
HTML and JavaScript problem. Cannot get the required element using JavaScript
Please post the HTML code of the form element as well. It may give us a clue on what is wrong.
It may be your JavaScript or your HTML code. Both will play a major when you are discussing about cross browser compatibility with JavaScript and HTML.
Answered By
Raymond
140 points
N/A
#89718
HTML and JavaScript problem. Cannot get the required element using JavaScript
Ok. here is my code. I wrote a short page just to test it out. I have highlighted the JavaScript that is giving the error. I also have highlighted the HTML portions as requested by you all.
<html>
<head>
 <script language='JavaScript'>
function validate() {
 if (document.frmDetail.firstName != '') { alert('First Name required'); }
}
</script>
<body>
<form name='frmDetail'>
First Name <input type='text' name='firstname' value=''/>
</form>
</body>
</html>
HTML and JavaScript problem. Cannot get the required element using JavaScript
Raymond, thank you for posting the code.
Looking at the code I noticed that you have not specified the "id" attribute in the form HTML tag. The "id" attribute is also missing in the input HTML tag. It is very important to specify the "id" attribute of each HTML element.
The reason is that the "name" tag is directly recognized by Internet Explorer. When the JavaScript runtime requests Internet Explorer for an element by name, Internet Explorer attempts to return the element that matches the "name" attribute.
Whereas in Firefox, Firefox attempts to query the HTML elements' id attribute and not the name attribute.
Therefore your code will run perfectly in Internet Explorer and not in Firefox.
Please alter your HTML and add the "id" attribute for both elements. Set the value of the "id" attribute to the same value you have given to the name attribute.
Example: <input type='text' name='firstname'id='firstname' />
Answered By
Raymond
140 points
N/A
#89720
HTML and JavaScript problem. Cannot get the required element using JavaScript
I changed the code as follows. Still no dice. Does not work :(.
<html>
<head>
 <script language='JavaScript'>
function validate() {
 if (document.frmDetail.firstName != '') { alert('First Name required'); }
}
</script>
<body>
<form name='frmDetail' id='frmDetail'>
First Name <input type='text' name='firstname'Â id='firstname'Â value=''/>
</form>
</body>
</html>
Answered By
iRandom
0 points
N/A
#89721
HTML and JavaScript problem. Cannot get the required element using JavaScript
I think you have missed to name the input element correctly. The JavaScript refers to "firstName" (title case) whereas the code has "firstname" (all simples). I have highlighted the error in red for you. Maybe you should change the JavaScript code?
Please note that as per TechnoHat you NEED to have the "id" attribute set for the code to work in Firefox.
<html>
<head>
 <script language='JavaScript'>
function validate() {
 if (document.frmDetail.firstName != '') { alert('First Name required'); }
}
</script>
<body>
<form name='frmDetail' id='frmDetail'>
First Name <input type='text' name='firstname'Â id='firstname'Â value=''/>
</form>
</body>
</html>
Answered By
Raymond
140 points
N/A
#89722
HTML and JavaScript problem. Cannot get the required element using JavaScript
Aha ! That did the trick! How could I miss such a simple thing!
I put the id attribute in all the elements plus fixed the case in the JavaScript. Now it works beautifully in both browsers. Thank you for pointing out the error in my code!
I guess the following holds true "developer can't check his own code…you need another one to check it!"
HTML and JavaScript problem. Cannot get the required element using JavaScript
Raymond, I totally agree with you ! Developers need help too!
Answered By
iRandom
0 points
N/A
#89724
HTML and JavaScript problem. Cannot get the required element using JavaScript
Count me in it. I agree as well!
