CODEWITHSUNDEEP
jquery-mobilecordova
user2484319
user2484319

Reputation:

Need search or find function in jquery mobile (phonegap)

I need to implement search functionality in my app(same as note pad control F).I have group of data i need to search whether it present on not .Data is not in list view .it in like we write some thing in note pad then we search on any work.Is this possible.? can you please tell me how to do.? please provide some example.

Upvotes: 3

Views: 461

Answers (1)

Apostolos Emmanouilidis
Apostolos Emmanouilidis

Reputation: 7197

Maybe you could use the window.find(aString, aCaseSensitive, aBackwards, aWrapAround, aWholeWord, aSearchInFrames, aShowDialog)

  • aString: The text string for which to search.
  • aCaseSensitive: Boolean value. If true, specifies a case-sensitive search.
  • aBackwards: Boolean. If true, specifies a backward search.
  • aWrapAround: Boolean. If true, specifies a wrap around search.
  • aWholeWord: Boolean. If true, specifies a whole word search.
  • aSearchInFrames: Boolean. If true, specifies a search in frames.
  • aShowDialog :Boolean. If true, specifies a show Dialog.


Example:

<!DOCTYPE html>
<html>

    <head>
        <title>jQuery Mobile Nested List</title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
        <script type="text/javascript">
        function findText (str) 
        {
            if (str === "") {
                alert ("Please enter some text to search!");
                return;
            }

            if (window.find) {
                window.find (str, false, false, true, false, true, false);
            }
        }

        $(document).on('click', '#search', function () {
            findText("blah");
        });
    </script>
    </head>

    <body>
        <div id="list-page" data-role="page">
            <div data-role="header">
                 <h1>Find Page</h1>

            </div>
            <div data-role="content">
                <label for="search-field">Text Input:</label>
                <p> blah this is a test blah this is a test blah</p>
                <input type="button" name="search" id="search" value="Search"/>
            </div> 
        </div>
    </body>

</html>

Upvotes: 2

Related Questions