Instantly share code, notes, and snippets.

Embed
What would you like to do?
var app = {
timer: null,
init: function() {
var instance = this;
$(document).on("pagecreate", "#home", function() {
$("#autocomplete").on("filterablebeforefilter", function(e, data) {
var $ul = $(this),
$input = $(data.input),
value = $input.val(),
html = "";
$ul.html("");
if (value && value.length > 2) {
$ul.html("<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>");
$ul.listview("refresh");
$.ajax({
type: "POST",
url: "search.php",
data: {
searchfor: $input.val()
}
}).done(function(data) {
data = $.parseJSON(data);
instance.renderUL(data, $ul);
});
}
});
});
$(document).on("pagebeforechange", function(e, data) {
// We only want to handle changePage() calls where the caller is
// asking us to load a page by URL
if (typeof data.toPage === "string") {
// We are being asked to load a page by URL
var u = $.mobile.path.parseUrl(data.toPage),
_re = "#contact";
if (u.hash.search(_re) !== -1) {
var name = 'id';
var results = new RegExp('[\\?&]id=([^&#]*)').exec(data.toPage);
var id = results !== null ? results[1] || '' : '';
$.ajax({
type: "POST",
url: "detail.php?id=" + id
}).done(function(data) {
data = $.parseJSON(data);
instance.detailPage(data);
});
e.preventDefault();
}
}
});
},
search: function(searchFor) {
var instance = this;
$.mobile.loading('show');
console.log(instance);
},
renderUL: function(result, $ul) {
var tmpl = [],
len = result.contacts.length;
if (len > 0) {
for (var i = 0; i < len; i++) {
tmpl.push('<li><a href="#contact?id=' + result.contacts[i].id + '">' + result.contacts[i].name + '</a></li>');
}
$ul.html(tmpl.join(''));
$ul.listview("refresh");
$ul.trigger("updatelayout");
} else {
$ul.html('<li>Sorry no results matching your query</li>');
}
$.mobile.loading('hide');
},
detailPage: function(data) {
var tmpl = [];
tmpl.push('<div data-role="page" id="detail_page">');
tmpl.push('<div data-role="header"><h1>Contact Details</h1><a href="#" data-rel="back" data-role="button">back</a></div>');
tmpl.push('<div data-role="content">');
tmpl.push('<div>' + data.contact[0].address + '</div>');
tmpl.push('<div>' + data.contact[0].city + '</div>');
tmpl.push('<div>' + data.contact[0].email + '</div>');
tmpl.push('<div></div>');
tmpl.push('<div><b>' + data.contact[0].company + '</b></div></p> </div>');
tmpl.push('</div></div>');
$.mobile.pageContainer.find('#detail_page').remove();
$.mobile.pageContainer.append($(tmpl.join('')));
$.mobile.navigate("#detail_page");
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment