Category: JavaScript

  • Filter dijits using dojo.query

    Yesterday I struggled to find a way to filter all dijits in a root container (in my case a simple <div>) to toggle their enabled/disabled state. The approach I was using before looked like this:

    dojo.query("input, button, textarea, select", rootContainer).attr("disabled", disable);
    

    This approach used to work fine until I also wanted to include <buttons>. Unfortunately, dojo.query() failed to filter buttons… Every scenario I’ve tried only revealed inputs (except input type=button), textareas, selects, etc.

    Anyway, the solution was to filter all DOM-nodes by their “widgetId” attribute and convert to their respective dijits through dijit.byNode, as explained by dante in http://stackoverflow.com/questions/1372013/dojo-disable-all-input-fields-in-div-container.

    Thus, the final solution I came up with was to use a wrapper function:

    /**
     * Disables all dijits found in rootContainer specified. The params directly
     * refer to dojo.quer().
     * @param String limitations
     * @param String|Object rootContainer
     */
    disableDijits : function(limitations, rootContainer) {
      var widgets = dojo.query(limitations, rootContainer).map(dijit.byNode);
      dojo.forEach(widgets, function(w) {
        w.attr('disabled', disable);
      });
    }