Jquery Mobile поиск по списку
Я создаю проект, в котором пользователь вводит имя, и имя появляется в окне, но вы можете нажать, чтобы получить больше информации в диалоговом окне. Мой код работает, но для того, чтобы в диалоговом окне отображалась полная информация, вам нужно набрать не менее 4 символов в поле поиска. Я хотел бы, чтобы пользователь мог получать дополнительную информацию, даже если он вводит менее 4 символов. Увидеть ниже:)
Ниже мой сценарий, я надеюсь, что это имеет смысл для кого-то.:)
$(document).ready(function() {
$('#search').click(function() {
$(".artist").remove(); // removes the artist class to clear search
var artists = "js/data.json"; // places the file link into variable
$.getJSON( artists, function(data) { // uses the variable to connect to json file
console.log(data);
$.each( data, function( i, item ) { // loops through the json files to retrieve required info
// section for artists brief intro
$("ul#artist").append( "<li class='artist'><span style='font-size:24px; font-weight:bold;color:red;'>" + item.name +
"</span><br/>" + item.reknown +
"<br/><button class='ui-btn' id='information'><a href='#dialog' data-role='button' id='dialog' data-transition='flip'>More Information</a></button></li>");
}); // end of each function
$('#search').first().one('keyup', function(){
$.each( data, function( i, item ) { // loops through the json files to retrieve required info
// section for artists dialog full profile data
$("ul#artist2").append( "<li class='artist'><span style='font-size:24px; font-weight:bold;color:red;'>" + item.name +
"</span><br/> " + item.reknown +
"<br/><img class='profile' src='images/" + item.shortname + "_tn.jpg' />" +
"<br/><span style='font-size:18px; color:red; font-weight:bold'>Bio:</span><br> " + item.bio + "</li>");
}); // end of information function
}); // end of each function
}); // end of getJson function
}); // end of submit on click function
}); // end document ready function