1

I have a very simple form (.cfm page). I'm submitting the form via AJAX in my javascript file. The form works fine in IE, Safari and Chrome, but doesn't work in FF (v18.0).

Here is my form:

<form name="LoginForm">
<input class="newstext" type="text" name="userLogin" id="userLogin">
<input class="newstext" type="password" name="passLogin" id="passLogin">
<input type="button" name="login" value=" Login " onClick="validateLogin();">
</form>

Javascript code:

function validateLogin() {

    if (document.getElementById('userLogin').value == '') {
    alert('Please enter your username');
    document.getElementById('userLogin').style.backgroundColor='yellow';
    document.getElementById('userLogin').focus();
    return false;
} 

if (document.getElementById('passLogin').value == '') {
    alert('Please enter your password');
    document.getElementById('passLogin').style.backgroundColor='yellow';
    document.getElementById('passLogin').focus();
    return false;
} 

ColdFusion.Ajax.submitForm("LoginForm", "loginForm_action.cfm", submitLoginCallback, submitLoginerrorHandler);
return true;

}

When I try to login in, the form element values aren't being passed. So when it hits the cfc, the cfc says "Element USERLOGIN is undefined in FORM.
The error occurred on line 9." Any ideas?

David Jacobson
  • 169
  • 2
  • 11
  • Can you post the code for your loginForm_action.cfm? Do you get the two alert()s in FF and then an error? – Juffy Jan 10 '13 at 01:27
  • The two alerts say undefined for both. The action page has a cfinvoke to my cfc that validates the form against the DB (). When it gets to that point I get the following error message: Element USERLOGIN is undefined in FORM.
    The error occurred on line 9.     – David Jacobson Jan 10 '13 at 02:19
  • Now that you've updated your code, would you update your question please. You're question is "any ideas why name and pass are undefined" as it stands, name and pass are not in the code. define `still not working in firefox` copy paste the exact error, is it a JS or CF error? Help us to help you, my friend. – genericHCU Jan 10 '13 at 11:34
  • This question really needs the javascript tag as well but I think we should spare that community until we get a `good` question out of the OP. – genericHCU Jan 10 '13 at 11:38
  • @Travis Thanks, I have updated the question and copied the error that is being returned from CF. Thanks in advance for your help. – David Jacobson Jan 10 '13 at 13:20
  • Have you tried doing a cfdump in your cfc of the form scope to see what you do get? – Nicklepedde Jan 10 '13 at 13:27
  • try
    (I'm curious to see if the function is picking up the form's name in firefox) Docs say ID or Name of the form but I'd like to eliminate this as a possibility.
     – genericHCU Jan 10 '13 at 13:31
  • how are you passing the arguments to your cfc? the code you posted in your comment does not seem to pass any form values to the cfc - you need to pass them explicitly either as s, or as named attribute=value pairs in tag, or as argumentCollection structure. – azawaza Jan 10 '13 at 13:34
  • the cfc probably directly accesses the form scope, they don't need to be passed in. – genericHCU Jan 10 '13 at 13:37
  • is this actually a `cfform` or are you using the `cfajaximport` tag somewhere? – genericHCU Jan 10 '13 at 13:38
  • @azawaza `A CFC shares the Form, URL, Request, CGI, Cookie, Client, Session, Application, Server, and Flash scopes with the calling page. Variables in these scopes are also available to all pages that are included by a CFC. These variables do not have any behavior that is specific to CFCs.` from: http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24-7dfb.html – genericHCU Jan 10 '13 at 13:59
  • @Travis Right you are. Have not used in ages and forgot that! – azawaza Jan 10 '13 at 14:07

2 Answers2

1

When you posted the question did StackOverflow invite you to look at this?

Edit starts here

If you were not invited to look, you weren't.

The answer that got 6 votes was, "document.getElementsByName() returns an array, so you have to access it by an index: document.getElementsByName('staff_counter')[0] (depending on how many of these you have).

You also have access to a length property to check how many Elements were matched."

It makes sense to me given that you were presented with undefined variable problems.

Community
  • 1
  • 1
Dan Bracuk
  • 20,699
  • 4
  • 26
  • 43
  • Can you expand your answer to include the salient point(s)? Links can break, even on StackOverflow. – Leigh Jan 10 '13 at 02:25
  • @Dan Bracuk I was kind of wondering the same thing. If you search for `document.getElementsByName` not working in Firefox you get lots of results. – Miguel-F Jan 10 '13 at 02:28
  • So you're suggesting that I use getElementsbyName instead of ID? Is that correct? – David Jacobson Jan 10 '13 at 02:31
  • 2
    Read the first line of the accepted answer: _"document.getElementsByName() returns an array, so you have to access it by an index"_ – Peter Boughton Jan 10 '13 at 02:36
  • +1 what @PeterBoughton said. I'm guessing that IE and Chrome are defaulting for you but FF is not. – Miguel-F Jan 10 '13 at 02:38
  • The reason I phrased the answer the way I did is that whenever I post a question, I get lot's of invitations to look at other threads to make sure the question is not a duplicate. – Dan Bracuk Jan 10 '13 at 02:50
  • The other point to note is why not just use `getElementById`, since you've gone to the trouble of defining ids for the fields? – Juffy Jan 10 '13 at 02:55
  • @ Juffy I actually thought I had posted my code with getElementsbyId. It appears I made a mistake when I posted and just went with it to try and make it work. – David Jacobson Jan 10 '13 at 03:21
  • in Dan's defense, this answer was very valid to the originally asked question. I hope nobody else goes on a down-vote-marathon... – genericHCU Jan 10 '13 at 13:42
  • Yes it was I apologize for teh confusion. – David Jacobson Jan 11 '13 at 01:58
0

Okay guys here is what I did to fix this issue.

It seems when the form was processed by Firefox there was malformed HTML caused by my <form> tag being inside a <table> tag and the cooresponding end tag (</form>) was also within the <table> tag. After moving the form tags around the table the form work as expected.

Thank you all for trying to help me solve this issue that was difficult to figure out and I apologize for the confusion within my initial question.

David

David Jacobson
  • 169
  • 2
  • 11