Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    22
    Thanks
    17
    Thanked 0 Times in 0 Posts

    on Field Test How to clear value onclick?

    Hello,
    i Have problem about clear value when ppl input data on text field
    Any idea?

    Code:
     
    <form action="http://www.packagetrackr.com/track/" method="get" name="track" target="_blank">
    <div class="form-field-error-message hidden" style="display: none; ">
    <div class="CommonEmptyTrackingNumber"></div>
    </div>
    
    <div id="track-form-tracking-number-container">
      <div id="track-form-tracking-number-inner-container" class="track-form-control-boxer"><input id="track-form-tracking-number" class="track-form-element " type="text" name="n" value="Type a tracking number" title="Type a tracking number..." onFocus="if(/^Type a tracking number...$/i.test(this.value)){this.value='';}" onBlur="if(this.value==''){this.value='Type a tracking number...';}">
      <input value="Track!" name="submit" type="submit" title="Track your package" class="track-form-submit-button sprite-master">
    </div>
    </div>
    <div id="track-form-jss-carrier-container" class="hidden" style="z-index: 1000; display: none; ">
    <div id="track-form-jss-carrier-content">
    <label id="jss-carrier-auto" class="track-form-jss-carrier-label jss-carrier-label">
    <input id="jss-carrier-auto-value" value="" type="radio" name="c" checked="checked"> <span>Auto Detect Carrier</span>
    </label>
    </div>
    </div>
    </form>

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,773
    Thanks
    55
    Thanked 518 Times in 515 Posts
    why not do the same as you do onBlur, but in reverse?
    Code:
    onFocus="if(this.value=='Type a tracking number'){this.value=''}"

  • Users who have thanked xelawho for this post:

    fscaint (04-06-2012)

  • #3
    New Coder
    Join Date
    Mar 2012
    Posts
    33
    Thanks
    6
    Thanked 1 Time in 1 Post
    i would also use

    Code:
    autocomplete="off"
    This clears Text from Input boxes on Refresh and stops Input Boxes from Saving previous inputs

  • Users who have thanked dave_UK for this post:

    fscaint (04-13-2012)

  • #4
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Your regex doesn't match the element's default value (...)

    Do it like this: onfocus="if(this.value == this.defaultValue){this.value='';}"

    From which you can work out how to code an onblur event handler that restores the original text if nothing is entered.

  • #5
    New Coder
    Join Date
    Oct 2011
    Posts
    22
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Logic Ali View Post
    Your regex doesn't match the element's default value (...)

    Do it like this: onfocus="if(this.value == this.defaultValue){this.value='';}"

    From which you can work out how to code an onblur event handler that restores the original text if nothing is entered.
    missing text / delete by accident the element's default value (...) that why the script doesn't work properly, LOL

    RESOLVED
    Last edited by fscaint; 04-13-2012 at 08:48 AM. Reason: corect text

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    HTML5 supports placeholder attribute to provide hint to the input fields.

    Code:
    <input type="text" name="n" placeholder="Type a tracking number"  />
    There are a lot of plugins out there to make this cross-browser compatible. Here's one of them:

    http://davidwalsh.name/html5-placeholder


  •  

    Posting Permissions

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