www.webdeveloper.com
Results 1 to 6 of 6

Thread: indexOf: search for multiple terms in a string.

Hybrid View

  1. #1
    Join Date
    Mar 2013
    Posts
    2

    indexOf: search for multiple terms in a string.

    Hello everybody,

    I've come across a point from which I am unable to think further.
    Briefly, I have a 'ul' with lots of 'li', each having tens of words as text; at the very top of the list I have put for the user an input box where one could type maybe two or three words to search for; let's say, for example, that I want to filter out from that huge list only the lines where the following three words exist in the same line: "red sweet strawberries". Being hit the search button, the lines are filtered out and there I have only two rows containing the words I am interested in.

    li1: "I hardly wait to eat some red sweet strawberries"
    li2: "It is summer and the red sweet strawberries are fresh now"

    Until this point everything is fine.

    The problem occurs when the three looked up words are separated by other words or characters along the string.
    So, taken the upper example, unfortunately the filter would never show me the following line:

    li3: "The red and sweet strawberries are on the market now"

    So, here I lay down the entire function that filter and sort out the results from the upper example:
    HTML Code:
    <script type="text/javascript">
    $(document).ready(function() {
          var links = new Array();
          $("h4").each(function(index, element) {
    	  links.push({
                text: $(this).text(),
                element: element
            });
        });
    	
    	$("#searchbutton").click(function() {
            var query = $("#inputtext").val();
            var querywords = query.split(',');
    		
    		var results = new Array();
            for(var i = 0; i < querytext.length; i++) {
                for(var j = 0; j < links.length; j++) {
                    if (links[j].text.toLowerCase().indexOf(querywords[i].toLowerCase()) > -1) {
                        results.push(links[j].element);                    
                        }
                }
            }
    		
    		$("h4").each(function(index, element) {
                this.style.display = 'none';
            });
    		for(var i = 0; i < results.length; i++) {
                results[i].style.display = 'block';
            }
    		
    	});     
    
    });
    </script>
    So, is it possible to search for multiple sub-strings and still return the line containing them even if the sub-strings are separated by characters or other words.

    Thanks and Regards

  2. #2
    Join Date
    Mar 2011
    Posts
    1,156
    I'd take a different approach. I'd split the links[].text into individual words, and then check each word found for matches with the user's query. That way you'd eliminate the false positives if your links[].text contained something like:

    "Freda's lips were sweeter than strawberries."

    On a good day, I'd construct a regular expression... but I'm not very good at it. Maybe someone else can chime in with a good idea.

  3. #3
    Join Date
    Mar 2013
    Posts
    2
    Yes. The only solution to my question is indeed the RegEx object. Regular expression are a more bit strange for my knowledge. I was lucky to find the perfect work around for my issue on here.

    Hopefully everybody looking for this answers would find the link useful.

    Regards

  4. #4
    Join Date
    Feb 2008
    Posts
    5
    I think the key you're looking for in a regex is '.+' - put that between the terms that you want to see in order, i.e.

    Code:
    // these are the test strings
    var test = 'this is the test';
    var test2 = 'this is another test';
    var test3 = 'this one will fail';
    
    // this is the regular expression
    var regex = /this.+is.+test/i;
    
    // here's the tests!
    alert(regex.test(test));
    alert(regex.test(test2));
    alert(regex.test(test3));
    This looks for the the strings 'this', 'is', and 'test' in that order in each of those strings - the third fails because it only has the first term.

  5. #5
    Join Date
    Feb 2013
    Posts
    46
    Here, I think, is what you want:
    http://jsfiddle.net/8Fd2x/

    It can use some simplifying and optimization..

  6. #6
    Join Date
    Feb 2013
    Posts
    46
    Here, I think, is what you want:
    http://jsfiddle.net/9PkZR/
    It separates words by spaces or commas, and removes any chars besides letters/numbers/spaces/commas before searching.
    It can use some simplifying and optimization..

    Here's an experimental version that allows regex search- and search queries separated by spaces or commas.
    http://jsfiddle.net/Xfr5r/
    The difference is, it doesn't remove any characters- making it possible to inject regex. This can be useful, and since the user can inject JS anyway, it's not -that- dangerous.. I mean, it can yield errors or unwanted results, but it'll still work via trial/error... This is triggerred on key-press, for large lists optimize by creating a click event instead.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

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
  •  
HTML5 Development Center



Recent Articles