SimpleModal 1.3 Released

It has been over 2 months since I released SimpleModal 1.3 and was waiting to finish the documentation until making an official announcement.

Well, days turned into weeks and weeks turned into months, but finally, the new documentation along with a new site design, are available!


Complete list of changes and new features:

  • Added appendTo option, primarily for .NET users to enable appendTo('form')
  • Added focus option which forces focus to remain in the dialog
  • Added dataId option which allows a unique id to be set for the data div if one does not already exists
  • Added minHeight/minWidth options to allow minimum dimensions to be enforced
  • Added maxHeight/maxWidth options to allow maximum dimensions to be enforced. SimpleModal will always contain the modal dialog within the browser window.
  • Added escClose option to bind modal close to the ESC key
  • Added overlayClose option to bind modal close to a click on the overlay div
  • Added a wrapper div to allow for easier overflow capabilities
  • Added autoResize option which enables/disables container resizing after window resize
  • Changed meaning of close option. If false, the closeHTML, escClose and overlayClose values will be ignored.
  • Fixed auto-centering issues when container dimensions were not provided
  • Fixed Opera screen painting issues by adding .hide() before .remove()
  • Fixed Opera 9.2.x issue with jQuery 1.3.x and $(window).height()

Other than the close option, all previous options remained the same and the new options should be fairly self-explanatory. See the project page for documentation and examples.

Thanks for using SimpleModal!

Links: Project Page | jQuery Plugins Page

Topics:

13 Comments

  1. August 20, 2009 @ 8:20 am #

    I can't get overlayClose:true to work. Pressing the ESC key doesn't close the dialog either. I am using the onClose option...

    Is there a way to detect a click on the overlay or ESC key and call the $.modal.clode(); somehow inside the onClose option?

  2. August 20, 2009 @ 8:26 am #

    @Roman - do you have a link I can see? Make sure you aren't using the close:false option. The onClose should not have any impact on the events that trigger the close.

    To your second question, you'd want to use the onShow callback to do any binding - the onClose should just be used to do closing animations or any other manipulations to the dialog elements or data.

  3. August 20, 2009 @ 8:34 am #

    Of Course, I had close set to false. No idea why, I must have copied it from somewhere. When it's set to true everything is working as it should!

    Thanks.

  4. August 21, 2009 @ 2:41 am #

    Hi, i need confirm close event and I have a problem. I make this code:

    if (confirm("Realy close?")){
      	                 dialog.data.fadeOut('slow', function () {
                          dialog.container.slideUp('slow', function () {
      			               dialog.overlay.fadeOut('slow', function () {
      				              $.modal.close(); 
      			               });
      		                });
      	                 }); 
                        }
    

    It works at first time, but when i click on close button second time, onClose event in not done. Can you help me? Thanks

  5. August 27, 2009 @ 7:59 pm #

    @Jirka - sounds like an event binding issue. Can you send me a link or more sample code?

  6. September 11, 2009 @ 7:38 am #

    Is it possible to change the click event of the No button to do some action rather than simply close the dialog? I have the Yes forwarding the page to another URL, and I want the No button to forward the page to a second URL.

  7. September 11, 2009 @ 10:36 am #

    @Dale - You'll need to do the following:

    * Remove the simplemodal-close class from the "no" div
    * Modify the confirm function to accept an argument
    * Modify the "yes click" logic to handle both cases

    Code:

    // new confirm function
    confirm("blah blah", function (url) {
    	window.location.href = url;
    });
    
    
    // "yes click" replacement code
    $('.buttons div', dialog.data[0]).click(function () {
    	// call the callback
    	if ($.isFunction(callback)) {
    		if ($(this).is('.yes')) {
    			callback.apply(this, ['http://www.site1.com/']);
    		}
    		else {
    			callback.apply(this, ['http://www.site1.com/']);
    		}
    	}
    	// close the dialog
    	$.modal.close();
    });
    
  8. September 11, 2009 @ 1:20 pm #

    Thanks so much Eric. That works great. Thanks for the quick response!

  9. September 16, 2009 @ 2:05 pm #

    If there is a list of emails in the page, is it possible to send from each link
    x1@yy.com
    x2@yy.com, a variable to contact.php, containing the email address corresponding to each link?

  10. September 17, 2009 @ 1:04 pm #

    @calin c - you could add a unique id to each link and then use that id to lookup an email from an array.

    You can contact me directly if you need implementation help.

  11. September 22, 2009 @ 4:18 pm #

    I love SimpleModal and it is much preferable to all those contact form plugins I have seen. I really don't like embeding those forms into my pages and prefer the modal concept. However, like Calin C, I would like to be able to use SimpleModal to send emails to various email addresses rather than listing the actual email addresses on my blog where they can be harvested by spammers. There are numerous email addresses I need to use, all using the same domain name. What I would like to do is somehow use the smc-link to tell it which email address to send the email to. Something like these:

    <a href="/contact/webmaster">Contact</a>
    <a href="/contact/info">Contact</a>
    <a href="/contact/submissions">Contact</a>

    Is something like this possible? I use wordpress extensively but I am not really that up on coding so I haven't the slightest idea how to go about doing something like this. Can you help?

  12. September 22, 2009 @ 8:48 pm #

    @Edward Kelley - what you are asking is possible, but it would require some changes to the smcf.js file and the smcf_data.php file.

    You could do something like:
    <a href="/contact/webmaster" rel="webmaster">Contact</a>
    <a href="/contact/info" rel="info">Contact</a>
    <a href="/contact/submissions" rel="submissions">Contact</a>

    Then access the rel value in smcf.js and send it to smcf_data.php. Then in smcf_data.php, use that value to lookup or create the desired "to" email.

  13. September 22, 2009 @ 10:59 pm #

    Eric, that would be nice! I think it is beyond my skills though. I am disabled and suffer from a degenerative nerve disease that has impacted my cognitive abilities. I was once an excellent programmer who worked for AT&T.

    I've volunteered my time and what's left of my abilities to my old boarding school. HTML, CSS and a smattering of php is about all I am capable of these days and even that takes me a lot of time. I'd be lost without wordpress plugins! lol

    I'll ponder your suggestion and see if my brain can wrap around it. Thanks for the suggestion and your time!

Leave a Comment

Sorry, comments are closed. You can contact me directly, if you like.

Eric Martin
1home
2blog
3projects
4photography
5about
6contact
ssearch
ccomment
p/←previous
n/→next
ttop