how to open jquery ui dialog automatically when the page loads?

Question

I need my dialog to open when the page is loaded automatically. What is the way to do it using jquery. Without any user interaction to open it.

I tried this code but it dint work

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/style.css" media="screen,projection" />
        <script type="text/javascript" src="script/jquery-1.4.2.min.js"></script>
        <link type="text/css" href="css/jquery-ui-1.8.1.custom.css" rel="stylesheet" />
        <script type="text/javascript" src="script/jquery-ui-1.8.1.custom.min.js"></script>
        <script type="text/javaScript">
            $(function(){
                $('#dialog').dialog({
                    autoOpen: true,
                    width: 600,
                    buttons: {
                        "Ok": function() {
                            $(this).dialog("close");
                        }
                    }
                });
            });
        </script>
    </head>
    <%
                if (session.getAttribute("user") == null) {
                    response.sendRedirect("index.jsp");
                }
    %>
    <body>
        <div id="wrap">
            <div id="header">
            </div>

            <div id="leftside">
                <h2 class="hide">Sample menu:</h2>
                <ul class="avmenu">
                    <li><a href="dashboard.jsp" class="current">Dash Board</a></li>
                    <li><a href="createpoll.jsp">Create Poll</a></li>
                    <li><a href="availpoll.jsp">Vote Poll</a></li>
                    <li><a href="viewresults.jsp">View Results</a></li>
                    <li><a href="underconstruction.jsp">Settings</a></li>
                    <li><a href="logout">Log Out</a></li>
                </ul>
            </div>

            <div id="contentwide">
                <%@page import="com.jSurvey.entity.question" %>
                <%@page import="com.jSurvey.controller.questionJpaController" %>
                <%
                  //code to write data to database
                %>
                <div id="dialog"><p>Data Added successfully</p></div>
            </div>
            <div id="footer">
            </div>
        </div>
    </body>
</html>

Please help.

jqueryui.com/demos/dialog/#options may come in handy.

Matt
– Matt

2010-06-06 01:42:43 +00:00
Commented Jun 6, 2010 at 1:42 — Matt
– Matt, Commented Jun 6, 2010 at 1:42

azatoth · Accepted Answer · 2010-06-06 01:34:55Z

4

use autoOpen: true, to make it open directly when page loads

answered Jun 6, 2010 at 1:34

azatoth

2,37915 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

edl · Accepted Answer · 2010-06-06 02:35:27Z

0

Try:

  $(document).ready(function() {
      // Your dialog code here
  });

EDIT: The only other thing you could try is a $(body).load(function(){//your dialog here}); if that doesn't do anything, then there's some other underlying issue with the way your page is loading.

edited Jun 6, 2010 at 2:35

answered Jun 6, 2010 at 2:07

edl

3,22424 silver badges23 bronze badges

2 Comments

Matt Over a year ago

$(function () { /* Your dialog code */ }) is equivalent to $(document).ready(function () { /* Your dialog code */ }

edl Over a year ago

Yeah, I just realized that when I looked into a little more. Just another case of the blind leading the blind. :)

Nikita Jurievich Nickemail · Accepted Answer · 2022-05-05 01:46:18Z

0

$( ".selector" ).dialog({ autoOpen: true });

answered May 5, 2022 at 1:46

Nikita Jurievich Nickemail

211 silver badge4 bronze badges

Collectives™ on Stack Overflow

how to open jquery ui dialog automatically when the page loads?

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related