0

Hi! I have successfully implemented a modal dialog using jquery with the help of Daniweb forum but I am facing one more problem.
Well, I have to intregrate it with a sharepoint page.
1. It is running fine in a normal web application.
2. It is running in a webpart.
3. But when I implement this in a sharepoint page without a webpart the Title Bar is not showing making it undraggable but with I try to resize the window it works o.k.
4. But when I refresh the page step 3 occurs again.

I have no idea why this is happening. I have used the following codes:
ASPX file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
<meta name="WebPartPageExpansion" content="full" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="http://7h5nk1s:11261/ecmaomexamples/Scripts/CSS_Files_/jquery.ui.all.css" />
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery-1.4.4.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.widget.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.position.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.resizable.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/jquery.ui.dialog.js"></script>
<script type="text/javascript" src="http://7h5nk1s:11261/ecmaomexamples/Scripts/addaccount.js"></script>
<title>AddToList</title>
</head>

<body>

<form id="form1" runat="server">
<a href="#" id="addaccountlink">Add an account</a>
<a href="http://7h5nk1s:11261/ecmaomexamples/SitePages/testpage.aspx">Redirect</a>
<div id="addaccount" style="display: none; padding: 5px"></div>
</form>

</body>

</html>

addaccount.js file

$(document).ready(function () {
    $("#addaccount").load('http://7h5nk1s:11261/ecmaomexamples/SiteAssets/test2.html');
    $("#addaccount").dialog({
        height: 'auto',
        width: 'auto',
        modal: true,
        autoOpen: false
        
    });
    $("#addaccountlink").click(function (e) {
        $('#addaccount').dialog('open');
    });
    $(window).unload(function () { alert("Bye now!"); });
});

Do I need to make any changes in the CSS files?

Please help!

1
Contributor
1
Reply
2
Views
6 Years
Discussion Span
Last Post by soft_coder
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.