42 users online (1 members and 41 guests)  

Thread: Event Handlers


  Results 1 to 2 of 2

Related

  1. href + javascript onlick event    Forum: HTML Forum
    Replies: 4
  2. Replies: 1
  3. Event handlers in Firefox    Forum: Javascript Forum
    Replies: 2
  4. returning value from an onclick event    Forum: Javascript Forum
    Replies: 3
  5. Changing source of event    Forum: Website Scripts Forum
    Replies: 1
  1. #1
    country8960's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2008
    Posts
    2

    Unhappy Event Handlers

    Im trying to get help with this javascript code. This is what im trying to

    Create an onload event handler that displays �Please take our Customer Service Survey� in an alert box. Also include an onchange event handler to display the customer contact information when the user leaves the final text field. Complete the project with an onunload event handler that displays an alert dialog box containing the text, �We appreciate you opinions!

    Here is the code i have can someone please help me and show me where im going wrong.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <meta content="en-us" http-equiv="Content-Language" />
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title></title>
    <script type="text/javascript"></script>
    
    </head>
    
    <body onload = "changeVal()" >
    <form action="" method="POST" id="myForm" >
    <input type="text" name="myText" >
    
    <script type="text/javascript" language="JavaScript">
    s1 = new String(myForm.myText.value)
    
    function changeVal() {
         s1 = 'Please take our Customer Service Survey'    myForm.myText.value = s1.toUpperCase() 
    } 
    
    <INPUT TYPE="text" VALUE="Enter email address" NAME="userEmail" onChange=validateInput(this.value)>
    
    <script type="text/javascript" language="JavaScript">
    
    this.myForm.userEmail.focus()
    this.myForm.userEmail.select()
    
    function validateInput() {
    userInput = new String()
    userInput = this.myForm.userEmail.value
     if (userInput.match("@"))
        alert("Thanks for your interest.")
     else
        alert("Please check your email details are correct before submitting")
    }
    
    <BODY onUnload="We appreciate you opinions!()">
    
    
    </script>
    </form>
    </body>
    Last edited by vinyl-junkie; 06-21-2008 at 03:51 PM. Reason: Added code tags

  2. #2
    rangana's Avatar
    Moderator/Allstar

    Status
    Offline
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    317

    Re: Event Handlers

    First, language is a deprecated attribute. type will suffice.

    You should always close your <script> tag with its corresponding closing tag:</script>.

    You can combine all your Javascript codes and I humbly suggest in the <head> section of your page.

    There should only be one body tag, and you can not use any event handler on the same element more than once.

    YOu have called a function (validate(), changeval()), but your declaration is erroneous.

    You are referring to an elements name, but what you have is an id:
    Code:
    myForm.myText.value
    You might want to give these modification a shot:
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <meta content="en-us" http-equiv="Content-Language" />
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title></title>
    <script type="text/javascript">
    window.onload=function()
    {
    var df=document.forms[0], // Declare our form
    email=df.userEmail; // Declare the userEmail textbox
    alert('Please take our Customer Service Survey');
    //df.myText.value='Please take our Customer Service Survey';
    //You can directly add this part in the text using value attribute.
    email.onclick=function(){this.value=(this.value!='Enter email address')?this.value:'';}
    email.onchange=function()
    	{
    	if(this.value.match(/@/gi)) 
    		{
    		alert('Thanks for your interest.');
    		this.focus();
    		}
    	else
    	alert('Please check your email details are correct before submitting');
    	}
    }
    </script>
    </head>
    
    <body>
    <form action="" method="POST">
    <!--rangana removed this part since it has nothing to do with your requirements.
    <input type="text" name="myText">-->
    <INPUT TYPE="text" VALUE="Enter email address" NAME="userEmail">
    </form>
    </body>
    The code above separates your markups from JS. There might be some other issues I miss, but maybe worth a show

    And as a parting thought, Welcome to the forums.

    Hope it helps.
    Checkout my porfolio.
    Please click the button when a member helped you.
    Take time to use Forum's Search function.



Tags for this Thread