View Full Version : [UNKNOWN][3.0.3] Unselectable text is sometimes selectable

7 Dec 2009, 10:18 AM
Ext version tested:

Ext 3.0.3

Adapter used:


css used:

only default ext-all.css

Browser versions tested against:


Operating System:

WinXP Pro

IE has an HTML attribute "unselectable", whereas other browsers have special CSS attributes:

/* from ext-all.css */
.x-unselectable, .x-unselectable * {
-moz-user-select: none;
-khtml-user-select: none;
Thus, to make an element unselectable, it must take the following form:

<div unselectable="on" class="x-unselectable">Ext.Element does provide an unselectable() method that takes care of this. However, this method is not consequently used. For example:

Ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){

/** @private */
this.el = Ext.get(dragElement, true);
this.el.dom.unselectable = "on"; // should be this.el.unselectable();
Also, several templates use only one of unselectable="on" / class="x-unselectable", where both should be used
(for example, Ext.ListView.initComponent)

Possible fix:

Always use

<tagname unselectable="on" class="x-unselectable">in templates.

Do not use el.dom.unselectable = "on" on Elements. Use el.unselectable() instead.

Add "-webkit-user-select: ignore" to Element.unselectable method's implementation.

(To make it really bullet-proof, one could add

*[unselectable="on"], *[unselectable="on"] * {
-moz-user-select: none;
-khtml-user-select: none;
}to ext-all.css)