samedi 27 juin 2015

How to hide a button from jQuery Dialog UI?

I am trying to hide a button from the jQuery UI dialog button when the dialog open. Then I want to show it if a condition met.

I wrote code in the open method that will add a css code to disable the button. I have also tried to call .show() and .hide() methods but that still did not work.

I am not sure how I would be able to hide/show a button in jQuery

Here is my code

function initializeDialog(){ 

    //initialize the dialog box
    $(".ICWSinboundDialog").dialog({
        resizable: true,
        width: 500,
        modal: true,
        autoOpen: false,
        stack: false,
        open: function(){
            $('#btnAnswerAndShow').css("display","none");

        },
        buttons: [
            {
            id: "btnAnswerAndShow",
            text: "Answer - Display",
            click: function(e) {
                  //do something
                }
            },
            {
            id: "btnAnswer",
            text: "Answer",
            click: function(e) {
                    //do something

                }
            },
            {
            id: "btnVM",
            text: "Send to Voice Mail",
            click: function(e) {
                    //do something
                }
            },
            {
            id: "btnHold",
            text: "Hold",
            click: function(e) {
                //do something
                }
            }
        ]
    });
}

The DIV for the dialogs are created on the fly like so

        var prefix = 'ICWS_';
        var interactionId = '123456';
        var dialogID = '#' + prefix + interactionId;

        //create a dialog box if one does not already exists
        if( $(dialogID).length == 0) {
            $('#ICWSDialogs').append('<div class="ICWSinboundDialog icwsDialogWrapper" id="'+ prefix + interactionId +'" style="display: none;"></div>');
        } 
        //initialize the dialog after creating the new dialog
        initializeDialog();

And later down the code I can open this dialog like so

if( $(dialogID).length > 0) {
     $(dialogID).dialog('open');
}

this is my HTML markup

<div id="ICWSDialogs"></div>

Aucun commentaire:

Enregistrer un commentaire