jquery: Object doesn't support property or method 'dialog' jquery.1.12.4.js, asp.net

Saroj13
Saroj13 used Ask the Experts™
on
Hi, Please let me know how to fix this issue.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="default" MasterPageFile="~/Masterpage.Master"%>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp"%>
 
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
  <iframe id="frameName1" src="index.aspx" frameborder="0" scrolling="auto" width="30%" height="1000px" align="left"></iframe>
     <iframe id="frameName2" src="home.htm" frameborder="0" scrolling="auto" width="70%" height="1000px" align="right"></iframe>
     
 
         <script src="scripts/jquery-1.12.4.js" type="text/javascript"></script>
    <script type="text/javascript">
var sessionTimeout = "<%= Session.Timeout %>";
function DisplaySessionTimeout(timeout) {
    var seconds = timeout / 1000;
    document.getElementsByName("seconds").innerHTML = seconds;
    setInterval(function () {
        seconds--;
        document.getElementById("seconds").innerHTML = seconds;
    }, 1000);
    setTimeout(function () {
        //Show Popup before 20 seconds of timeout.
        $("#ExpireConfirm_Submit").dialog({
            height: 200,
            width: 400,
            resizable: false,               
            modal: true,               
            title: "Session Expire Confirmation",                             
            open: function () {
                $('p#id1').html(sessionTimeout);
            },
            buttons: {
                "Yes": function () {                       
                    $(location).attr("href", "SessionExpired.aspx").submit();
                    $(this).dialog("close");
                },
                "No": function () {                       
                    ResetSession();
                    $(this).dialog("close");
                }
            }
        }).prev(".ui-dialog-titlebar").css("background", "red");
    }, timeout - 55 * 1000);
    setTimeout(function () {
        $(location).attr("href", "SessionExpired.aspx").submit();
    }, timeout);
};
function ResetSession() {
    window.location = window.location.href;
}   
</script>
 
     <div id="ExpireConfirm_Submit">
<table>
    <tr>
        <td style="width: 230px;">
            Your Session will expire in <span id="seconds"></span>&nbsp;seconds.<br />
            Please submit/update your changes or you will loose your data.
        </td>
    </tr>
</table></div>
    </asp:Content>

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Top Expert 2010
Commented:
jQuery dialog requires jQuery UI.

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Open in new window

You'll also want the CSS
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

Open in new window


More:
https://jqueryui.com/dialog/
Jim RiddlesPrepress/OMS Specialist
Commented:
You need to include a reference to jQueryUI to use modal dialogs.  You would include it after line 11 in your code.

Here's a link to a page that has links to all jQueryUI version:
https://code.jquery.com/ui/
Jim RiddlesPrepress/OMS Specialist

Commented:
The solutions provided answer the author's question.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial