Having trouble with alert in javascript

gggadepa · Nov 10, 2008

Code:

<script language="javascript">
function validation()
{  

   var email=document.form.email.value 
   var filter=/^.+@.+\..{2,7}$/
   var valid = true;
   if(document.form.email.value==') 
   {
	   setTimeout('window.alert('Please enter your email address!')',1250);
       document.form.email.focus();
       document.form.email.select();
       valid = false;
   }
   else if(!(document.form.email.value=='))
   {
       if(!filter.test(document.form.email.value))
       {
           setTimeout('alert('Please input a valid email address!')',1250);
           document.form.email.focus();
           document.form.email.select();
           valid= false;
         }
   }
}
</script>

This is the code I am trying to run from my .jsp file. This function is being called onClick() of the "Send" button. But the problem is this function is never called and the cursor does not stop at the email field after the alert. It just continues and I am not able to see the alert message. Somebody please give some suggestion. I have tried many things but no luck,

Thanks
gayatri

tsuji · Nov 10, 2008

[1] Prima facie.
>setTimeout('window.alert('Please enter your email address!')',1250);
[tt]setTimeout('window.alert([red]"[/red]Please enter your email address![red]"[/red])',1250);[/tt]
>setTimeout('alert('Please input a valid email address!')',1250);
[tt]setTimeout('alert([red]"[/red]Please input a valid email address![red]"[/red])',1250);[/tt]

[1.1] window.alert() and alert() would be the same, one way or other, if you want a consistent look.

[2] If you name the form element "form", it is better to name it something else. In special cirumstances, document.form might cause trouble.

gggadepa · Nov 11, 2008

Hello,

I tried this suggestion. But still I have trouble. I am adding my complete code here.This file is called demographic.jsp

Please tell me if you find something else that is wrong here,

thanks
gayatri

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Userstudy.com</title>
<!-- TemplateBeginEditable name="doctitle" -->
<title>Validate login</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link REL="./favicon.ico">

	
<script>
function backButtonOverride()
{
  // Work around a Safari bug
  // that sometimes produces a blank page
  setTimeout("backButtonOverrideBody()", 1);

}

function backButtonOverrideBody()
{
  // Works if we backed up to get here
  try {
    history.forward();
  } catch (e) {
    // OK to ignore
  }
  // Every quarter-second, try again. The only
  // guaranteed method for Opera, Firefox,
  // and Safari, which don't always call
  // onLoad but *do* resume any timers when
  // returning to a page
  setTimeout("backButtonOverrideBody()", 500);
}
</script>
<Script language = "javascript">
function setValue(){
     <% String logname = (String)session.getAttribute("logname"); %>
     var logname = "<%=logname%>";
     document.usform.logname.value = logname;
}

</script>

<script language="javascript">


function validation()
{  

   var email=document.usform.email.value 
   var filter=/^.+@.+\..{2,7}$/
   var valid = true;
   if(document.usform.email.value==') 
   {
	   setTimeout('window.alert("Please enter your email address!")',1250);
       document.usform.email.focus();
       document.usform.email.select();
       valid = false;
   }
   else if(!(document.usform.email.value=='))
   {
       if(!filter.test(document.usform.email.value))
       {
           setTimeout('alert("Please input a valid email address!")',1250);
           document.usform.email.focus();
           document.usform.email.select();
           valid= false;
         }
   }
   var col = document.getElementsByName('age')
    for (var i = 0 ; i < col.length ; i++) {
        var el = col[i];
        if (el.type == 'radio' && el.checked) {
             
                 document.usform.age.value = cols[i].value;
                 setTimeout(' alert("Please choose one")',1250);      
           valid = false;     
         }
                
    }
   var col = document.getElementsByName('gender')
    for (var i = 0 ; i < col.length ; i++) {
        var el = col[i];
        if (el.type == 'radio' && el.checked) {
          
                 document.usform.gender.value = cols[i].value;
                 setTimeout('alert("Please choose one")',1250);      
                valid=false;          
         }
    }
   
   var major=document.usform.major.value;
   if(document.usform.major.value==') 
   {
	   setTimeout('alert("Please enter your major.")',1250);
       document.usform.major.focus();
       document.usform.major.select();
       valid = false;
   } 
   var specialization=document.usform.specialization.value;
   if(document.usform.specialization.value==') 
   {
	   setTimeout('alert("Please enter your specialization.")',1250);
       document.usform.specialization.focus();
       document.usform.specialization.select();
       valid=false;
   } 
   var yearofstudy=document.usform.yearofstudy.value;
   if(document.usform.yearofstudy.value=') 
   {
	   setTimeout('alert("Please enter your year of study.")',1250);
       document.usform.yearofstudy.focus();
       document.usform.yearofstudy.select();
       valid false;
   } 
   var howfound=document.usform.howfound.value;
   if(document.usform.howfound.value==') 
   {
	   setTimeout('alert("Please enter details.")',1250);
       document.usform.howfound.focus();
       document.usform.howfound.select();
       valid=false;
   } 
   var col = document.getElementsByName('socialtagging')
    for (var i = 0 ; i < col.length ; i++) {
        var el = col[i];
        if (el.type == 'radio' && el.checked) {
             
                 document.usform.socialtagging.value = cols[i].value;
                 setTimeout('alert("Please choose one")',1250);
                 valid=false;
                    
         }
    }
   var col = document.getElementsByName('numbookmarks')
    for (var i = 0 ; i < col.length ; i++) {
        var el = col[i];
        if (el.type == 'radio' && el.checked) {
             
                 document.usform.numbookmarks.value = cols[i].value;
                 setTimeout('alert("Please choose one")',1250);
                 valid=false;
                     
         }
    }
   var keywords=document.usform.keywords.value;
   if(document.usform.keywords.value==') 
   {
	   setTimeout('alert("Please enter details.")',1250);
       document.usform.keywords.focus();
       document.usform.keywords.select();
       valid= false;  
   } 
  return valid;
  
}	    

</script>



</head>
<body onLoad="backButtonOverride();setValue();"  >


<div align="center">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
	<tr>
		<td></td>
		<td align="right" nowrap="nowrap"><font size="2" face="arial, helvetica, 'sans serif'">
			
				  	<a href="/Userstudy/gnizr.doc">Help</a>
                                        <a href="/Userstudy/tutorial.html">Tutorial</a>
				
          </font>
				
					</td>
	</tr>
</table>
</table><table border="0" width="100%" cellspacing="0" cellpadding="0" height="87">
	<tr>
         <td align="center" bgcolor="#FFFFFF" nowrap valign="top" width="287">
         <p align="center"><a><img border="0" src="fallcolors.jpg" align="center" width = "1200" height ="400" ALT="Welcome to User Study"></a></td>

         <td align="center" bgcolor="#FFFFFF" nowrap valign="top" width="189">&nbsp;</td>
         <td align="center" bgcolor="#FFFFFF" nowrap valign="top" width="67">&nbsp;</td>
         <td align="center" bgcolor="#FFFFFF" nowrap valign="top" width="181">
           &nbsp;</td>
       </tr>
		
			</table>
		


</div>
<div align="center"><font color="#000000"><font color="#FF0000" face="ARIAL, HELVETICA">*<em> 
  </em></font><em><font color="#FF0000"> <font color="#000000" size="4">Information 
  required</font></font></em></font></div>
<FORM action="checkdemographic.jsp"  name="usform"  method="post">
<input type=hidden value="0">
<input type="hidden"  name="ID">


  <table border="0" align="left" cellpadding="5" cellspacing="1">
    <tr> 
      <td width="55"><font color="#FF0000">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        *</font></td> 
      <td colspan="2">Login ID</td> 
      <td width="216"> <input name="logname" type="text"  id="logname"    disabled size="6" maxlength="6">
      </td>
    </tr>  
    <tr> 
      <td width="55"><div align="right">&nbsp;</div></td>
      <td colspan="2"><div align="left">(Login ID cannot be changed)</div></td>
      <td width="216"> <div align="left"> 
          &nbsp;
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"><div align="left">Email </div></td>
      <td> <div align="left"> 
          <input name="email" type="text"  id="email" size="35" maxlength="35">
        </div></td>
    </tr>
     <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"><div align="left">Phone </div></td>
      <td> <div align="left"> 
          <input name="phone" type="text"  id="phone" size="10" maxlength="10">
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Age</div></td>
      <td> <div align="left"> 
         <input type="radio"   name = "age"  value="17-27">17-27
         <input type="radio"   name = "age"  value="28-38">28-38
         <input type="radio"   name = "age" value="Over 38" checked >Over 38<br />
     </div></td>
    </tr>
   
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Gender</div></td>
      <td> <div align="left"> 
         <input type="radio"  name = "gender" value="Male">Male
         <input type="radio"  name ="gender" value="Female" checked>Female<br />
        
              </div></td>
        <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"><div align="left">Major</div></td>
      <td> <div align="left"> 
          <input name="major" type="text"  id="major" size="20" maxlength="20">
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Specialization</div></td>
      <td> <div align="left"> 
          <input name="specialization" type="text" id="specialization" size="25" maxlength="25">
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Year of Study</div></td>
      <td> <div align="left"> 
          <input name="yearofstudy" type="text"  id="yearofstudy" size="10" maxlength="10">
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">How do you find information about your areas of professional interest ?</div></td>
      <td> <div align="left"> 
          <textarea name="howfound"  cols="20" rows="5" id="howfound" ></textarea>
        </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Do you use social tagging systems ?</div></td>
      <td> <div align="left"> 
         <input type="radio"  name = "socialtagging" value="Delicious">Delicious
         <input type="radio"  name= "socialtagging"" value="Digg">Digg
         <input type="radio"  name = "socialtagging" value="Other">Other
          <input type="radio" name = "socialtagging" value="None">None
         <input type="radio"  name = "socialtagging" value="All" checked>All<br/>
       </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">How many pages do you bookmark in  a week ? ?</div></td>
      <td> <div align="left"> 
         <input type="radio" "   name="numbookmarks" value="0-5">0-5
         <input type="radio"    name="numbookmarks" value="5-10">5-10
         <input type="radio"   name="numbookmarks" value="Over 10" checked >over 10<br />
          </div></td>
    </tr>
    <tr> 
      <td><div align="right"><font color="#FF0000">*</font></div></td>
      <td colspan="2"> <div align="left">Keywords that describe your area of interest ?</div></td>
      <td> <div align="left"> 
          <textarea name="keywords" cols="20" rows="5" id="keywords" ></textarea>
        </div></td>
    </tr>
      
    <tr> 
      <td height="34">&nbsp;</td>
      <TD width="161" align=right vAlign=center><div align="right"><font size="2" face="Verdana"> 
          <input name=Send type="submit" value=Send  onclick="validation();alert('Do you want to save ?');" >
          </font></div></TD>
      <TD width="18" align=right vAlign=center>&nbsp;</TD>
      <TD vAlign=top><div align="left"><font size="2" face="Verdana"> 
          <input name=reset type=reset value=Reset>
          </font></div></TD>
    </TR>
  </TABLE>
  <table>
    <tr> 
      <td>&nbsp;</td>
    </tr>
    <tr> 
      <td>&nbsp;</td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <P align=center><font size="2" face="Verdana"> </font></P>
</FORM>
<font size="2" face="Verdana"> </font>
</body>
<br><br><br><br>
<br><br><br><br><br>
<br><br><br><br><br>
<br><br><br><br><br>
<br><br><br><br><br>
<br><br><br><br><br>
<br>
<table border="0" width="120" align="center" cellpadding="4" cellspacing="0" height="20">
        <tr>
          <td align="right" valign="top" nowrap height="12">
            <p align="center">
            <font face="Verdana, Arial, Helvetica" size="1">Copyright ©2008, 
            </font></td>
        </tr>
      </table>

<br><br><br>
</html>

tsuji · Nov 11, 2008

[3]
><input name=Send type="submit" value=Send onclick="validation();alert('Do you want to save ?');" >
[tt]<input name="Send" type="submit" value="Send" onclick="[red]return[/red] validation();">[/tt]

[3.1] I am not sure what you want on the alert('Do you want to save ?'). It seems oddly placed. I take it out for the moment. If you want to let user to have a second-thought before submit, use confirm() and again capture the return.

[4] Since each element non-validated is enough to make the whole invalidated, you should add early exit by the return statement. Like this for a sample block.
[tt]
if(document.usform.email.value==')
{
setTimeout('window.alert("Please enter your email address!")',1250);
document.usform.email.focus();
document.usform.email.select();
valid = false;
[blue]return valid;[/blue] //or simply return false;
}
else [red]//[/red]~~if(!(document.usform.email.value=='))~~ //seems needless
{
if(!filter.test(document.usform.email.value))
{
setTimeout('alert("Please input a valid email address!")',1250);
document.usform.email.focus();
document.usform.email.select();
valid= false;
[blue]return valid;[/blue]
}
}
[/tt]

tsuji · Nov 11, 2008

[5] Also I see now that everywhere your [tt]==''[/tt] is actually typed [tt]==[highlight]'[/highlight][/tt] which of course is wrong.

gggadepa · Nov 11, 2008

Hello,
Thanks for your reply.
I removed the alert('do you want to save'). Changed it to return validation and also included return false at the end of every field validation on the form. But still it does not work. I even tried removing the backbutton() script. No matter what these changes are , I am still not able to get the form to pause and resume at the field where the error occurred.
Thanks
gayatri

tsuji · Nov 11, 2008

[6] Generally check for typos, balance of quotes etc. Such as this line?
>[tt]<input type="radio"[highlight] " [/highlight] name="numbookmarks" value="0-5">0-5[/tt]
Otherwise, I think now, scriptwise, the mechanic of validation/submit should be properly in place in the large.

gggadepa · Nov 11, 2008

Hello,

I am having the same trouble with alert on another form too. Basically the alert message does not work when called in a js function. I double checked the script for missing quotes or extra quotes. Again I tried but it does not work. I have tried the same script in IE. I am having the same problem. You say the form should work but it does not

Any more suggestions please ?

Thanks
gayatri

LyndonOHRC · Nov 11, 2008

if(document.usform.email.value==')
should be if(document.usform.email.value=='')

Lyndon

---People Remember about 10% of what you say ---They never forget how you made them feel. Covey

tsuji · Nov 11, 2008

[7] All the radio parts.
>document.usform.gender.value = cols[[ignore]i[/ignore]].value;
[tt]document.usform.gender.value = co[highlight]l[/highlight].value;[/tt]

Or the right-hand-side simply
[tt] =el.value[/tt]

[7.1] In any case, the logic is incorrect. If something is checked, you ask them to choose!

ps We are not here to discover your typos. Do your part thoroughly.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Having trouble with alert in javascript

gggadepa

IS-IT--Management

tsuji

Technical User

gggadepa

IS-IT--Management

tsuji

Technical User

tsuji

Technical User

gggadepa

IS-IT--Management

tsuji

Technical User

gggadepa

IS-IT--Management

LyndonOHRC

Programmer

tsuji

Technical User

Similar threads

Part and Inventory Search

Sponsor