Question

I’m trying to create a multi-click function inside a click event for a ui dialog button. Basically I want to toggle between multiple divs to show different content inside the dialog as the user clicks the ‘next’ button. At the moment I can only seem to get it to trigger one event.

Here is my js that works but only triggers one event.

dialog.dialog({
        // add a close listener to prevent adding multiple divs to the document
        close: function(event, ui) {
            // remove div with all data and events
            dialog.remove();
        },
        modal: true,
        resizable: false,
        draggable: false,
        stack: false,
        width: 480,
        buttons: [
            {
                text: "Cancel",
                click: function() { $(this).dialog("close"); }
            },
            {

                id: "cta",
                click: function() {
                    $('.ui-dialog').css('top', '100px');
                    $(this).find('#modal p').remove();
                }
            }
        ]
    });

The main section is question is the last click inside ‘buttons’. Is this possible? I tried to call on a function rather than setting it inside the click itself but that wouldn’t work either.

Answer 1

Are you looking for something like this?

http://jsfiddle.net/rsarika/h7fSf/