[CLOSED] Regarding Ext.QuickTips.init()

[nhg_itd]

hi,

just curious, might help abit for performace on loading in grid

is there any differences (in rendering specially) when we execute quicktip.init once in page, with executing the init in each qtip ?

understand that executing once is enough per page.

[Daniil]

Hi,


Initialization of Ext.QuickTips is required to get quick tips working.

with executing the init in each qtip

Do you mean registering?

I think tag-based quick tips gives the best performance in the case with quick tips.

Also I would suggest to consider to use an <ext:ToolTip>.
https://examples1.ext.net/#/Miscella..._Cell_Tooltip/

[nhg_itd]

Hi,


Initialization of Ext.QuickTips is required to get quick tips working.



Do you mean registering?

I think tag-based quick tips gives the best performance in the case with quick tips.

Also I would suggest to consider to use an <ext:ToolTip>.
https://examples1.ext.net/#/Miscella..._Cell_Tooltip/

yes.

means...i initialize the Ext.QuickTips.init() everytime I need to put qtip
or its better (performace wise) to just initialize once.

[Daniil]

This

Ext.QuickTips.init()

should be called once and it is done by default in Ext.NET, so, you should not manually call it at all.

[nhg_itd]

which one is better (performance wise)

    <ext:Window ID="Window_AdvancedSearch" runat="server" >
        <Items>
            <ext:Panel id="Panel_AdvancedSearch" runat="server" AutoHeight="true" Padding="2">
                <Items>
						<ext:Radio ID="Radio_Location_PatCurrent" runat="server" BoxLabel="Active Inpatient Current">
							<Listeners>                                                                                                                                        
								<Render Handler="Ext.QuickTips.init();Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_PatCurrent} .x-form-cb-label')).set({'ext:qtip':'Active Inpatient Current Location'}); Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_PatCurrent}')).set({'ext:qtip':'Active Inpatient Current Location'}); " />
							</Listeners>
						</ext:Radio>				
						<ext:Radio ID="Radio_Location_Order" runat="server" BoxLabel="Order">
							<Listeners>                                                                                                                                        
								<Render Handler="Ext.QuickTips.init();Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_Order} .x-form-cb-label')).set({'ext:qtip':'Ordering Location'}); Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_Order}')).set({'ext:qtip':'Ordering Location'}); " />
							</Listeners>
						</ext:Radio>
				</Items>
			</ext:Panel>
		</Items>
    </ext:Window>

or

    <ext:Window ID="Window_AdvancedSearch" runat="server" >
        <Items>
            <ext:Panel id="Panel_AdvancedSearch" runat="server" AutoHeight="true" Padding="2">
                <Items>
						<ext:Radio ID="Radio_Location_PatCurrent" runat="server" BoxLabel="Active Inpatient Current">
							<Listeners>                                                                                                                                        
								<Render Handler="Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_PatCurrent} .x-form-cb-label')).set({'ext:qtip':'Active Inpatient Current Location'}); Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_PatCurrent}')).set({'ext:qtip':'Active Inpatient Current Location'}); " />
							</Listeners>
						</ext:Radio>				
						<ext:Radio ID="Radio_Location_Order" runat="server" BoxLabel="Order">
							<Listeners>                                                                                                                                        
								<Render Handler="Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_Order} .x-form-cb-label')).set({'ext:qtip':'Ordering Location'}); Ext.get(Ext.DomQuery.select('##{RadioColumn_Location_Order}')).set({'ext:qtip':'Ordering Location'}); " />
							</Listeners>
						</ext:Radio>
				</Items>
			</ext:Panel>
		</Items>
        <Listeners>
            <Show Handler="Ext.QuickTips.init();" />
        </Listeners>
    </ext:Window>

[nhg_itd]

This

Ext.QuickTips.init()

should be called once and it is done by default in Ext.NET, so, you should not manually call it at all.

IC....tq for the qtip.

but somehow, in IE7

gridpanel with renderer to create tooltip, doesn't work unless you put the init.

[Daniil]

Repeat myself, I don't think you need to call

Ext.QuickTips.init();

at all.

It might be implemented the following way.

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Window runat="server">
            <Items>
                <ext:Radio runat="server" BoxLabel="Radio 1">
                    <Listeners>
                        <Render Handler="var qtip = {
                                             'ext:qtip' : this.boxLabel
                                         };
                                         this.el.set(qtip);
                                         this.labelEl.set(qtip);" />
                    </Listeners>
                </ext:Radio>
                <ext:Radio runat="server" BoxLabel="Radio 2">
                    <Listeners>
                        <Render Handler="var qtip = {
                                             'ext:qtip' : this.boxLabel
                                         };
                                         this.el.set(qtip);
                                         this.labelEl.set(qtip);" />
                    </Listeners>
                </ext:Radio>
            </Items>
        </ext:Window>
    </form>
</body>
</html>

[Daniil]

IC....tq for the qtip.

but somehow, in IE7

gridpanel with renderer to create tooltip, doesn't work unless you put the init.

Could you provide a sample to reproduce?

[nhg_itd]

working sample

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm15.aspx.cs" Inherits="ExtNetTest.WebForm15" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <script type="text/javascript">
        var CheckboxGroupRenderer = function(value, meta, record, rowIndex, colIndex, store) {
            //Ext.QuickTips.init();
            meta.attr += 'ext:qtip="this is not showing  ' + value + '"';
            return '<div>' + value + '</div>';
        };
        var CreateGroupByDate = function(value, meta, record, rowIndex, colIndex, store) {
            //Ext.QuickTips.init();    
            meta.attr += 'ext:qtip="this is not showing ' + value + '"';
            return '<div>' + value + '</div>';
        };
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager_MultiPatient" runat="server"/>
    <ext:GridPanel ID="GridPanel_Lab_ResultList" runat="server" IDMode="Explicit" EnableColumnMove="false" Height="400">
        <Store>
            <ext:Store ID="Store_Lab_ResultList" runat="server" AutoLoad="true" >
                <Reader>
                    <ext:JsonReader IDProperty="RecordId">
                        <Fields>
                            <ext:RecordField Name="RecordId" />
                            <ext:RecordField Name="TestDate" />
                        </Fields>
                    </ext:JsonReader>
                </Reader>
            </ext:Store>
        </Store>    
        <ColumnModel ID="ColumnModel_LabResult_GridPanel" runat="server">  
            <Columns>
                <ext:Column Header="" Width="75" DataIndex="RecordId" MenuDisabled="true" Sortable="false" Resizable="false" Fixed="true">
                    <Renderer Fn="CheckboxGroupRenderer" />
                </ext:Column> 
                <ext:Column Header="TEST DATE/TIME" Width="80" DataIndex="TestDate" MenuDisabled="true" Sortable="false" Resizable="false" Fixed="true" Tooltip="TEST DATE/TIME">
                    <Renderer Fn="CreateGroupByDate" />
                </ext:Column>
            </Columns>
        </ColumnModel>
        <LoadMask ShowMask="true" />
    </ext:GridPanel>
    
    </form>
</body>
</html>

        protected void Page_Load(object sender, EventArgs e)
        {
            this.Store_Lab_ResultList.DataSource = Data;
            this.Store_Lab_ResultList.DataBind();
        }
        private List<object> Data
        {
            get
            {
                DateTime now = DateTime.Now;

                object[] b = 
                new object[]
                {
                    new object[] { "3m Co", now.ToString().ToString() },
                    new object[] { "Alcoa Inc", now.ToString().ToString() },
                    new object[] { "Altria Group Inc", now.ToString().ToString() },
                    new object[] { "American Express Company", now.ToString() },
                    new object[] { "American International Group, Inc.", now.ToString() },
                    new object[] { "AT&T Inc.", now.ToString() },
                    new object[] { "Boeing Co.", now.ToString() },
                    new object[] { "Caterpillar Inc.", now.ToString() },
                    new object[] { "Citigroup, Inc.", now.ToString() },
                    new object[] { "E.I. du Pont de Nemours and Company", now.ToString() },
                    new object[] { "Exxon Mobil Corp", now.ToString() },
                };

                List<object> p = new List<object>();

                foreach (object[] x in b)
                {
                    p.Add(new { RecordId = x[0].ToString(), TestDate = x[1].ToString() });
                }

                return p;
            }
        }

[nhg_itd]

Repeat myself, I don't think you need to call
[CODE]Ext.QuickTips.init();

its weird.
I even can't show the tooltip from your sample. i must put init() 1st then it came out.

I'm using v1.2 downloaded not svn

and its happening in IE8 also