0

I am using this question as the basis for a multipurpose jQueryUI dialog function that I can reuse in my site Question 17013222 I want to be able to reuse the code to display different buttons with callbacks defined in the function call

However, I don’t get the result I need when extending this answer to use a callback function. The callback function is running as I build the dynamic buttons instead of when the Dialog Save button is pressed.

I have a jsFiddle here that shows my incompetence jsFiddle

What do I need to do to get the callback to run as the Save button is clicked?

Below is the simplified code snippet

function showDialog(inToDisplay, inTitle, buttonSetup, inSaveCallback) {
'use strict';
var dialog_buttons = {};

$('#jqDialog').load(inToDisplay + '.asp', function () {
    $(this).attr('title', inTitle);
    /*Build our button choices*/
    if (buttonSetup === 'closeonly') {
        dialog_buttons['Close'] = function () {
            $(this).dialog("close");
            $(this).dialog("destroy");
        }
    } else if (buttonSetup === 'savecancel') {
        dialog_buttons['Save'] = function () {
            if (inSaveCallback && typeof (inSaveCallback) === "function") {
                inSaveCallback;
            };
            $(this).dialog("close");
            $(this).dialog("destroy");
        }
        dialog_buttons['Close'] = function () {
            $(this).dialog("close");
            $(this).dialog("destroy");
        }
    }

    $(this).dialog({
        autoOpen: false,
        modal: true,
        open: function (event, ui) {
        },
        buttons: dialog_buttons
    });
    $('#jqDialog').dialog('open');

});
}

function saveAnswer() {
    alert('ToDo: Save data here');
}

$(document).ready(function () {
    showDialog('ajax_manageAnswer', 'Enter your answer details', 'savecancel', saveAnswer());
});

1 Answer 1

1

here... http://jsfiddle.net/reigel/zpyNM/

change this

$(document).ready(function () {
    showDialog('ajax_manageAnswer', 'Enter your answer details', 'savecancel', saveAnswer); // remove () on saveAnswer...
});

and this

    dialog_buttons['Save'] = function () {
        if (inSaveCallback && typeof (inSaveCallback) === "function") {
            inSaveCallback(); // add -->> ()
        };
        $(this).dialog("close");
        $(this).dialog("destroy");
    }
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.