ext.net GridPanel 加上悬浮提示

在ext.net中，常常遇到某一列不够宽，毕竟业务都是变的很快的，所以我们可以在悬浮某一列的时候给其加上tips，这样就算再多的内容也不怕了。

下面介绍2中加tips的方式：

1、只想给指定列加tips

a、c#代码

  <ext:Column ColumnID="INTICKET_PTTI" DataIndex="INTICKET_PTTI" Header="检票口" Width="90"
                    Align="Center" Wrap="true">
                    <Renderer Fn="RenderRow" />
                </ext:Column>

 

b、js代码

 

 function RenderRow(value, meta, rec, rowIndex, coIndex, ds) {
            if (value != null && value != "") {
                var tips = "<div ext:qtitle='' ext:qtip='" + value + "'>" + value + "</div>";
                return tips;
            }
        };

 

2、给所有列加上tips

 a、在GridPanel外面加上

 <ext:ToolTip ID="RowTip" runat="server" Target="={GridPanel1.getView().mainBody}"
        Delegate=".x-grid3-cell" TrackMouse="true" AutoWidth="true" AutoHeight="true">
        <Listeners>
            <Show Fn="showTip" />
        </Listeners>
    </ext:ToolTip>

 

b、js代码

  var showTip = function () {
            var rowIndex = GridPanel1.view.findRowIndex(this.triggerElement),
                cellIndex = GridPanel1.view.findCellIndex(this.triggerElement),
                record = Store1.getAt(rowIndex),
                fieldName = GridPanel1.getColumnModel().getDataIndex(cellIndex),
                data = record.get(fieldName);

            this.body.dom.innerHTML = data;
        };

如此这般那般就好了。