Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0
This is the forum to discuss the Wrox book Professional JavaScript for Web Developers by Nicholas C. Zakas; ISBN: 9780764579080
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0 section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old November 17th, 2005, 10:35 AM
Registered User
 
Join Date: Nov 2005
Location: , , .
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Default Prevent user input while JS executes

I have a text field that prevents non-numeric input and formats a social security number with dashes. (999-99-9999) Example is below.

I have encountered a problem where if I input a ssn (eg. "123456789") then delete the text "3-45-6" (text display is now "12789") then insert the missing numbers "3456" too quickly the numbers are in the wrong order. The display as "123-46-5789". 6 and 5 are transposed. I have tried this a number of times so I know I am not fat fingering. I must type very fast for this to happen but it does occur with regularity. If I type slower it works fine. I tried disabling the field in my reformat script, but it did not fix it.

Any ideas as to how I can prevent this from happening?

Thanks,

Matt

<html>

<script>

  function formatSSN(formName, inputName){
    //format input in 999-99-9999 format

    //reformat if a character key was entered
    if(window.event.keyCode > 47){

      inputField = eval( 'document.'+ formName +'.' + inputName );

      var ssnValue = inputField.value;

      //save caret position
      var caretPos = getCaretPosition(inputField);
      if(caretPos == 4|| caretPos == 7 || caretPos >= ssnValue.length)
        caretPos = caretPos + 1;

//**disabled input here but does not prevent bad input
//inputField.disabled = true; //prevent user input while js is executing

      //strip out any non-numeric content
      ssnValue = removeNonNumerics(ssnValue);

      //add hyphen
      ssnValue = addFormatHyphen(ssnValue);

      inputField.value = ssnValue;

//**disable attempt did not prevent error
//inputField.disabled = false;
//inputField.focus();

      //reposition the cursor if not at beginning
      if(caretPos > 1){
        setSelectionRange(inputField, caretPos, caretPos);
      }

    }
  }

  function addFormatHyphen(ssn){
    var ssnLength = ssn.length;

    //add format hyphen
    if(ssnLength > 5){
      ssn =
      (ssn.substr(0,3) + "-"+
      ssn.substr(3,2) + "-" +
      ssn.substr(5)).substr(0,11);
    }else if(ssnLength > 3){
      ssn =
      ssn.substr(0,3) + "-"+
      ssn.substr(3);
    }
    return ssn;
  }

  function removeNonNumerics(checkString){
    rExp = /[^0-9]/g;
    return checkString.replace(rExp,"");
  }

  function getCaretPosition(objTextBox){

    var objTextBox = window.event.srcElement;

    var i = objTextBox.value.length;

    if (objTextBox.createTextRange){
        objCaret = document.selection.createRange().duplicate();
        while (objCaret.parentElement()==objTextBox &&
               objCaret.move("character",1)==1) --i;
    }
    return i;
  }

  function setSelectionRange(input, selectionStart, selectionEnd) {
    if (input.setSelectionRange) {
      input.focus();
      input.setSelectionRange(selectionStart, selectionEnd);
    }
    else if (input.createTextRange) {
      var range = input.createTextRange();
      range.collapse(true);
      range.moveEnd('character', selectionEnd);
      range.moveStart('character', selectionStart);
      range.select();
    }
  }
</script>

<form name=myForm method=POST >
Social Security <input type=text name=SSN onkeyup="formatSSN('myForm', this.name)" size=11 maxlength=11 >

</form>
</html>

Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Zxml.js and input radio problem tezro BOOK: Professional Ajax ISBN: 978-0-471-77778-6 3 December 8th, 2007 05:19 PM
prevent user logon and password from saving Hughesie78 ASP.NET 2.0 Basics 1 December 6th, 2007 12:20 PM
Prevent SQL from crashing on user input arcuza Classic ASP Databases 1 April 15th, 2005 12:14 PM
"Prevent User " javauniverse Pro VB Databases 3 January 9th, 2004 05:07 PM



All times are GMT -4. The time now is 01:53 AM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.