Search This Blog

Nov 25, 2012

Popup window

Here I am going make custom model popup with using JQuery. Its looks very Attractive rather than the simple alert box in Asp.Net.

In my application, i would like to use the popup window concept. When the user clciks a button, a popup window should appear, with a textbox to enter a value. on closing the popup window, the user entered value should get saved into a table.


<!DOCTYPE html>
    <title>Page Title</title>
    <script type="text/javascript" src=""></script>
    <script type="text/javascript" src=""></script>
    <script type="text/javascript">
        $(document).ready(function () {
                var triggers = $("#launch").overlay({

                        mask: {
                                color: '#000',
                                loadSpeed: 200,
                                opacity: 0.4
                        target: '#myModal',
                        closeOnClick: false

                    $('#launch').html("Formatted, click to try again.");
                    $('#launch').html("Ok we didn't format it, click to try again.");
    <link href="modal.css" rel="stylesheet" />

    <a id="launch" href="#">Launch Modal</a>
    <div id="myModal" class="promptBox">
        <span class="promptTitle">Are you sure you want to do that?</span>
        <div class="promptContent"><p>Format hard disk?</p></div>
        <button class="promptButton YesButton close">Yes, do it now</button>
        <button class="promptButton NoButton close">No, I'm insane</button>


You can download full Code from the below link.


I hope you like this article.  Happy Coding.!!

No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...