HighDots Forums  

javascript problem

Macromedia Dreamweaver Macromedia Dreamweaver Discussions (macromedia.dreamweaver)


Discuss javascript problem in the Macromedia Dreamweaver forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Dwayne Epps
 
Posts: n/a

Default javascript problem - 07-17-2003 , 01:22 PM






This is probably a no brainer, but I am having no luck at getting this to
work. I'm creating functions that will validate form data fields. For
example, the following function:

function checkText(field, msg, min, max) {
if (!min) { min = 1 }
if (!max) { max = 65535 }
if (!field.value || field.value.length < min || field.value.max > max ||
!field.value.match(/^[a-zA-Z]*$/)) {
alert(msg);
field.focus();
field.select();
return false;
}return true;
}

I tested the above function and it works great. The problem is I have
several different functions that will check for fields with different data
like: numbers only, selections in drop down menus, valid zip code, etc. I'm
trying to create one function that I can call using the onSubmit event that
will go through each function to validate all the fields in the form.

I was trying to use the following function to accomplish this using just the
first function. I would include other if statements for the other
functions.

function formValidation(thisform) {
if (checkText(this.first_name, 'Please enter your first name.', 2,
15)==false) {
return true;
}
return false;
}

then within the form tag, I called the function:
onSubmit="return formValidation(thisform)

I'm not all that proficient with Javascript as I'm still learning. Can
anyone identify my mistake in the formValidation function? The argument
"thisform" doesn't need to be the name of the HTML form does it? I thought
it could be any name of my choosing? Any help is greatly appreciated.
Thanks in advance.
-D-




Reply With Quote
  #2  
Old   
Dwayne Epps
 
Posts: n/a

Default Re: javascript problem - 07-17-2003 , 05:05 PM






Thanks David. That solved the problem. It has been a little more time
consuming writing the validation scripts myself, but well worth the effort.
I had tried some of the form validation extensions, but they just didn't
provide the checks in the way that I needed. Again, thank you for your
help!
-D-


"David Powers" <me (AT) thisisntmyaddress (DOT) com> wrote

Quote:
Dwayne Epps wrote:
::
:: function formValidation(thisform) {
:: if (checkText(this.first_name, 'Please enter your first name.', 2,
:: 15)==false) {
:: return true;
:: }
:: return false;
:: }
::
:: then within the form tag, I called the function:
:: onSubmit="return formValidation(thisform)
::
:: I'm not all that proficient with Javascript as I'm still learning.
:: Can anyone identify my mistake in the formValidation function?

Change the onSubmit line to

onSubmit="return formValidation(this.form)"

You need to put a period (full stop) between "this" and "form". Also, in
your function itself:

function formValidation(form) {
if (checkText(form.first_name, 'Please enter your first name.', 2,
15)==false) {
return true;
}
return false;
}

The name of the variable you supply as an argument needs to be what you
refer to throughout the function. So, to choose a ludicrous example, you
could change it to:

function formValidation(cherryBlossom) {
if (checkText(cherryBlossom.first_name, 'Please enter your first name.',
2,
15)==false) {

--
David Powers
*******************************************
No-nonsense reviews of computer books
http://japan-interface.co.uk/webdesign/books.html
Save 10% on TopStyle CSS Editor
*******************************************





Reply With Quote
  #3  
Old   
Gary White
 
Posts: n/a

Default Re: javascript problem - 07-17-2003 , 06:34 PM



On Thu, 17 Jul 2003 21:11:36 +0100, "David Powers"
<me (AT) thisisntmyaddress (DOT) com> wrote:

The real problem with the original code is that "thisform" is an
undefined variable where it's called:

Quote:
onSubmit="return formValidation(thisform)"
Your suggestion:

Quote:
onSubmit="return formValidation(this.form)"
Hmmm... the onSubmit event is an event of the form object, thus the
word "this" in a parameter refers to the form itself. What all that
techno-babble means is that this would work:

onSubmit="return formValidation(this)"


Gary


Reply With Quote
  #4  
Old   
David Powers
 
Posts: n/a

Default Re: javascript problem - 07-18-2003 , 06:52 AM



Gary White wrote:
:: Your suggestion:
::
::: onSubmit="return formValidation(this.form)"
::
:: Hmmm... the onSubmit event is an event of the form object, thus the
:: word "this" in a parameter refers to the form itself. What all that
:: techno-babble means is that this would work:
::
:: onSubmit="return formValidation(this)"

Thanks for clarifying that. Event handling is one part of JavaScript that is
still only gradually revealing its arcane mysteries to the inner parts of my
brain.

--
David Powers
*******************************************
No-nonsense reviews of computer books
http://japan-interface.co.uk/webdesign/books.html
Save 10% on TopStyle CSS Editor
*******************************************



Reply With Quote
  #5  
Old   
Gary White
 
Posts: n/a

Default Re: javascript problem - 07-18-2003 , 10:17 AM



"David Powers" <me (AT) thisisntmyaddress (DOT) com> wrote

Quote:
Thanks for clarifying that. Event handling is one part of JavaScript that
is
still only gradually revealing its arcane mysteries to the inner parts of
my
brain.

You're welcome, David. It takes a bit to get your head around it, but once
you do it's pretty simple. The keyword "this" refers to the object where the
event occurs. From there, you just need to understand a little about the
DOM.

If you assign, for example, an onSubmit handler to a form, the word "this"
refers to the form.

If you assign an onClick handler to a button, the keyword "this" refers to
the button.

If you wanted to send the form object as a parameter in a button's onClick
handler, you'd use this.form.

If you wanted to send an input text object as a parameter in a form's
onSubmit handler you'd use this.textobjectname.

If you wanted to send an input text object as a parameter in a button's
onClick handler you'd use this.form.textobjectname.


Gary




Reply With Quote
  #6  
Old   
David Powers
 
Posts: n/a

Default Re: javascript problem - 07-18-2003 , 10:30 AM



Gary White wrote:
::
:: You're welcome, David. It takes a bit to get your head around it,
:: but once you do it's pretty simple. The keyword "this" refers to the
:: object where the event occurs. From there, you just need to
:: understand a little about the DOM.

Yes, that bit's beginning to sink in - and your explanation is very helpful.
It's the way events are handled in DOM Level 2 that freezes my brain. It
sounds as though it's very powerful, but since IE doesn't support it, the
incentive to study the finer details is somewhat reduced.

--
David Powers
*******************************************
No-nonsense reviews of computer books
http://japan-interface.co.uk/webdesign/books.html
Save 10% on TopStyle CSS Editor
*******************************************



Reply With Quote
  #7  
Old   
Gary White
 
Posts: n/a

Default Re: javascript problem - 07-18-2003 , 02:29 PM



"David Powers" <me (AT) thisisntmyaddress (DOT) com> wrote

Quote:
Yes, that bit's beginning to sink in - and your explanation is very
helpful.
It's the way events are handled in DOM Level 2 that freezes my brain. It
sounds as though it's very powerful, but since IE doesn't support it, the
incentive to study the finer details is somewhat reduced.
Yep. It's hard to invest much time and effort into learning something that
can be used by less than 10% of your users.

Gary




Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.