Question

I want to call a function as parameter in jQuery dialog when the yes button is pressed. I am using the following code but this is not working.

function showYesNoAlertMsg(divId,optFunction){
 //window[optFunction].apply(null, Array.prototype.slice.call(arguments, 2));
$('#'+divId).dialog('open');
$('#'+divId).dialog({
            autoOpen: true,
            width: 400,
            height: 175,
            modal: true,
            resizable: false,
            buttons: {
                "Yes": function() {
                 window[optFunction].apply(null, 
                                     Array.prototype.slice.call(arguments, 2));
                       $(this).dialog("close");
                },
                "No": function() {
                       $(this).dialog("close");
                }
            }
              });   
             }

       function newfunc(a,b){
            alert(a+'--'+b);
          }


       <input type="button" name="alert" id="alert" 
            onclick="showYesNoAlertMsg('boxDivId','newfunc','aaaaa','bbbbb');"/>

     <div id="boxDivId">
         hello
      </div>

When I click on the button named “alert” this the function showYesNoAlertMsg is called and it shows the dialog box of id “boxDivId” perfectly but I want to call a function named “newFunc” on the yes button. I passed this function as a parameter but it is not working in the dialog property. If I uncomment the first commented line in showYesNoAlertMsg, This line works fine and calls the function “newFunc” perfectly. but the same line is not working in Yes button. Please tell me.

Thanks

Answer 1

In similar situation I had used such approach:

 function showYesNoAlertMsg(divId, optFunction, optFunctionParams) {
      if (!$.isArray(optFunctionParams)) {
           optFunctionParams = Array.prototype.slice.call(arguments, 2);
      }

      $('#' + divId).dialog({
           autoOpen: true,
           width: 400,
           height: 175,
           modal: true,
           resizable: false,
           buttons: {
                "Yes": function () {
                     if (optFunction && typeof optFunction == "function") {
                          optFunction.apply(window, optFunctionParams || []);
                     }
                     $(this).dialog("close");
                },
                "No": function () {
                     $(this).dialog("close");
                }
           }
      });
 }

 function newfunc(a, b) {
      alert(a + '--' + b);
 }

 <input type="button" name="alert" id="alert" value="Click Me"
      onclick="showYesNoAlertMsg('boxDivId', newfunc, ['aaaaa','bbbbb']);" />

If you want to use arguments, you need to cache it value in showYesNoAlertMsg context into some variable as in Yes button’s click event handler it’s already an arguments of this handler function