CODEWITHSUNDEEP
dojofocus
Nisanth Sojan
Nisanth Sojan

Reputation: 1099

Dojo:how to find if the widget has focus in dojo

how do I find out if my custom widget has focus in Dojo?

i have dojo editor i wnat to know if the editor has already focus or not?

Upvotes: 2

Views: 3645

Answers (4)

Fractalizer
Fractalizer

Reputation: 91

a) For dojo 1.6: call dijit.getFocus(). This will return an object containing the currently focused dom node, among other things (selected text, etc.). To get the corresponding widget, simply do:

var activeElement = dijit.getEnclosingWidget(dijit.getFocus().node);

This is the full reference for dijit.getFocus(), from the source code:

// summary:
//      Called as getFocus(), this returns an Object showing the current focus
//      and selected text.
//
//      Called as getFocus(widget), where widget is a (widget representing) a button
//      that was just pressed, it returns where focus was before that button
//      was pressed.   (Pressing the button may have either shifted focus to the button,
//      or removed focus altogether.)   In this case the selected text is not returned,
//      since it can't be accurately determined.
//
// menu: dijit._Widget or {domNode: DomNode} structure
//      The button that was just pressed.  If focus has disappeared or moved
//      to this button, returns the previous focus.  In this case the bookmark
//      information is already lost, and null is returned.
//
// openedForWindow:
//      iframe in which menu was opened
//
// returns:
//      A handle to restore focus/selection, to be passed to `dijit.focus`.

b) For dojo 1.7 and up, use dijit/focus:

require([ "dijit/focus" ], function(focusUtil) {
    var activeElement = focusUtil.curNode; // returns null if there is no focused element
});

Upvotes: 0

Unicornist
Unicornist

Reputation: 932

the question in title has a different answer than the one in the descriptions.

there are two ways achieving the question in the title, by using dojo's focusUtil ("dijit/focus"). both ways give you something that you could find the widget using it and the dijit's registry ("dijit/registry").

  1. focusUtil.curNode: gives you the DOM Node that currently has the focus. the function below, you could get the widget reference.

    function getWidgetByNode(node){
    var result;
    while (!result && node){
        result = registry.byNode(node);
        if (node.parentElement)
            node = node.parentElement;
        else
            node = null;
    }
    return result;
}
var focusedWidget = getWidgetByNode(focusUtil.curNode)

  2. focusUtil.activeStack: gives you an array of the widgets (parent to child) that has the focus. so the last item in the array is the direct widget which has the focus. index values are widget ids, so you should get the widget by the following code

    var focusedWidgetId = focusUtil.activeStack[focusUtil.activeStack.length-1];
var focusedWidget = registry.byId(focusedWidgetId);

now if you want to know if the currently focused widget is some specific one, it depends on what you have in hands from that specific widget:

  1. widget itself: like the return values of above samples. now you have to compare if these are the same thing. you can not compare two widget objects using the == operator. you could compare their ids like this:

    myWidget.id == focusedWidget.id

  2. widget's id: this way you just easily get the id of the current node from focusUtil and compare it with the id you have liek this:

    myWidgetId == focusedWidgetId

references:
http://dojotoolkit.org/reference-guide/1.9/dijit/focus.html
http://dojotoolkit.org/reference-guide/1.9/dijit/registry.html

Upvotes: 3

Sathish RG
Sathish RG

Reputation: 112

require([ "dijit/focus" ], function(focusUtil){
var activeElement = focusUtil.curNode; // returns null if there is no focused element
});

check blow url here you can see some examples http://dojotoolkit.org/reference-guide/1.8/dijit/focus.html#dijit-focus

Upvotes: 0

Pundit Scholar
Pundit Scholar

Reputation: 64

you can use the module dijit/focus to find out the focus

FROM DOJO DOCS

Tracking active widgets

At any point in time there is a set of (for lack of a better word) “active” or “focused” widgets, meaning the currently focused widget and that widget’s ancestors. “Ancestor” can mean either DOM ancestor (ex: TextBox –> Form), or a logical parent-child relationship (ex: TooltipDialog –> DropDownButton).

For example, if focus is on a TextBox inside a TabContainer inside a TooltipDialog triggered by a DropDownButton, the stack would be TextBox –> ContentPane –> TabContainer –> TooltipDialog –> DropDownButton.

The activeStack[] parameter indicates this set of widgets, and an app can monitor changes to activeStack[] by:

require([ "dijit/focus" ], function(focusUtil){
 focusUtil.watch("activeStack", function(name, oldValue, newValue){
  console.log("Focused widget + ancestors: ", newValue.join(", "));
});
});

Upvotes: 3

Related Questions