Open In App

jQuery Mobile Dialog close() Method

Improve
Improve
Like Article
Like
Save
Share
Report

jQuery Mobile is a web technology used to make responsive websites and apps which are accessible on smartphones, tablets, and desktop devices. In this article, we will use jQuery Mobile Dialog Widget’s close() method to close an opened dialog. When the close() method is invoked on any dialog widget, it simply closes the dialog. This method does not accept any parameters.

Syntax:

$(".selector").dialog("close");

Parameters: This method does not accepts any parameters.

CDN Links: First, add jQuery Mobile scripts needed for your project.

<link rel=”stylesheet” href=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” />
<script src=”https://code.jquery.com/jquery-2.1.3.js”></script>
<script src=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js”></script>

Example:

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>GeeksForGeeks - Dialog Close</title>
    <meta name="viewport" content=
        "width=device-width, initial-scale=1" />
    <link rel="stylesheet" href=
    </script>
    <script src=
    </script>
  
    <script>
  
        // This method will be called when the 
        // button inside the dialog will be clicked.
        function closeDialog() {
  
            // Invokes close() method on #div2's dialog
            $("#div2").dialog("close");
  
        }
    </script>
</head>
  
<body>
    <div id="div1" data-role="page">
        <div data-role="header">
            <h1>GeeksForGeeks</h1>
            <h4>jQuery Mobile Dialog close() Method</h4>
        </div>
        <div data-role="content">
            <button>
                <a href="#div2">
                    Click to Show the Dialog Box
                </a>
            </button>
        </div>
    </div>
  
    <!-- id ="div2"-->
    <div id="div2" data-role="dialog">
        <div data-role="header">
            <h1>jQuery Mobile - GFG</h1>
        </div>
        <div data-role="content">
            jQuery Mobile - Dialog close() method example.
            <button onclick="closeDialog();">
                This Button Closes the Dialog
            </button>
        </div>
    </div>
</body>
  
</html>


Output:

Dialog Close() Method

Reference: https://api.jquerymobile.com/dialog/#method-close



Last Updated : 15 Dec, 2021
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads