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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Nov 2012
    Location
    Spokane, WA
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Format phone number from URL parameter

    I have a URL parameter that reads:

    file:///H:/2-University%20of%20Phoenix/4-Class/WEB-238%20Javascript%201/Extras/vrf_ack.html?name1=Jane&name2=Doe&number=1231231234&email=janedoe@gmail.com&cPart1=dodge&cPart2=dura ngo&license=WSP1234&year=1233&state=WA&submit=Submit+Form

    This is created by a separate HTML form on a different page, so the values can change per user input.

    I have the following code, in the body section, that reads and displays the parameter names and values on the second page:

    Code:
    	<script language="javascript">
    		function getUrlVars() {
        		var vars = {};
       			var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
            	vars[key] = value;
      			});
        		return vars;
    		}
    
    			var name1 = getUrlVars()["name1"];
    			var name2 = getUrlVars()["name2"];
    			var number = getUrlVars()["number"];
    			var email = getUrlVars()["email"];
    			var cPart1 = getUrlVars()["cPart1"];
    			var cPart2 = getUrlVars()["cPart2"];
    			var license = getUrlVars()["license"];
    			var year = getUrlVars()["year"];
    			var state = getUrlVars()["state"];
    						
    		document.write("Name: ");
    		document.write(name1 + ' ' + name2);
    		document.write("<br>Phone Number: ");
    		document.write(number);
    		document.write("<br>Email: ");
    		document.write(email);
    		document.write("<br>Vehicle: ");
    		document.write(cPart1 + ' ' + cPart2);
    		document.write("<br>License Plate: ");
    		document.write(license);
    		document.write("<br>Year: ");
    		document.write(year);
    		document.write("<br>State: ");
    		document.write(state);
    	</script>
    I have tried 4 or 5 different ways to format the phone number value. It can be easy with just dashes (###-###-####), I just don't like the display of it all smashed together (1231231234). Any help would be great.

    I have also tried formatting the form field on the first page and had it work there but when the values are read and displayed, wonky symbols are shown.

    I don't really know where to go from here. I'm new to creating my own javascripts and not really sure where to go from here.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,597
    Thanks
    80
    Thanked 4,633 Times in 4,595 Posts
    Well, first of all, why are you using document.write( )?? It is considered badly obsolete, you know.

    BUt the formatting is trivial:
    Code:
          var number = getUrlVars()["number"];
          // first, make sure it really is all digits:
          number = number.replace(/\D/g,"");
          // then make sure it 10 digits long:
          number =  "0000000000" + number;
          number = number.substring( 0, 10 );
          // and then format it:
          number = "(" + number.substring(0,3) + ") " + number.substring(3,7) + "-" + number.substring(7);
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,597
    Thanks
    80
    Thanked 4,633 Times in 4,595 Posts
    Your code is braindead because it converts the query stirng to an array ONCE FOR EACH NAME! NO NO NO!

    You should have done:
    Code:
        var vars = getUrlVars(); // ONE TIME!
        var number = vars["number"];
        var firstName = vars["firstname"]; 
        ... etc. ...
    But that's still not good, because Your way of getting values from the querystring has a fatal flaw: If any of the values have encoded characters, your code will LEAVE them encoded. As you yourself noted: "...when the values are read and displayed, wonky symbols are shown.."

    Here's a way to do it that makes sure the values are properly decoded:
    Code:
        var vars = [ ];
        var pairs = location.search.substring(1).split("&");
        for ( var p = 0; p < pairs.length;  ++p )
        {
            var pair = pairs[p].split("=");
            vars[ pair[0].toLowerCase() ] = decodeURIComponent( pair[1] );
        }
    And now you can do
    Code:
        var license = vars["license"];
    and it will be right even if the license is something like A/37 G:5 (the / and space and : would be encoded in the querystring).
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    New to the CF scene
    Join Date
    Nov 2012
    Location
    Spokane, WA
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thanks!

    Thanks for the quick reply and the help. I knew it was something simple but I couldn't figure out the structure of it. Thanks again for your help.


  •  

    Tags for this Thread

    Posting Permissions

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