goober wrote:[color=blue]
> Ladies & Gentlemen:
>
> I have built a form that client-side validates and posts data to a CRM
> beautifully in Internet Explorer (IE) 6. The problem comes in FireFox
> (FF) 1.5 when everything works except the validation. In FF it posts
> fine to my CRM but with no validation!
>
> Here are snippets of my code together after taking out as much as I can
> for brevity sake.
>
> This form, when working, should be able to be filled out, client-side
> validated, and then the data posts to SalesForce (our corporate CRM).
> This whole process works fine in IE, just not in FF.
>
> Please also note that I am not a programmer by trade, just a web
> schmuck trying to get a form to work.
>
> Thanks for any help you can provide.[/color]
Matt has already pointed out your main issues - the use of a form name
as a global variable and not having server-side validation also. A few
extra comments:
[color=blue]
> <script Language="JavaScript" Type="text/javascript">[/color]
Drop the language attribute, it's been deprecated for years.
[color=blue]
> function My_Validator()[/color]
It is common practice to use capital letters for function names where
the function is used as a constructor. Otherwise, use a lower case
letter. It also helps to make the name more meaningful, say:
function salesForceValidator()
[color=blue]
> {
>
> //Validation for Last Name Content[/color]
For maintenance sake, the input named 'first_name' should probably be
for a person's first name, not their last :-)
[color=blue]
> if (TheForm.first_name.value == "")[/color]
If you are going to use an object property more than once, it is good to
keep a reference to it and use that subsequently - it is more efficient
and (usually) saves typing. If it is a persons name, you may want to
test that one or more letters were added, rather than just anything:
var form = document.TheForm;
var fName = form.first_name;
if (! /\w/.test(fName.value)) // False if at least one letter entered
[color=blue]
> {
> alert("Please enter a value for the \"first_name\" field.");[/color]
You can nest double quotes inside single quotes (and vice versa). A
common practice is to use single quotes in JavaScript and double in
HTML. Also, prompt the user with the field name that they see on the
face of the form, not what you are using in the program, with language
that makes sense to them:
alert('Please enter a name in the "First Name" field.');
[color=blue]
> TheForm.first_name.focus();[/color]
It's good to test methods before using them:
if (fName.focus) fName.focus();
[color=blue]
> return (false);[/color]
There's no need for the parenthesis around 'false', it does nothing useful:
return false;
[color=blue]
> }
>
> //AND MANY OTHER FIELD VALIDATIONS OMITTED HERE FOR BREVITY
>
> return (true);[/color]
return true;
Usually that isn't necessary - if false isn't returned, the form will
submit.
[color=blue]
> }
> </SCRIPT>
>
> <form
> action="http://www.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8"
> method="POST" onsubmit="return My_Validator();" language="JavaScript"[/color]
There is no 'language' attribute for a form. There is a 'lang'
attribute, but that is intended to specify "the base language of an
element's attribute values and text content."
The value "JavaScript" is unlikely to be useful. ;-)
<URL:http://www.w3.org/TR/html4/struct/dirlang.html#adef-lang>
[color=blue]
> name="TheForm">
>
> <input type="hidden" name="lead_source" value="Web Form" />
> <input type="hidden" name="Campaign_ID" value="701300000000zjq" />
> <input type="hidden" name="oid" value="00D300000000FEp" />
> <input type="hidden" name="retURL"
> value="http://www.knowitall.com/forms/cd/response.html" />[/color]
Unless this is XHMTL (and your attribute names make me think it isn't),
don't use ' />' for empty elements, use correct HTML: '>'
[color=blue]
> <table border="0" cellpadding="2" style="border-collapse: collapse"
> width="842" id="table2">
> <tbody>
>
> <tr>
> <td width="196">First Name: </td>
> <td colspan="2"> <input name="first_name" id="first_name"
> type="text" size="50" maxlength="40" /><sup>*</sup></td>
> </tr>
>
> //AND MANY OTHER FIELDS OMITTED HERE FOR BREVITY
>
> <input type="submit" name="submit"[/color]
Don't ever name a submit button 'submit', it will mask the form's submit
method so that you can't call it. It may not matter here, but it is bad
practice and will cause you a problem eventually.
You should only give an element a name if it needs it. There are two
main reasons to give a submit button a name:
1. You have multiple submit buttons and want to know which
one was used
2. You want to use the name to access the button
Neither case seems to apply here, so probably just remove the button's
name attribute.
[...]
--
Rob
Group FAQ: <URL:http://www.jibbering.com/faq/>
