CODEWITHSUNDEEP
javascriptjquerymodal-dialogjqmodal
Ritesh M Nayak
Ritesh M Nayak

Reputation: 8053

Can anyone tell me about a jQuery modal dialog box library that doesn't suck

jQuery based modal dialog boxes are great as long as you do as much as the example tells you to. I need a jQuery based modal dialog box library that has to have the following characteristics:

Ideal implementation:

   function showDialog(values)
    {
      processToChangeDom(values);
      changeDivTobeDisplayed();
      modalDialog.show();
    }

Does anyone have any suggestions? I have already tried facebox, simplemodal and a whole range of libraries, most of them don't support one or the other of these functions I described above.

Upvotes: 6

Views: 4199

Answers (8)

keithl8041
keithl8041

Reputation: 2413

If you happen to be using Twitter's Bootstrap framework then you should check out BootBoxJs.

Upvotes: 1

sjobe
sjobe

Reputation: 2837

ThickBox works pretty well, especially if you want to do things like videos or flash inside your modals.

Upvotes: 1

mcgrailm
mcgrailm

Reputation: 17638

jquery-ui dialog I have found to be light weight and dynamic here an exmple of how you can use it in a funciton

  function display_alert(message,title) {
    title = title || "Alert";
      $('#alert').text(message); // the message that will display in the dialog

      $("#alert").dialog({
          autoOpen: false,
          bgiframe: true,
          modal: true,
        title:title,
        open: function() {
        },
        close: function (){
            $(document).unbind('keypress'); 
        },
          buttons: {
              OK: function() {
                  $(this).dialog('close');
              }
          }
      });
    $('#alert').dialog('option', 'title', title);
      $("#alert").dialog('open');
  }

Upvotes: 1

Mutation Person
Mutation Person

Reputation: 30520

Try BlockUI. I've found it to be pretty good.

Upvotes: 0

Arnis Lapsa
Arnis Lapsa

Reputation: 47647

Try SimpleModal. I found it's API quite nice.

Upvotes: 3

Adrian Grigore
Adrian Grigore

Reputation: 33318

I've looked into quite a few modal boxes myself, and the best one I came up with is ThickBox. The jquery UI box was ok too, but I did not like the way it handles the back button.

Thickbox covers points 1-3 in your list of requirements. The even handlers could be easily added since the source code is not too complicated.

Upvotes: 0

tvanfosson
tvanfosson

Reputation: 532665

The jQuery UI dialog does pretty much all that you are asking. Also, I haven't noticed that it takes very much time to display. You don't even need to have the DOM element existing to use it. One nice thing about the UI widgets is that you only need to load those components that you need plus the core. They're also widely available via CDN networks, so it's possible that the user's client already has the JS downloaded for it.

 $(function() {
      $('<div title="I am a dialog"><p>Put whatever you want in here</p></div>')
           .dialog({
               autoOpen: true,
               modal: true,
               open: function(event,ui) { ... },
               close: function(event,ui) {
                         ...
                         $(this).dialog('destroy');
                      }
               draggable: false,
               resizable: false,
               ...
            })
  });

Upvotes: 3

Chandra Sekar
Chandra Sekar

Reputation: 10853

Have you looked into jQuery UI? http://jqueryui.com/demos/dialog/

Upvotes: 3

Related Questions