Optimize functions in jQueryUI

Question

I want to optimized some codes (I use jQuery UI):

$(function() {
    $('.click-login-modal').click(function() {
        $('.login-modal').dialog('open');
        return false;
    })

    $('.login-modal').dialog({
        autoOpen: false,
        width: 500,
        height:300,
        modal: true,
        resizable: false,
    })
    $('.click-register-modal').click(function() {
        $('.register-modal').dialog('open');
        return false;
    })

    $('.register-modal').dialog({
        autoOpen: false,
        width: 500,
        height:300,
        modal: true,
        resizable: false,
    })
})

It's possible? I have two deferential modals. (Dialog Popup)

karim79 · Accepted Answer · 2011-01-09 12:43:17Z

3

var options = {
        autoOpen: false,
        width: 500,
        height:300,
        modal: true,
        resizable: false
    };

$(".register-modal").dialog(options);
$(".login-modal").dialog(options);

$('.click-register-modal, .click-login-modal').click(function() {
    $(this).dialog('open');
    return false;
});

edited Jan 9, 2011 at 12:43

answered Jan 9, 2011 at 10:08

karim79

343k67 gold badges420 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

redsquare Over a year ago

ie will have a fit with the closing comma!

Cheerio Over a year ago

thanks, I think $('.register-modal').dialog('open'); should be $('.login-modal, .register-modal').dialog('open');

karim79 Over a year ago

@Mini - actually, it should be $(this).dialog('open');. Updated.

Cheerio Over a year ago

Opps. the optimized open two modals in the same time. why?

karim79 Over a year ago

Argh! I guess they have to be bound one at a time.

|

ifaour · Accepted Answer · 2011-01-09 16:42:47Z

0

I would use the tabs approach, where the href would point to the element ID, so you can change your modal classes to IDs and then use:

var options = {
        autoOpen: false,
        width: 500,
        height:300,
        modal: true,
        resizable: false
    };

$(".register-modal").dialog(options);
$(".login-modal").dialog(options);

$('.click-register-modal, .click-login-modal').click(function() {
    $($(this).attr('href')).dialog('open');
    return false;
});

Or if you need to use classes then replace the hash # with a dot . also if you are not using LINKS you may use the rel attribute to point to your dialogs or even jquery data.

answered Jan 9, 2011 at 16:42

ifaour

38.1k12 gold badges74 silver badges79 bronze badges

Collectives™ on Stack Overflow

Optimize functions in jQueryUI

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related