How to set the button in my toolbar to disabled

Question

I have created a toolbar in my windows 10 UWP winjs app and I want to disable some of the buttons.

I append attributes to the button like so :

new WinJS.UI.Command(null, { 
    disable: true, 
    id: 'cmdSave', 
    label: 'save', 
    section: 'primary', 
    type: 'button', 
    icon: 'save', 
    onclick: clickbuttonprintout() 
});

I have looked through the winjs css files and found many disabled tags. Is it possible to set the button to disabled like I have appended other attributes above ?

Answer 1

Figured this out :

You select the button, set it to disabled and then process it.

var thisBtn = document.getElementById('cmdSave');
thisBtn.disabled = true;
WinJS.UI.process(btn); //this is key

With this in mind, I set up a function so I can pass different buttons to it:

function disableButton(buttonID){
    var btn = document.getElementById(buttonID);
        btn.disabled = true;
        WinJS.UI.process(btn);
}

P.S

Even though this is not part of the question, it may help people.

What about editing the attributes on the button too ? Ive made this function to edit any attribute on a winjs button :

function changeButtonAttributes(buttonId, element, attribute) {
    var btn = document.getElementById(buttonId); //select button
        btn.winControl[element] = attribute; //button.element = attribute
        WinJS.UI.process(btn); //process all
}

Hope that helps :)