Search code examples
jquery-mobileinputjquery-mobile-listview

How to set data-filter-placeholder/equivalent with jquery mobile 1.4+


I cannot find anything really about this: I want to pre- populate the filter- field in jqm 1.4 on a listview. One used to do that via data-filter-placeholder, which is depreceated. What am I supposed to use then?

<form class="ui-filterable"><input id="filterBasic-input" data-type="search"></form>
    <ul data-role="listview" class="ui-listview-outer" data-filter="true" data-input="#filterBasic-input">
....
....

with the above example I can filter fine, but where do I pre-populate the filter?


Solution

  • If you are defining your own <input> for the filterable object, just define a placeholder right on the input:

    <form class="ui-filterable">
        <input id="filterBasic-input" data-type="search" placeholder="find cars" />
    </form>
    <ul data-role="listview" data-filter="true" data-input="#filterBasic-input">
        <li>Acura</li>
        <li>Audi</li>
        <li>BMW</li>
        <li>Cadillac</li>
        <li>Ferrari</li>
    </ul>