Callback function - javascript

Question

I have generic function i need to use in different places. The issue is some places i need to pass function without parameters and some places with parameters to call back function. How can i handle in both the scenarios.

    function deletePrompt(message, callback){
    $("#deleteModelWindow").modal({
    containerCss: {
        width: 320,
        height: 180,
        overflow: 'hidden'},
        onShow: function(dialog){ dialog.wrap.css('overflow','hidden'); }
    });
    document.getElementById("spanid").innerHTML = message;       
    $("#deleteModelWindow").on('click', "#deleteConfirm", function(){
    if (callback !== undefined) {
        callback();           
    } else {    
        callback(parameter1,parameter2);        
    }
    $.modal.close();
    });     
    $("#deleteModelWindow").on('click', "#cancel", function(){          
    $.modal.close();
    });

}

calling From:

<input id="deleteInvitationBtn" class="buOrange large" type="button" name="submit" value="Delete Invitation" onClick="deletePrompt('Are you sure you want to delete the invitation?', deleteInvitation('${invitation.invitationId}','${invitation.clientActivationCode}'))">

Here, In onclick before it redirects to deletePrompt() it is directly redirecting to the deleteInvitation().

Can anyone explain why this is happening?

You can handle it in the callback function by using the "arguments" object right? — Bhargav Ponnapalli
– Bhargav Ponnapalli, Commented Oct 22, 2015 at 4:32

Darren · Accepted Answer · 2015-10-22 04:41:26Z

1

You can use arguments object or check if message and callback are undefined:

function deletePrompt(message, callback) {
        $("#deleteModelWindow").modal({
        containerCss: {
            width: 320,
            height: 180,
            overflow: 'hidden'},
            onShow: function(dialog){ dialog.wrap.css('overflow','hidden'); }
        });

        if (message !== undefined) {
             document.getElementById("spanid").innerHTML = message;
        }

        if (callback !== undefined) {
            $("#deleteModelWindow").on('click', "#deleteConfirm", function() {           
              callback();
              callback(parameter1,parameter2);

              $.modal.close();
            }); 
        }

        $("#deleteModelWindow").on('click', "#cancel", function(){          
        $.modal.close();
        });   
}

JSFiddle demonstrating the concept: http://jsfiddle.net/on3b7sv4/

It may also be better to split the binding logic up into smaller functions so the function is cleaner.

edited Oct 22, 2015 at 4:41

answered Oct 22, 2015 at 4:34

Darren

71.2k24 gold badges141 silver badges146 bronze badges

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

3 Comments

pramod patel Over a year ago

you can see below how i am calling the function. onclick="deletePrompt('Are you sure you want to delete the user?', deleteUser)"> onClick="deletePrompt('Are you sure you want to delete the invitation?',deleteInvitation, deleteInvitation('${invitation.invitationId}','${invitation.clientActivationCode}'))"

pramod patel Over a year ago

sorry not working. I am using as below. For me callback is returning false $("#deleteModelWindow").on('click', "#deleteConfirm", function(){ if (callback !== undefined) { callback(parameter1,parameter2); } else { callback(); } $.modal.close(); });

pramod patel Over a year ago

onclick only it's calling deleteInvitation method.

T.J. Crowder · Accepted Answer · 2015-10-22 04:32:57Z

That's fine. JavaScript functions are really flexible, you can pass them more arguments than they expect, or fewer; within the function, any declared argument that you don't pass will have the value undefined. Any undeclared argument you pass will be available as part of the arguments pseudo-array.

Example:

function test(label, a, b) {
  var n;
  snippet.log("------- " + label);
  snippet.log("a = " + a);
  snippet.log("c = " + b);
  if (arguments.length > 3) {
    snippet.log("Extra arguments:");
    for (n = 3; n < arguments.length; ++n) {
      snippet.log("#" + n + ": " + arguments[n]);
    }
  }
}
test("test1", 1, 2);
test("test2", 1);
test("test3");
test("test4", 1, 2, 3, 4);

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="//tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Collectives™ on Stack Overflow

Callback function - javascript

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related