dojo button is not disabled

Question

I am having problems with dojo button. I would like disabled other dojo buttons when I click on a button.

var show = new Button({
    label: _('Button'),
    onClick: function () {                                                                                                                    
        var buttonsChange = query('.changeButton');
        buttonsChange.attr('disabled',true);        
    }
});

and html code generated is this:

<span class="btn" dojoattachpoint="iconNode" dojoattachevent="ondijitclick:_onClick" widgetid="change_2">
    <button type="submit" dojoattachpoint="focusNode" tabindex="0"   id="change_2" class="changeButton" style="-webkit-user-select: none;">
            <span dojoattachpoint="containerNode">Change priority</span>
    </button>
</span>

Thanks in advance.

Answer 1

What you need is the widget (using dijit/registry for instance). And not the domnode

require(['dijit/form/Button', 'dijit/registry', 'dojo/query', 'dojo/domReady!'], function(Button, registry, query) { 

var testDiv = document.getElementById('test');

var btn1 = new Button({
    label: 'click to disable button 2 and button 3',
    onClick: function () {                                                                                                                    
      var buttonsChange = query('.changeButton');
      buttonsChange.forEach(function(button) {
        registry.byNode(button).set('disabled', true);
      });        
    }
}).placeAt(testDiv);
  
var btn2 = new Button({
    label: 'button 2',
    'class': 'changeButton'
}).placeAt(testDiv);
  
var btn3 = new Button({
    label: 'button 3',
    'class': 'changeButton'
}).placeAt(testDiv);
  
});

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/resources/dojo.css"> 
<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/tundra/tundra.css">

<div class="tundra" id="test"></div>