SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Evangelist jplush76's Avatar
    Join Date
    Nov 2003
    Location
    Los Angeles, CA
    Posts
    460
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Event Handler Question - OnChange

    hey guys,
    just trying to wrap my head around javascript this week and came across something I need some help with understanding.

    lets say I have a simple script:

    HTML Code:
    <form name="jim">
    name: <input type="text" name="fname" size="10" onChange="alert('hi');">
    
    <a href="#" onClick="document.jim.fname.value='jim';"> CLICK ME! </a>
    
    
    </form>
    now what that does... when you click on the CLICK ME link it puts the string "jim" in the text box's value field.

    well what I'm trying to figure out is when the string gets the value "jim" or whatever I want the alert box to come up.

    so the flow would be: user clicks link, value of text field is now "jim", since the text field went from blank to now holding "jim" pop up the alert box.

    I've tried every event type I could find but it doesn't seem to work. am I missing something? I realize that changing the value doesn't really mean its an event so to say.

    thanks~!

  2. #2
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry for the late reply, but I was unsure about your question. Let me suggest another solution. I'm assuming that your requirements are:

    1) for an input's value to be changed either by the user or by script
    2) for the value to be validated after being changed by the user or by script

    One solution is to always call a certain function to change the value of the input instead of directly referencing the input in the onclick code. This function can also do the validation. Below, validate() performs two actions:

    1) changes the input's value if sNewValue is present
    2) validates the input's current value

    Code:
    <html>
    <head>
    <script>
    function validate(sForm, sInput, sNewValue)
    {
      var
        bValid = true,
        oInput = document.forms[sForm].elements[sInput];
      
      // Change input's value if sNewValue is defined
      if (typeof(sNewValue) != 'undefined') {
        oInput.value = sNewValue;
      }
      // Validate the value
      var val = oInput.value;
      if (val.indexOf('jim') != -1) {
        bValid = false;
        alert("'jim' is a reserved word");
      }
      // And return the result
      return bValid; 
    }
    </script>
    </head>
    <body>
    
    <form name="jim">
    name: <input type="text" name="fname" onchange="return validate(this.form.name, this.name)">
    </form>
    <a href="#" onclick="validate('jim','fname','jim');return false">change value via js</a>
    
    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •