[RESOLVED] Help with user defined object - My first attempt!

This site is best viewed in a modern browser with JavaScript enabled.

[RESOLVED] Help with user defined object - My first attempt!

skinman

I'm relatively new to JS so I need a hand. If someone could go to This Page and tell me what I'm doing wrong? I'm basically trying to make an object that checks for a valid name, id number and email address. Since I don't know that much about objects I've become stuck. Any ideas would be greatly appreciated.

ReFreezed

I can see several problems here.. I'll try to go through them all.

First in the validateForm function...

[COLOR=#000000][FONT=monospace]if (validate.checkBlank = "true")[/FONT][/COLOR]

[FONT=monospace]
[/FONT]should be

[COLOR=#000000][FONT=monospace]if (validate.checkBlank() == true)[/FONT][/COLOR]

First, validate.checkBlank is a function/method that checks if any field is blank, right? Then you have to call it (using the parenthesis) to get any value back from it. Second, a single equal sign is used for assigning values to variables and object members, and two equal signs is for testing equality (and here you want to see if checkBlank returns true). Third, remember that the string "true" is not the same as the boolean value true.

What actually happens right now on that line is that you assign the string "true" to validate.checkBlank (so validate.checkBlank is now a string instead of a function).

The same problem occurs on the row with [FONT=monospace]if (validate.checkEmail = "true")[/FONT].

The next problem is in the [FONT=monospace]hwkObj[/FONT] constructor function:

[COLOR=#000000][FONT=monospace]var formIsBlank = true;[/FONT][/COLOR]

should probably be

[COLOR=#000000][FONT=monospace]return true;[/FONT][/COLOR]

since you at one point in [FONT=monospace]validateForm[/FONT] calls [FONT=monospace]checkBlank[/FONT] to check if any field is blank, and then use the returned value to decide what to do (with an if statement).

The next problem is this line:

[COLOR=#000000][FONT=monospace]if (isNaN(id.value) = true)[/FONT][/COLOR]

which should be

[COLOR=#000000][FONT=monospace]if (isNaN(id) == true)[/FONT][/COLOR]

Remember that you put the value of [FONT=monospace]document.form1.fieldId.value[/FONT] in id before, so id now contains a string. Also, we should be using the == here since we're comparing the returned value from [FONT=monospace]isNaN(id)[/FONT] and true, not assigning anything.

The last problem I can see at the moment is the way you use the regular expression to check the e-mail address. I suggest you check out http://www.w3schools.com/jsref/jsref_regexp_test.asp to see how to use regexp. And also from this function you should be returning a value instead of setting the local variable [FONT=monospace]formBadEmail[/FONT] to true.

I hope any of this makes any sense and that it helps you.

Edit:
Just as an additional note... you usually don't have to compare a value with true in an if statement. E.g. these two if statements both works the same way:

[COLOR=#000000][FONT=monospace]if (isNaN(id) == true)
[/FONT][/COLOR][COLOR=#000000][FONT=monospace]if (isNaN(id))[/FONT][/COLOR]

skinman

Thank you very much. This has definitely put me in the right direction. I appreciate the help. I put in the corrections but I think I'm still missing something. The code still isn't functioning right.

skinman

skinman;1230319 wrote:
The code still isn't functioning right.

What I mean by that is the error message that pops up when the form is blank keeps coming up even when the form isn't blank.

ReFreezed

I see two problems remaining (assuming you updated that code in the link you provided):
[FONT=monospace][/FONT]

[COLOR=#000000][FONT=monospace]if (validate.checkBlank() == null)[/FONT][/COLOR]

[FONT=monospace]
[/FONT]should be

[COLOR=#000000][FONT=monospace]if (validate.checkBlank() == true)[/FONT][/COLOR]

Remember that you're only returning true if any field is empty. Also:

[COLOR=#000000][FONT=monospace]if (email != emailRegExp)[/FONT][/COLOR]

[FONT=monospace]
[/FONT]should be

[COLOR=#000000][FONT=monospace]if (![/FONT][/COLOR][COLOR=#000000][FONT=monospace]emailRegExp.test([/FONT][/COLOR][COLOR=#000000][FONT=monospace]email))[/FONT][/COLOR]

[FONT=monospace]

[/FONT][FONT=monospace]emailRegExp[/FONT] is not a string you compare against, it's an unique RegExp object (so [FONT=monospace]email != emailRegExp[/FONT] will always be true because they are two completely different kind of objects, thus never the same). Check the link I posted to W3schools in my other post to see how RegExp works.

skinman

Thanks again for the help. Regular Expressions have always been one of those things that I struggle with due to its complexity. I have been to w3schools site to check it out. It's just so complex that I have issues getting even the simplest implementation down. This email checker isn't helping me any in that matter. In any case I've changed what you mentioned. Unfortunately I can't seem to get the error messages to turn on and off as I want them to. I'm not sure if the problem is the object code or the validation code.

EDIT: I got everything to work except the email checker. It won't recognize a valid email, so I think my regexp is wrong. If that is what you were trying to tell me before I'm looking into it now.

skinman

I just used a new regex and now the whole script finally works as intended, with one issue. The success message I wanted to use doesn't fire. I think that's because the form is trying to get submitted, but I never put in any code to submit anything. It should be doing nothing but staying on the page. Any suggestions on that one? I've looked at the same code for so long I'm going snow blind, or have tunnel vision and can't see beyond a certain point anymore.

ReFreezed

There are problems with this line:

[COLOR=#000000][FONT=monospace]if (validate.checkBlank == false && validate.checkNumber == false && validate.checkEmail == false)[/FONT][/COLOR]

Just like before, [FONT=monospace]validate.checkBlank[/FONT] is a function, so you have to call it to get any value back... Also note that you should compare the returned value with [FONT=monospace]true[/FONT], like this:

[COLOR=#000000][FONT=monospace]if (validate.checkBlank() != [/FONT][/COLOR][COLOR=#000000][FONT=monospace]true[/FONT][/COLOR][COLOR=#000000][FONT=monospace] && validate.checkNumber() != true && validate.checkEmail() != [/FONT][/COLOR][COLOR=#000000][FONT=monospace]true[/FONT][/COLOR][COLOR=#000000][FONT=monospace])[/FONT][/COLOR]

I don't think I've mentioned it yet, but if a function doesn't return anything specific then it automatically returns [FONT=monospace]undefined[/FONT]. That means your validation functions could potentially return two different values - either [FONT=monospace]true[/FONT] or [FONT=monospace]undefined[/FONT] (since you don't return anything if the [FONT=monospace]if[/FONT]-statement fails.) Thus [FONT=monospace]validate.checkBlank()==false[/FONT] would always fail because [FONT=monospace]checkBlank[/FONT] never return the value [FONT=monospace]false.[/FONT] ([FONT=monospace]false[/FONT] is not the same as [FONT=monospace]undefined[/FONT].)

And finally, that whole if-statement should be inside the validateForm() function, shouldn't it? It's outside right now.

skinman

I kept forgetting the () in there. I also did neglect to insert the closing } of the function. The thing that still bothers me is that the form is still trying to submit itself. Doesn't return false; stop that from happening?

EDIT: Never mind. I had a typo and forgot the ;. I swear these typos and forgetfulness is going to be the death of me. Anyway, thank you so much for your patience and help with all of this. Now that I have a working code I can study it and learn from it, and I have certainly learned a ton from you.

ReFreezed

That's great! And I'm just glad I could help.

skinman

I hate to beat a dead horse here, but do you know how I would make this code so that when a single form field is empty the field border changes and the error message pops up? Right now even if all fields are empty only the first one is highlighted in red.

skinman

Never mind I figured it out. I'll let this dead horse rest now.