I’m wondering everything I need to do have just a basic jquery dialog appear on the screen. Here is my code below. Any help why none of the UI properties are being rendered when executing the code below? All that happens currently is if a user clicks on “show dialog” then plain html text then appears, without any UI css or actual dialog box. I have included jquery UI scripts that I downloaded from http://jqueryui.com/download but perhaps I didn’t download and use the correct UI scripts? Thanks!
Master page code:
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="SiteMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js"></script>
<script src="Scripts/UI/css/ui-lightness/jquery-ui-1.8.17.custom.css" type="text/javascript"></script>
<script src="Scripts/UI/js/jquery-ui-1.8.17.custom.min.js" type="text/javascript"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="page">
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server"/>
</div>
</div>
</form>
</body>
</html>
Default Page:
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="Scripts/textboxclone.js" type="text/javascript"></script>
<script src="Scripts/fadeOut.js" type="text/javascript"></script>
<script src="Scripts/flip.js" type="text/javascript"></script>
<script src="Scripts/dialog.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<a id='showDialog' href="#">Show Dialog</a>
<div id="dialog1" style="display:none;">
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
</div>
</asp:Content>
You have to include the jQuery CSS file as a CSS file. Use
instead of