Callback function with arguments using jQuery dialog

Question

I'm trying to call a javascript function with arguments on the click of a button in a dialog. Here is the flow of a simplified version that I can post here: 1) On click of an HTML button, pass a function and the button ID as arguments to a 'confirm' dialog. 2) On click of a 'Yes' in the confirmation dialog, call the passed in function that would just update the ID and value of the HTML button.

For some reason, the dialog keeps using the original argument and never gets the updated one. I think the code would do a better job of explaining the issue. Here is the HTML snippet:

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.2.custom.js"></script>
<div id="confirmDialog"></div>
<div id="div_input">
    <input type="button" id="1" value="1" onClick="javascript:confirmAction(updateButton, this.id)" />
</div>

And here is the javascript snippet:

function confirmAction(onSuccessFunction, functionArg)
{
    var message = "Are you sure?";
    $('#confirmDialog').html(message);
    $('#confirmDialog').dialog({
        modal: true,
        autoOpen: false,
        title: 'Confirm',
        width: 400,
        height: 150,
        buttons: {
            'Yes': function() {
                $(this).dialog('close');
                onSuccessFunction(functionArg);
            },
            'No': function() {
                $(this).dialog('close');
            }
        }
    });
    $("#confirmDialog").dialog('open');
};

function updateButton(buttonId)
{
    alert(buttonId);
    var buttonHTML = '';
    if(buttonId == '1')
    {
        buttonHTML = "<input type='button' id='2' value='2' onClick='javascript:confirmAction(updateButton, this.id)' />";
    }
    else
    {
        buttonHTML = "<input type='button' id='1' value='1' onClick='javascript:confirmAction(updateButton, this.id)' />";
    }

    document.getElementById("div_input").innerHTML = buttonHTML;
};

confirmAction(...) always calls updateButton(...) with buttonId as '1'. It works fine if I call updateButton(...) directly 'onClick'. Am I missing something here?

Answer 1

I posted this on jQuery forums too - https://forum.jquery.com/topic/jquery-dialog-callback-function-with-arguments. As it turns out, this was a bug in older versions of jQuery and has now been fixed.