missing : after property id in JQuery.inArray(value, array)

Question

I'm getting a firebug error:

missing : after property id error source line:

if(jQuery.inArray(mmDialogButton.CANCEL, buttons)){ 

This is the surrunding code:

Edited post with update as I was unclear. I am trying to create a framework for creating dialogues for a project. In the dialogs there can be four predefined buttons. The mmDialogButton is my attempt to an ENUM class. The if statement is there to enable the buttons the user wanted to use in the dialog.

Here is some more code to illustrate.

mmDialog.js

...

function mmDialog(title, spawnerId, widget, buttons){
...
$dialog.html(widget.getInitialHTML())
        .dialog({
            autoOpen: false,
            title: title + ' <img id="myJquerySpinner" />',
            buttons: {
                if(jQuery.inArray(mmDialogButton.CANCEL, buttons)){
                    Cancel: function() {
                        $( this ).dialog( "close" );
                    },
                }
                if(jQuery.inArray(mmDialogButton.NEXT, buttons)){
                    "Next": function() {
                        widget.doNext();
                    },
                }
                if(jQuery.inArray(mmDialogButton.PREVIOUS, buttons)){
                    "Previous": function() {
                        widget.doPrevious();
                    },
                }
                if(jQuery.inArray(mmDialogButton.OK, buttons)){
                    "Ok": function() {
                        widget.doOk();
                    }
                }
            }...

mmDialogButton.js

function mmDialogButton(){  // Constructor

}

mmDialogButton.CANCEL = function() { return "mmDBCancel"; };
mmDialogButton.OK = function() { return "mmDBOk"; };
mmDialogButton.NEXT = function() { return "mmDBNext"; };
mmDialogButton.PREVIOUS = function() { return "mmDBPrevious"; };

jsp/html page

            var title = "Test Dialog";
            var spawnerId = "myJqueryStarter";

            var mmDialogButtons = new Array();
            mmDialogButtons[0] = mmDialogButton.CANCEL; 
            mmDialogButtons[1] = mmDialogButton.OK; 
            mmDialogButtons[2] = mmDialogButton.NEXT; 
            mmDialogButtons[3] = mmDialogButton.PREVIOUS; 

            myPublishWidget = new mmPublishWidget();
            myDialogPublishWidget = new mmDialogWidget(myPublishWidget);
            myDialog = new mmDialog(title, spawnerId, myDialogPublishWidget , mmDialogButtons);

Answer 1

This:

buttons: {
    if(jQuery.inArray(mmDialogButton.CANCEL, buttons)){
      Cancel: function() {
      $( this ).dialog( "close" );
    },

should probably be:

buttons: (function() {
    if(jQuery.inArray(mmDialogButton.CANCEL, buttons))
      return {
        Cancel: function() {
          $( this ).dialog( "close" );
         }
       };
       return null;
    })()

though it's hard to tell. What it looks like you're trying to do is conditionally set that "buttons" property to some object with a labeled handler (that little "close" function). However, the code you posted is syntactically nonsensical. The change I made wraps the "inArray" test in an anonymous function that returns the button object only when that test is true .

Again, I'm just guessing that that's what you were trying to do.

Answer 2

I think you mean to execute the "close" only if CANCEL is in buttons, if it's the case you can write:

buttons: {
    Cancel: function() {
              if(jQuery.inArray(mmDialogButton.CANCEL, buttons)){
                 $( this ).dialog( "close" );
              }
            },
    ....

EDIT:

you can define the buttons dictionary beforehand as you like, the pass it to .dialog( :

dialog_buttons = {}

if(jQuery.inArray(mmDialogButton.CANCEL, buttons)){
 dialog_buttons[Cancel] = function() {
                             $( this ).dialog( "close" );
                          }
}

if(jQuery.inArray(mmDialogButton.NEXT, buttons)){
 dialog_buttons["Next"] = function() {
                             widget.doNext();
                          }
}

if(jQuery.inArray(mmDialogButton.PREVIOUS, buttons)){
 dialog_buttons["Previous"] = function() {
                                 widget.doPrevious();
                              }
}

if(jQuery.inArray(mmDialogButton.OK, buttons)){
 dialog_buttons["Ok"] = function() {
                           widget.doOk();
                        }
}

$dialog.html(widget.getInitialHTML())
        .dialog({
            autoOpen: false,
            title: title + ' <img id="myJquerySpinner" />',
            buttons: dialog_buttons
            }...