JavaScript / DHTML / AJAX RSS JavaScript / DHTML / AJAX RSS

Need help with Javascript

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply
1 2

•
•
Join Date: Oct 2005
Posts: 240
Reputation: Inny is an unknown quantity at this point 
Solved Threads: 6
Inny's Avatar
Inny Inny is offline Offline
Posting Whiz in Training

Re: Need help with Javascript

 
0
  #11
Jan 23rd, 2007
Bump* pretty please help?
Last edited by Inny; Jan 23rd, 2007 at 1:22 pm.
Always carry a flagon of whiskey in case of snakebite and furthermore always carry a small snake.
W. C. Fields
Reply With Quote Quick reply to this message  
•
•
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Need help with Javascript

 
0
  #12
Jan 23rd, 2007
Method 1: You can change the form submit field into a button field and attach the validation to the onclick event as mentioned before.

Take:

[HTML]<input type='submit' name='submit' value='Submit' class='forminput' tabindex="2" accesskey="s" />[/HTML]

And change it to:

[HTML]<input type='button' name='submit' value='Submit' class='forminput' tabindex="2" accesskey="s" onclick="vaildate_user_text();" />[/HTML]

In the function vaildate_user_text() you'll have to make sure the objects references to the HTML form elements are correctly referencing your form and fields.

ie:

[HTML]var compare_text=document.form1.user_text.value;[/HTML]

Should point to the form field of you are vaildating..

[HTML]document.form1.submit();[/HTML]

Should correctly point to the form to submit.

Method 2: Or you can attach a listerner to the form submit button, this way you don't have to change the submit field to a button field, so that it works with browsers not supporting JS.

In your code the form is not showing, but this is what it would look like:

<form name="you_form_name" onsubmit="return vaildate_user_text();">

Notice the "return vaildate_user_text();" and not just "vaildate_user_text()". The reason for this is that the form will be submitted if the return from the onsubmit event is === true (or NULL) and will not sumit if the return is === false.

Then in validate_user_text(), you'll have to make sure the object references to the form elements are correct, just like in Method 1.

The only other change is that you will not need the:

[HTML]document.form1.submit();[/HTML]

In place of it put:

[HTML]return true;[/HTML]

This return is returned to the form submit event, and will continue submitting the form.

After:
[HTML]
alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
document.form1.user_text.select();[/HTML]

Add:

[HTML]return false;[/HTML]

This will return false to the form.submit() event and thus cancel the form submission.

Hope that gets you moving forward...
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
•
•
Join Date: Oct 2005
Posts: 240
Reputation: Inny is an unknown quantity at this point 
Solved Threads: 6
Inny's Avatar
Inny Inny is offline Offline
Posting Whiz in Training

Re: Need help with Javascript

 
0
  #13
Jan 24th, 2007
OK I tried both methods! With this first method, the submit did nothing at all.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1.  
  2. <script language="JavaScript1.2">
  3. var swear_words_arr=new Array("silly","bloody","idiot","slut");
  4. var swear_alert_arr=new Array;
  5. var swear_alert_count=0;
  6.  
  7. function reset_alert_count()
  8. {
  9.  swear_alert_count=0;
  10. }
  11.  
  12. function validate_user_text()
  13. {
  14.  reset_alert_count();
  15.  var compare_text=document.REPLIER.submit();
  16.  for(var i=0; i<swear_words_arr.length; i++)
  17.  {
  18.   for(var j=0; j<(compare_text.length); j++)
  19.   {
  20.    if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase())
  21.    {
  22.     swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length));
  23.     swear_alert_count++;
  24.    }
  25.   }
  26.  }
  27.  var alert_text="";
  28.  for(var k=1; k<=swear_alert_count; k++)
  29.  {
  30.   alert_text+="\n" + "(" + k + ")  " + swear_alert_arr[k-1];
  31.  }
  32.  if(swear_alert_count>0)
  33.  {
  34.   alert("The Post cannot be submitted.\nThe following Ugly words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
  35.   document.REPLIER.user_text.select();
  36.  }
  37.  else
  38.  {
  39.   document.REPLIER.submit();
  40.  }
  41. }
  42.  
  43. function select_area()
  44. {
  45.  document.REPLIER.user_text.select();
  46. }
  47.  
  48. window.onload=reset_alert_count;
  49.  
  50. </script>
  51.  
  52. USING...
  53.  
  54. <input type='button' name='submit' value='Submit' class='forminput' tabindex="2" accesskey="s" onclick="vaildate_user_text();" /> &nbsp;


With the second method I tried, the form still submitted anyway

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <script language="JavaScript1.2">
  2. var swear_words_arr=new Array("silly","bloody","idiot","*******");
  3. var swear_alert_arr=new Array;
  4. var swear_alert_count=0;
  5.  
  6. function reset_alert_count()
  7. {
  8.  swear_alert_count=0;
  9. }
  10.  
  11. function validate_user_text()
  12. {
  13.  reset_alert_count();
  14.  var compare_text=document.REPLIER.user_text.value;
  15.  for(var i=0; i<swear_words_arr.length; i++)
  16.  {
  17.   for(var j=0; j<(compare_text.length); j++)
  18.   {
  19.    if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase())
  20.    {
  21.     swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length));
  22.     swear_alert_count++;
  23.    }
  24.   }
  25.  }
  26.  var alert_text="";
  27.  for(var k=1; k<=swear_alert_count; k++)
  28.  {
  29.   alert_text+="\n" + "(" + k + ")  " + swear_alert_arr[k-1];
  30.  }
  31.  if(swear_alert_count>0)
  32.  {
  33.   alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
  34.   document.REPLIER.user_text.select();
  35.  }
  36.  else
  37.  {
  38.   document.REPLIER.submit();
  39.  }
  40. }
  41.  
  42. function select_area()
  43. {
  44.  document.REPLIER.user_text.select();
  45. }
  46.  
  47. window.onload=reset_alert_count;
  48.  
  49. </script>
  50.  
  51. WITH FORM ALTERED TO...
  52.  
  53. <form name='REPLIER' action="{ibf.script_url}" method='post' onsubmit='return vaildate_user_text()' enctype='multipart/form-data'>
  54.  
  55.  
  56. THIS IS THE ORIGINAL
  57.  
  58. <form name='REPLIER' action="{ibf.script_url}" method='post' onSubmit='return ValidateForm()' enctype='multipart/form-data'>
Always carry a flagon of whiskey in case of snakebite and furthermore always carry a small snake.
W. C. Fields
Reply With Quote Quick reply to this message  
•
•
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Need help with Javascript

 
0
  #14
Jan 24th, 2007
•
•
•
•
Originally Posted by Inny View Post
OK I tried both methods! With this first method, the submit did nothing at all.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1.  
  2. <script language="JavaScript1.2">
  3. var swear_words_arr=new Array("silly","bloody","idiot","slut");
  4. var swear_alert_arr=new Array;
  5. var swear_alert_count=0;
  6.  
  7. function reset_alert_count()
  8. {
  9.  swear_alert_count=0;
  10. }
  11.  
  12. function validate_user_text()
  13. {
  14.  reset_alert_count();
  15.  var compare_text=document.REPLIER.submit();
  16.  for(var i=0; i<swear_words_arr.length; i++)
  17.  {
  18.   for(var j=0; j<(compare_text.length); j++)
  19.   {
  20.    if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase())
  21.    {
  22.     swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length));
  23.     swear_alert_count++;
  24.    }
  25.   }
  26.  }
  27.  var alert_text="";
  28.  for(var k=1; k<=swear_alert_count; k++)
  29.  {
  30.   alert_text+="\n" + "(" + k + ")  " + swear_alert_arr[k-1];
  31.  }
  32.  if(swear_alert_count>0)
  33.  {
  34.   alert("The Post cannot be submitted.\nThe following Ugly words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
  35.   document.REPLIER.user_text.select();
  36.  }
  37.  else
  38.  {
  39.   document.REPLIER.submit();
  40.  }
  41. }
  42.  
  43. function select_area()
  44. {
  45.  document.REPLIER.user_text.select();
  46. }
  47.  
  48. window.onload=reset_alert_count;
  49.  
  50. </script>
  51.  
  52. USING...
  53.  
  54. <input type='button' name='submit' value='Submit' class='forminput' tabindex="2" accesskey="s" onclick="vaildate_user_text();" /> &nbsp;


With the second method I tried, the form still submitted anyway

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <script language="JavaScript1.2">
  2. var swear_words_arr=new Array("silly","bloody","idiot","*******");
  3. var swear_alert_arr=new Array;
  4. var swear_alert_count=0;
  5.  
  6. function reset_alert_count()
  7. {
  8.  swear_alert_count=0;
  9. }
  10.  
  11. function validate_user_text()
  12. {
  13.  reset_alert_count();
  14.  var compare_text=document.REPLIER.user_text.value;
  15.  for(var i=0; i<swear_words_arr.length; i++)
  16.  {
  17.   for(var j=0; j<(compare_text.length); j++)
  18.   {
  19.    if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase())
  20.    {
  21.     swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length));
  22.     swear_alert_count++;
  23.    }
  24.   }
  25.  }
  26.  var alert_text="";
  27.  for(var k=1; k<=swear_alert_count; k++)
  28.  {
  29.   alert_text+="\n" + "(" + k + ")  " + swear_alert_arr[k-1];
  30.  }
  31.  if(swear_alert_count>0)
  32.  {
  33.   alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
  34.   document.REPLIER.user_text.select();
  35.  }
  36.  else
  37.  {
  38.   document.REPLIER.submit();
  39.  }
  40. }
  41.  
  42. function select_area()
  43. {
  44.  document.REPLIER.user_text.select();
  45. }
  46.  
  47. window.onload=reset_alert_count;
  48.  
  49. </script>
  50.  
  51. WITH FORM ALTERED TO...
  52.  
  53. <form name='REPLIER' action="{ibf.script_url}" method='post' onsubmit='return vaildate_user_text()' enctype='multipart/form-data'>
  54.  
  55.  
  56. THIS IS THE ORIGINAL
  57.  
  58. <form name='REPLIER' action="{ibf.script_url}" method='post' onSubmit='return ValidateForm()' enctype='multipart/form-data'>

There are 3 things I can see that can cause problems.

1) First Prob:

In the first method, the submit does nothing. This is because you have the input button named "submit".

[HTML]<input type='button' name='submit' value='Submit' class='forminput' tabindex="2" accesskey="s" onclick="vaildate_user_text();" /> [/HTML]

This overwrites the submit method of the form replacing it with the form input element. What you can do is name the form input "_submit" or something like that, it usually would not matter, unless the server side code checks for its existence (which you can also change server side).

2) Second Prob:

In method 2 you have:

[HTML] if(swear_alert_count>0)
{
alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
document.REPLIER.user_text.select();
}
else
{
document.REPLIER.submit();
}[/HTML]

This should be:

[HTML] if(swear_alert_count>0)
{
alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________");
document.REPLIER.user_text.select();
return false;
}
else
{
return true;
}[/HTML]

With method 2, you have to return either boolean TRUE or FALSE. The onsubmit() form event will carry on if you return TRUE, and thus submit for the form, or stop if you return FALSE.

I'd suggest you go with method 2. Therefore you will not need to rename the submit button, and you can control the form submission just by returning true or false.

3) Third Prob:

In method 2, the original form open tag looked like:

[HTML]<form name='REPLIER' action="{ibf.script_url}" method='post' onSubmit='return ValidateForm()' enctype='multipart/form-data'>[/HTML]

As you can see, there is already a form validation there. So if you replace it with your validation, you are bypassing the validation that was there before.

What you should do is create a new function for validation, as such:

[HTML]

function myValidateForm() {

if (!ValidateForm()) {
return false;
}

return validate_user_text();

}

[/HTML]

This new function will first check if the ValidateForm() returns FALSE. If it does, it will return false.
If ValidateForm() returns TRUE, it will return validate_user_text()'s return.

This way both functions have to return true for the form to be submitted.

You'll have to change the form opening tag to:
[HTML]
<form name='REPLIER' action="{ibf.script_url}" method='post' onSubmit='return myValidateForm()' enctype='multipart/form-data'>[/HTML]

--

A note on debugging your JS.
Since the form submit will reload the page, and you wont be able to see any errors, I suggest you put alerts in different parts of the code to see whats happening...

You can also download firebug. http://www.getfirebug.com/
Its has an awesome JS debugging platform (best In my book). You can go through the JS line by line, so see whats happening...

:cheesy:
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
•
•
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Need help with Javascript

 
0
  #15
Jan 24th, 2007
forgot to mention.

Firebug is a firefox extension. You'll need to have firefox (I believe 2.0) in order to use it.
For JS debugging, firefox give's better error codes anyways, IE error codes are very limited. Plus, firefox is used by almost 50% or so users nowdays, so you'll need to debug in firefox anyways..
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
•
•
Join Date: Oct 2005
Posts: 240
Reputation: Inny is an unknown quantity at this point 
Solved Threads: 6
Inny's Avatar
Inny Inny is offline Offline
Posting Whiz in Training

Re: Need help with Javascript

 
0
  #16
Jan 24th, 2007
Wow Your Patient! OK tried this, but form still submitted, do I need to change the submit button part?

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <script language="JavaScript1.2"> var swear_words_arr=new Array("silly","bloody","idiot","bugger"); var swear_alert_arr=new Array; var swear_alert_count=0; function reset_alert_count() { swear_alert_count=0; } function validate_user_text() { reset_alert_count(); var compare_text=document.REPLIER.user_text.value; for(var i=0; i<swear_words_arr.length; i++) { for(var j=0; j<(compare_text.length); j++) { if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase()) { swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length)); swear_alert_count++; } } } var alert_text=""; for(var k=1; k<=swear_alert_count; k++) { alert_text+="\n" + "(" + k + ") " + swear_alert_arr[k-1]; } function myValidateForm() {
  2.  
  3.    if (!ValidateForm()) {
  4.       return false;
  5.    }
  6.  
  7.    return validate_user_text();
  8.  
  9. }
  10.   if(swear_alert_count>0) { alert("The form cannot be submitted.\nThe following illegal words were found:\n_______________________________\n" + alert_text + "\n_______________________________"); document.REPLIER.user_text.select(); return false; } else { return true; } } function select_area() { document.REPLIER.user_text.select(); } window.onload=reset_alert_count; </script>
  11.  
  12.  
  13. USING
  14.  
  15. <form name='REPLIER' action="{ibf.script_url}" method='post' onSubmit='return myValidateForm()' enctype='multipart/form-data'>
Always carry a flagon of whiskey in case of snakebite and furthermore always carry a small snake.
W. C. Fields
Reply With Quote Quick reply to this message  
Reply
1 2

Quick Reply to Thread
This thread is more than three months old.
Perhaps start a new thread instead?
•
•
•
•
•
•
•
•
Message:
•
•
•
•



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



acid2 ajax ajaxcode ajaxhelp animate automatically beta box browser bug calendar captchaformproblem checkbox child class close column cookies createrange() css cursor decimal dependent design disablefirebug dom download dropdown editor element engine error events explorer ext file form forms google gwt gxt highlightedword html htmlform ie8 iframe image() images index internet java javascript jawascriptruntimeerror jquery jsf jsfile jump listbox math microsoft mimic mp4 object onmouseoutdivproblem onmouseover onreadystatechange parent pdf php player post problem progressbar rated rating regex runtime scroll search select session shopping size sql star starrating stars synchronous text textarea validation w3c web website window windowofwords windowsxp wysiwyg xml \n
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC