Как я могу получить searchValue из окна фильтра jquery-mobile? - PullRequest
Новая
       1

Как я могу получить searchValue из окна фильтра jquery-mobile?

2 голосов
/ 31 января 2012

Если ни одно из элементов не соответствует searchValue, я хочу добавить это searchValue в список.

Мой план состоит в том, чтобы каким-то образом отслеживать, когда видимые совпадения становятся равными 0, а затем получить значение в поле фильтра.

Вот мой тестовый код (в нем есть все, что нужно для запуска). Я неправильно понял часть функции обратного вызова. (почерпнуто из http://jquerymobile.com/test/docs/lists/docs-lists.html)

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.css" />
    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>   
    <script>
    $('#thelists').live('pageinit', function(event) {
        $('body').on('click', "#getdata", function (e) { 
            e.stopImmediatePropagation();
            e.preventDefault();
            visib = $("#mylist li:visible").length;
            console.log('list has ' + visib +  ' elements left');
            $("#mylist").listview('option', 'filterCallback', myFilterFunction);
        });   
        function myFilterFunction( text, searchValue ){
            console.log('Searching for ' + searchValue);
            return text.toLowerCase().indexOf( searchValue ) === -1;
        };
    });
    </script>               
</head>
<body>
    <div id="thelists" data-role="page">

        <div data-role="header">
            <h1>My Title</h1>
        </div><!-- /header -->       
        <div data-role="content">   
            <a href="index.html" id="getdata" data-role="button">getSearchTxt</a>
            <div class="content-primary">   
                <ul id="mylist" data-role="listview" data-filter="true">
                    <li><a href="index.html">Acura</a></li>
                    <li><a href="index.html">Audi</a></li>
                    <li><a href="index.html">Aukervile</a></li>
                    <li><a href="index.html">Auadillac</a></li>
                    <li><a href="index.html">Chrysler</a></li>
                    <li><a href="index.html">Dodge</a></li>
                    <li><a href="index.html">Ferrari</a></li>
                    <li><a href="index.html">Foraud</a></li>
                    <li><a href="index.html">GMC</a></li>
                    <li><a href="index.html">Honda</a></li>
                    <li><a href="index.html">Hyundai</a></li>
                    <li><a href="index.html">Infiniti</a></li>
                    <li><a href="index.html">Jeep</a></li>
                    <li><a href="index.html">Kia</a></li>
                </ul>
            </div>
        </div><!-- /content -->
    </div><!-- /page -->
</body>
</html>

1 Ответ

5 голосов
/ 01 февраля 2012

Попробуйте:

JS 

$("input[data-type='search']").keyup(function() {
    var optCount = $("#mylist > li:visible").size();

    if(optCount < 1) {
        alert('Value: '+$(this).val()); 
    }
});
...