<!DOCTYPE html>
<html>
<head>
<!-- <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> -->
<title>Insert title here</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript">
function search(){
var s="keyw="+$("#keyw").val();
jQuery.ajax({
type: "POST",
url: "/maze/search",
data: s
}).done(function(data) {
console.log(data);
$("#list").append(data);
$("#list").listview("refresh");
});
}
</script>
</head>
<body>
<div data-role="content">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<label for="keyw">
</label>
<input id="keyw" placeholder="Search for..." value="" type="text" />
</fieldset>
</div>
<input data-icon="search" data-iconpos="left" value="Search" type="submit" onclick="search()"/>
<div id="results">
<ul id="list" data-role="listview" data-divider-theme="b" data-inset="true">
<li data-role="list-divider" role="heading">
Results
</li>
<li data-theme="c">
<a href="#page2" data-transition="slide">
Button
</a>
</li>
</ul>
<div data-theme="a" data-role="footer" data-position="fixed" data-id="menu">
<div data-role="navbar" data-iconpos="bottom">
<ul>
<li>
<a href="/maze/activity?countryId=2" data-theme="" data-icon="home">
Activity
</a>
</li>
<li>
<a href="/maze/android/settings.jsp" data-theme="" data-icon="gear">
Settings
</a>
</li>
<li>
<a href="/maze/search" data-theme="" data-icon="search">
Search
</a>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>