How to open a html page as a popup with in the page (no new window opens) using Jquery

Question

I am having the link button and when i clicked on the link button the popup will be open (with in the page itself like a modalpopup. now i have to get the popup feel using jquery and inside the div text should come from database. How is it possible for getting the message from the backend.

means open a div in a modal popup feel using jquery

or opens the html page in a popup in the same window using jquery

Thanks and Regards Vara Prasad.M

Answer 1

Take a look at the Facebox jQuery plugin. It does pretty much exactly what you're asking for. For example you can have a link like this to some remote page like so

<a href="remote.html" rel="facebox">text</a>

then just call the facebox plugin when your content is loaded like so

jQuery(document).ready(function($) {
    $('a[rel*=facebox]').facebox()
});

and your content will render in a modal window. You can also take a look at Fancybox or ThickBox which provide very similar functionality.

Answer 2

There are two steps to your problem:

1. Open a modal popup using jQuery
2. Fetch server side content and display it in the modal dialog

Use jQuery Dialog (http://docs.jquery.com/UI/Dialog) for popping open a modal dialog, and then use jQuery load (http://api.jquery.com/load/) for loading the content from the server.

The server page you call will make the database query and output the contents to the response buffer.