SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Trim Comma from form field

    i want to trim a comma out of a string and everything after it.
    I have a search form that you enter in city, state in one field, but on submission i want to clear everthing after the comma


    Code:
    var trimmed = str.replace(/^\s+|\s+$/g, '') ;
    I am doing this because i am search two seprate tables that have city and state designated diffrently

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    To get everything before the comma you can use str.substr(0, str.search(','))

    If you're wanting the parts before and after the comma, you should split on the comma, trim both parts then use those.

    If so then, you'd be using something like this:

    Code javascript:
    var splitStr = str.split(',');
    var partStr = '';
    for (var i = 0; i < splitStr.length; i++) {
        splitStr[i] = splitStr[i].replace(/^\s+|\s+$/g, '') ;
    }
    var city = splitStr[0];
    var state = splitStr[1];
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul
    I am not sure if it will work, I will give it a try. What i do want to keep is the city name but still pass the city in a hidden field.

    Code:
    function split() {
    var string = document.getElementById["city"].value; 
     var splitStr = str.split(',');
     var partStr = ''; 
    for (var i = 0; i < splitStr.length; i++) {
     splitStr[i] = splitStr[i].replace(/^\s+|\s+$/g, '') ; 
    }
     var city = splitStr[0];
     var state = splitStr[1]; 
     document.getElementById["cityname"].value = city; 
    }
    I want to still pass city to the hidden field

    Here is a link to where i am working
    http://dev.mylocallookup.com/listing/

    Enter in the information to the bottom field and the field about that should get the city name

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Are you taking care of these issues on the server side as well?
    You must not presume that the form information will be processed by javascript before it's served to the server.

    In several cases the form information will be sent to the server with javascript being turned off.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is my form that i am working with.

    Code:
    <script type="text/javascript">
    
    function split() {
    var str = document.getElementById["city"].value;
    
    var splitStr = str.split(',');
    var partStr = '';
    for (var i = 0; i < splitStr.length; i++)
    {
    splitStr[i] = splitStr[i].replace(/^\s+|\s+$/g, '') ;
    }
    var city = splitStr[0];
    var state = splitStr[1];
    
    document.getElementById["cityname"].value = city;
    }
    
    </script> 
    
    
    <form id="form1" name="form1" method="get" action="/listing/results.php">
    <p class="standardTitle">lookup <span>Business</span></p>
    <dl class="simpleSearch">
    <dt class="label">Keyword:</dt> 
    <input name="page" type="hidden" id="page" value="search" />                   
    <dd><input name="keyword" type="text" class="searchtext" id="keyword" value="<?=$keyword;?>"/></dd>
    
    <dt class="label">City, State or Zip Code:</dt>
    <dd><input name="city" type="text" class="searchtext2" id="city" value="<?=$city;?>" onChange="split()" /></dd>
    <dt class="label">Test Field: "where city will go"</dt>
    <dd><input type='text' name='cityname' id='cityname' value=''></dd>
    <dd>
    <ul class="standardButton">
    <li><input name="act" type="submit" class="searchbutton" id="button" value="search" /> </li>
    <li class="buttonSpace">&nbsp;</li>
    <li><a href="javascript:void(0);" onClick="searchReset();">Clear</a></li>
    </ul>
    </dd>
    </dl>
    </form>

  6. #6
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Almost got it working

    I almost got this working

    here is where I am, I am still getting exactly what i type in the city and state field of this form put into the hidden field.

    this is the link to what is doing and this code is what i have for the script.

    Code:
    <script Language = JavaScript>
    function justcity() {
    
    	fname = document.form1.city.value
    	SplitName = fname.split(",")
    	first = SplitName[0]
    	second = SplitName[1]
    	
    	first1 = first.substring(0, 1)
    	second2 = second.substring(1, first.length) 
    	
    
    
    	document.form1.cityname.value = fname
    }
    
    </script>
    i still can not strip our the , and state

    here is the form

    Code:
    <form id="form1" name="form1" method="get" action="/listing/results.php">
    <p class="standardTitle">lookup <span>Business</span></p>
    
    <dl class="simpleSearch">
    
    <dt class="label">Keyword:</dt> 
    <input name="page" type="hidden" id="page" value="search" />                   
    <dd><input name="keyword" type="text" class="searchtext" id="keyword" value="<?=$keyword;?>"/></dd>
    
    <dt class="label">City, State or Zip Code:</dt>
    <dd><input name="city" type="text" class="searchtext2" id="city" value="<?=$city;?>" onChange="justcity()" /></dd>
    
    <dt class="label">Hidden Field: "city here"</dt>
    <dd><input type='text' name='cityname' id='cityname' value=''></dd>
    
        <dd>
        <ul class="standardButton">
        <li><input name="act" type="submit" class="searchbutton" id="button" value="search" /> </li>
        <li class="buttonSpace">&nbsp;</li>
        <li><a href="javascript:void(0);" onClick="searchReset();">Clear</a></li>
        </ul>
        </dd>
    </dl>
    </form>
    link to project
    http://dev.mylocallookup.com/listing/
    Last edited by gonzorevup; Apr 28, 2008 at 21:27. Reason: added Link

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Look at the following line

    Code javascript:
    document.form1.cityname.value = fname

    fname is the original field before it was split.
    You need to assign a different variable to the value.

    After fname is split, why are you doing the substring stuff?
    Are you wanting to remove a leading space from the state?

    Such a technique might work if someone types in "California, LA" but what happens when they type "California,LA" instead?

    We should protect the user from their own mistakes. The best way to do this is to trim off any spaces from the start and the end of the word.

    Wer need some kind of trim() function, and Douglas Crockford has a very nice method for us at http://javascript.crockford.com/remedial.html which takes care of this for us.

    Run this code before any other javascript that might want a trim function.

    Code javascript:
    String.prototype.trim = function () {
        return this.replace(/^\s+|\s+$/g, "");
    };

    Now it becomes easy to trim strings.

    Code javascript:
    first = SplitName[0].trim();
    second = SplitName[1].trim();

    And you can then assign the second value to the hidden value field.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thanks

    Thanks Paul for the info and input. Thanks to everyone that helped. I will be sure to add that code into what i am doing. thanks again


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
  •