lixinru
/
YtIoT


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
							<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>The source code</title>
  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  <style type="text/css">
    .highlight { display: block; background-color: #ddd; }
  </style>
  <script type="text/javascript">
    function highlight() {
      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
    }
  </script>
</head>
<body onload="prettyPrint(); highlight();">
  <pre class="prettyprint lang-js"><span id='Ext-grid-CellEditor'>/**
</span> * Internal utility class that provides default configuration for cell editing.
 * @private
 */
Ext.define('Ext.grid.CellEditor', {
    extend: 'Ext.Editor',
    constructor: function(config) {
        config = Ext.apply({}, config);
        
        if (config.field) {
            config.field.monitorTab = false;
        }
        this.callParent([config]);
    },
    
<span id='Ext-grid-CellEditor-method-onShow'>    /**
</span>     * @private
     * Hide the grid cell text when editor is shown.
     *
     * There are 2 reasons this needs to happen:
     *
     * 1. checkbox editor does not take up enough space to hide the underlying text.
     *
     * 2. When columnLines are turned off in browsers that don't support text-overflow:
     *    ellipsis (firefox 6 and below and IE quirks), the text extends to the last pixel
     *    in the cell, however the right border of the cell editor is always positioned 1px
     *    offset from the edge of the cell (to give it the appearance of being &quot;inside&quot; the
     *    cell.  This results in 1px of the underlying cell text being visible to the right
     *    of the cell editor if the text is not hidden.
     * 
     * We can't just hide the entire cell, because then treecolumn's icons would be hidden
     * as well.  We also can't just set &quot;color: transparent&quot; to hide the text because it is
     * not supported by IE8 and below.  The only remaining solution is to remove the text
     * from the text node and then add it back when the editor is hidden.
     */
    onShow: function() {
        var me = this,
            innerCell = me.boundEl.first(),
            lastChild,
            textNode;

        if (innerCell) {
            lastChild = innerCell.dom.lastChild;
            if(lastChild &amp;&amp; lastChild.nodeType === 3) {
                // if the cell has a text node, save a reference to it
                textNode = me.cellTextNode = innerCell.dom.lastChild;
                // save the cell text so we can add it back when we're done editing
                me.cellTextValue = textNode.nodeValue;
                // The text node has to have at least one character in it, or the cell borders
                // in IE quirks mode will not show correctly, so let's use a non-breaking space.
                textNode.nodeValue = '\u00a0';
            }
        }
        me.callParent(arguments);
    },

<span id='Ext-grid-CellEditor-method-onHide'>    /**
</span>     * @private
     * Show the grid cell text when the editor is hidden by adding the text back to the text node
     */
    onHide: function() {
        var me = this,
            innerCell = me.boundEl.first();

        if (innerCell &amp;&amp; me.cellTextNode) {
            me.cellTextNode.nodeValue = me.cellTextValue;
            delete me.cellTextNode;
            delete me.cellTextValue;
        }
        me.callParent(arguments);
    },

<span id='Ext-grid-CellEditor-method-afterRender'>    /**
</span>     * @private
     * Fix checkbox blur when it is clicked.
     */
    afterRender: function() {
        var me = this,
            field = me.field;

        me.callParent(arguments);
        if (field.isXType('checkboxfield')) {
            field.mon(field.inputEl, {
                mousedown: me.onCheckBoxMouseDown,
                click: me.onCheckBoxClick,
                scope: me
            });
        }
    },
    
<span id='Ext-grid-CellEditor-method-onCheckBoxMouseDown'>    /**
</span>     * @private
     * Because when checkbox is clicked it loses focus  completeEdit is bypassed.
     */
    onCheckBoxMouseDown: function() {
        this.completeEdit = Ext.emptyFn;
    },
    
<span id='Ext-grid-CellEditor-method-onCheckBoxClick'>    /**
</span>     * @private
     * Restore checkbox focus and completeEdit method.
     */
    onCheckBoxClick: function() {
        delete this.completeEdit;
        this.field.focus(false, 10);
    },
    
<span id='Ext-grid-CellEditor-method-realign'>    /**
</span>     * @private
     * Realigns the Editor to the grid cell, or to the text node in the grid inner cell
     * if the inner cell contains multiple child nodes.
     */
    realign: function(autoSize) {
        var me = this,
            boundEl = me.boundEl,
            innerCell = boundEl.first(),
            children = innerCell.dom.childNodes,
            childCount = children.length,
            offsets = Ext.Array.clone(me.offsets),
            inputEl = me.field.inputEl,
            lastChild, leftBound, rightBound, width;

        // If the inner cell has more than one child, or the first child node is not a text node,
        // let's assume this cell contains additional elements before the text node.
        // This is the case for tree cells, but could also be used to accomodate grid cells that
        // have a custom renderer that render, say, an icon followed by some text for example
        // For now however, this support will only be used for trees.
        if(me.isForTree &amp;&amp; (childCount &gt; 1 || (childCount === 1 &amp;&amp; children[0].nodeType !== 3))) {
            // get the inner cell's last child
            lastChild = innerCell.last();
            // calculate the left bound of the text node
            leftBound = lastChild.getOffsetsTo(innerCell)[0] + lastChild.getWidth();
            // calculate the right bound of the text node (this is assumed to be the right edge of
            // the inner cell, since we are assuming the text node is always the last node in the
            // inner cell)
            rightBound = innerCell.getWidth();
            // difference between right and left bound is the text node's allowed &quot;width&quot;,
            // this will be used as the width for the editor.
            width = rightBound - leftBound;
            // adjust width for column lines - this ensures the editor will be the same width
            // regardless of columLines config
            if(!me.editingPlugin.grid.columnLines) {
                width --;
            }
            // set the editor's x offset to the left bound position
            offsets[0] += leftBound;

            me.addCls(Ext.baseCSSPrefix + 'grid-editor-on-text-node');
        } else {
            width = boundEl.getWidth() - 1;
        }

        if (autoSize === true) {
            me.field.setWidth(width);
        }

        me.alignTo(boundEl, me.alignment, offsets);
    },
    
    onEditorTab: function(e){
        var field = this.field;
        if (field.onEditorTab) {
            field.onEditorTab(e);
        }
    },

    alignment: &quot;tl-tl&quot;,
    hideEl : false,
    cls: Ext.baseCSSPrefix + &quot;small-editor &quot; + Ext.baseCSSPrefix + &quot;grid-editor&quot;,
    shim: false,
    shadow: false
});</pre>
</body>
</html>