[SOLVED] While searching type in English but populate result in Devanagari Unicode?

While searching type in English but populate result in Devanagari Unicode?

I am designing a local business listing mobile web app with Framework7. I am populating Listview with MySQL fetched JSon data in Devanagari Unicode format.

Now If any user need to search this list view, what I want to achieve is how can I let user search by typing in English but result in listview should populate in Devanagari Unicode. How can I do this with JQuery? I am not getting logic. Please suggest.

e.g. If user searches 'Mill' -> listview result should 'मिल'.

Solution

In jQuery Mobile, the filterable widget can use a data attribute (data-filtertext) on the lisitems. It then filters based on the text of the data attribute instead of the listitem inner text. So for your situation, include the English text in the data-filtertext attribute:

<form class="ui-filterable">
    <input id="filterBasic-input" data-type="search" />
</form>
<ul data-role="listview" data-inset="true" data-filter="true" data-input="#filterBasic-input">
    <li data-filtertext="mill">मिल</li>
    <li data-filtertext="factory">कारखाना</li>
    <li data-filtertext="train">ट्रेन</li>
    <li data-filtertext="ship">जहाज</li>
</ul>

Working DEMO