我正在创建一个应用程序,其中我使用了 jQuery 移动自动完成列表视图数据是从数据库动态创建的自动完成列表视图代码在 js 文件中返回。我可以从列表视图中选择数据并将其显示在自动完成的输入字段中,然后禁用搜索列表。
知道我想要什么当用户选择列表数据时,我会从数据库中获取数据,它将显示名称,但是当它单击保存按钮时,它应该保存该名称的 id 而不是 jQuery ui 自动完成中的名称这很容易,因为我们可以使用带有标签和值的数组。
但我不知道如何在 jQuery mobile 中做到这一点。
此处创建自动完成的代码:
var db = window.openDatabase("Database", "1.0","BPS CRM", 200000);
$( document ).on( "pageinit", "#myPage", function() {
var usrname = new Array();
$( "#autocomplete" ).on( "listviewbeforefilter", function ( e, data ) {
var $ul = $( this ),
$input = $( data.input ),
value = $input.val(),
html = "";
$ul.html( "" );
db.transaction(function(tx){
tx.executeSql('select * from users',[],function(tx,results){
var dataset = results.rows;
if(dataset.length > 0){
for(var i = 0; i < dataset.length; i++){
usrname[i] = dataset.item(i).user_name;
}
}
});
});
if ( value && value.length > 1 ) {
for(var j = 0; j < usrname.length; j++){
html += "<li>"+usrname[j]+"</li>";
}
$ul.html( html );
$ul.listview( "refresh" );
$ul.trigger( "updatelayout");
$.mobile.activePage.find('input[placeholder="Find a city..."]').attr('id','namesearch');
}
$("ul > li").click(function(){
var textval = $(this).text();
$('#namesearch').val(textval);
$.mobile.activePage.find("[data-role=listview]").children().addClass('ui-screen-hidden');
});
}); });
如果给出相同的小例子,那就太好了。
任何建议表示赞赏。提前致谢。