How can I add yes/no dialog to jquery mobile page? - jquery-mobile

Question

When I added $(document).ready({alert('it is ready')}); into script tags on the SiteMaster.master page and called the page with this link: http://192.168.1.66:90/Reminder/test.aspx#DialogChangeTag.aspx I doesn't work until I called it with http://192.168.1.66:90/Reminder/DialogChangeTag.aspx link.
Where am I making mistake?
DialogChangeTag.aspx:
<%# Page Title="" Language="C#" MasterPageFile="~/TekContent.master" AutoEventWireup="true"
CodeFile="DialogChangeTag.aspx.cs" Inherits="DialogChangeTag" %>
<asp:Content ID="Content1" ContentPlaceHolderID="PageIdContent" runat="Server">
<div data-role="page" id="delete_dialog" data-theme="b">
<script type="text/javascript">
$(document).ready(function () {
alert("calis");
});
</script>
<div data-role="content" data-theme="b">
<h1>
Delete Item?</h1>
<p>
Are you sure you want to delete this item?</p>
Yes
No
</div>
</div>
</asp:Content>
Test.aspx
<%# Page Title="" Language="C#" MasterPageFile="~/TekContent.master" AutoEventWireup="true"
CodeFile="test.aspx.cs" Inherits="test" %>
<asp:Content ID="ContentPage" ContentPlaceHolderID="PageIdContent" runat="Server">
<div data-role="page" id="pageTest">
<div data-role="header" data-position="inline">
<h1>
TEST HEADER</h1>
</div>
<div data-role="content">
<h2>
TEST CONTENT</h2>
<a href="DialogChangeTag.aspx" data-role="button" data-rel="dialog" data-transition="pop">
Show Dialog</a>
</div>
<div data-role="footer" class="ui-bar" id="divFooterContainer">
<h3>
TEST FOOTER</h3>
</div>
</div>

Answer 1

Probably because your jQuery Mobile is setup to work with AJAX. $(document).load() only gets called when a new page is loaded in the browser. This means $(document).load() won't work when you are working with AJAX based pages. Unwraping $(document).load() would solve it if that page is only loaded with AJAX. A better way of solving this problem is using unobtrusive client side code. Take a look at Backbone.js.