text search not case sensitive

Vapor · 05-26-2005, 07:41 AM

Basscyst if you read this thread (or anyone who can fix this)

I was given the following code:

Code:

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

            <head>

                        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

                        <title></title>

                        <style type="text/css">

                                    .highlight

                                    {

                                                background-color:yellow;

                                    }

                        </style>

                        <script type="text/javascript">

                                    function searchText()

                                    {

                                                var obj1=document.getElementById('srch_str');

                                                var obj2=document.getElementById('txt');

                                                

                                                var str1=obj1.value;

                                                var str2=obj2.value;

                                                

                                                var cut=str2.split(str1);

                                                var len=cut.length;

                                                var new_str="";

                                                for(var i=0;i<len;i++)

                                                {

                                                            if(i!=len-1)

                                                            {

                                                                        new_str+=cut[i]+'<span class="highlight">'+str1+'</span>';

                                                            }

                                                            else

                                                            {

                                                                        new_str+=cut[i];

                                                            }

                                                }

                                                if(len==1)

                                                {

                                                            new_str="No Match Found!";

                                                }

                                                document.getElementById('results').innerHTML=new_str;

                                    }

                        </script>

            </head>

            <body>

                        <form>

                                    Search: <input type="text" id="srch_str" /> 

                                    <input type="button" onclick="searchText()" />

                                    <br />

                                    <textarea cols="40" rows="5" id="txt">Hello all.  I am testing a search function. It is because of this that this text is here.

                                    </textarea>

                        </form>

                        Results:

                        <div id="results">

                        </div>   

            </body>

</html>

This is a code to be able to search and highlight text within the textarea box. The only problem I run into is the fact that it is case sensitive. How can I search for TEST and still have it highligh test?

Brandoe85 · 05-26-2005, 07:55 AM

You could change the search string and text to all upper case or lower case:

Code:

var str1=obj1.value.toLowerCase();
var str2=obj2.value.toLowerCase();

Vapor · 05-26-2005, 08:01 AM

While I am here, I have another question.

How can I make is so that once I type something into the search line I can just hit enter and it will search rather then having to click on the button?

Harry Armadillo · 05-26-2005, 08:03 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title></title>
    <style type="text/css">
      .highlight {
        background-color:yellow;
        }
    </style>
    <script type="text/javascript">
      function searchText(){
        var str=document.getElementById('srch_str').value;
        var old_str=document.getElementById('txt').value;
        var regex=new RegExp('('+str+')','ig');
        
        var new_str=old_str.replace(regex,'<span class="highlight">$1</span>') ;
        if(new_str.length==old_str.length){
          new_str="No Match Found!";
          }
        document.getElementById('results').innerHTML=new_str;
        }
    </script>
  </head>
  <body>
    <form onsubmit='searchText();return false'>
      Search: <input type="text" id="srch_str" /> 
      <input type="submit" value="Find Text"/>
      <br />
      <textarea cols="40" rows="5" id="txt">Hello all.  I am testing a search function. It is because of this that this text is here.
      </textarea>
    </form>
    Results:
    <div id="results">
    </div>   
  </body>
</html>

Vapor · 05-26-2005, 08:07 AM

Brandoe85,

I don't quite get where to stick that bit of code. You see I want to make it so that if someone types Test instead of test it will still find the word test even if the first letter is capitalized, not nessacerly all caps

Vapor · 05-26-2005, 08:10 AM

thanks, that last code did work.

Thank you!