Open Page In Modal Box

I have a script that restrict the click on a href link if there;s no checkbox selected. I want the editpr.php open in modal box. The problem is I'm not familiar with modalbox. Any

Solution 1:

You can't open a page in a modal box just with pure javascript, as "alert()" or "confirm()".

To do what you want you need to put your 'editpr.php' content inside a div, and make it modal with CSS.

Actually we have a lot of libraries that make it happen easily, I think that most used is: http://www.jacklmoore.com/colorbox/

Check the "Outside HTML (Ajax)" and "Outside Webpage (Iframe)" on this example page, probably is the same thing that you want to do: http://www.jacklmoore.com/colorbox/example1/

Solution 2:

There are some useful jQuery plugins that can make your job really easy. I suggest you give them a try. Here you have an example.

Solution 3:

Since you are already using jQuery you could use jquery-ui.

They have an exmple of what you want to do here: http://jqueryui.com/dialog/#modal

Once you get your modal dialog element setup, all you have to do is make and XHR for editpr.php, load the result into the elements innerhtml, then display the dialog.

// setup your modal dialog
var el = $( "#editpr-dialog" ).dialog({
  // ... (other config options)
  modal: true
});

// XHR editpr.php and show the dialog box
$.get('editpr.php', function(data){
  el.html(data).dialog('open');
});

Solution 4:

The custombox plugin has a lot of beautiful features and works amazingly with Jquery: http://dixso.github.io/custombox/