Create and open dialog via Javascript
Description
The following code shows how to create and open dialog via Javascript.
Example
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head><!--from ww w .ja v a2s . c o m-->
<body>
<div data-role="page" id="home">
<div data-role="content">
<a data-role="button" href="#" id="some-link-id">Open Dialog</a>
</div>
</div>
<script type='text/javascript'>
$('#some-link-id').bind('click', function (event) {
event.preventDefault();
$('#new-dialog').remove();
$('body').append('<div data-role="dialog" id="new-dialog"><div data-role="content"><p>Some Content</p><p><a data-role="button" href="#">Close</a></p></div></div>');
$.mobile.changePage($('#new-dialog'), { role : 'dialog' });
});
$(document).delegate('#new-dialog a', 'click', function (event) {
event.preventDefault();
$.mobile.changePage($('#home'));
});
</script>
</body>
</html>