[CLOSED] TreePanel Qtips double html encoded

  1. #1

    [CLOSED] TreePanel Qtips double html encoded

    I noticed that in Ext.Net 2 node qtips have to be double encoded if one wants to display html chars in the qtip.

    See the code below. In Ext.Net 1.5 one encoding worked. Is there a way to revert to the old behavour?

    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Multi Node TreePanel built using markup - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server"  SourceFormatting="True"/>
            
            <h1>Multi Node TreePanel built using markup</h1>       
            
            <ext:TreePanel 
                ID="TreePanel1" 
                runat="server" 
                Width="300" 
                Height="450" 
                Icon="BookOpen" 
                Title="Catalog" 
                AutoScroll="true"
                RowLines="True">
                <TopBar>
                    <ext:Toolbar runat="server">
                        <Items>
                            <ext:Button ID="Button1" runat="server" Text="Expand All">
                                <Listeners>
                                    <Click Handler="#{TreePanel1}.expandAll();" />
                                </Listeners>
                            </ext:Button>
                            <ext:Button ID="Button2" runat="server" Text="Collapse All">
                                <Listeners>
                                    <Click Handler="#{TreePanel1}.collapseAll();" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Root>
                    <%--  this shows properly --%>
                    <ext:Node Text="No. 1 - C" Icon="Music" Leaf="False" Qtip="&amp;amp;lt;test&amp;amp;gt;">
                      <Children>
                        <%--  the qtip is empty for this one --%>
                        <ext:Node Text="No. 1 - C" Icon="Music" Leaf="true" Qtip="&amp;lt;test&amp;gt;"/>
                    </Children>
                    </ext:Node>
                </Root>
                <BottomBar>
                    <ext:StatusBar ID="StatusBar1" runat="server" AutoClear="1500" />
                </BottomBar>
                <Listeners>
                    <ItemClick 
                        Handler="#{StatusBar1}.setStatus({text: 'Node Selected: <b>' + record.data.text + '<br />', clear: false});"                     
                        />
                    <ItemExpand 
                        Handler="#{StatusBar1}.setStatus({text: 'Node Expanded: <b>' + item.data.text + '<br />', clear: false});" 
                        Buffer="30"
                        />
                    <ItemCollapse 
                        Handler="#{StatusBar1}.setStatus({text: 'Node Collapsed: <b>' + item.data.text + '<br />', clear: false});" 
                        Buffer="30"
                        />
                </Listeners>
                <SelectionModel>
                  <ext:RowSelectionModel runat="server" Mode="Single" AllowDeselect="False"></ext:RowSelectionModel>
                </SelectionModel>
            </ext:TreePanel>
        </form>
    </body>
    </html>
    For Ext.Net 1.5 try this:

                    <ext:TreeNode Text="No. 1 - C -a " Icon="Music" Leaf="False" Qtip="&amp;amp;lt;test&amp;amp;gt;">
                      <Nodes>
                        <ext:TreeNode Text="No. 1 - C" Icon="Music" Leaf="true" Qtip="&amp;lt;test&amp;gt;"/>
                    </Nodes>
                    </ext:TreeNode>
    Last edited by Daniil; Jan 08, 2013 at 8:36 AM. Reason: [CLOSED]
  2. #2
    I see '&lt;test&gt;' for root node and '<test>' for child node in tooltip
    Do you have another result?

    I tested with trunk version
  3. #3
    I just updated to the latest Trunk version and I can confirm that it is working properly.

    The version that I tested was 2.1.0 and a 2.2 trunk version from before the holidays. I thought the issue had to do with ExtJs 4.1/4.2...

    Do you know what change could have affected this behaviour? Is there a way to fix this in version 2.1.0 other than encoding the qtips twice?

    Right now I am upgrading an app from 1.5 to 2.1. I am reluctant to use trunk because it is a moving target at a too faster of a pace and I am also a bit concerned about ExtJs 4.2.

    Thanks
  4. #4
    I suggest to use version 2.1.1 (from Nuget or get it from 'branch 2' in SVN)
  5. #5
    Sorry, my mistake, I am already using 2.1.1.
  6. #6
    Well, 2.1.1 should not have such issue, I investigated ExtJS code and encoding is absent in 2.1.1
    Did you get Ext.Net from SVN or Nuget? If from SVN then what path did you use?
    Correct path is
    http://svn.ext.net/premium/branches/2
  7. #7
    I downloaded it from this link: https://github.com/downloads/extnet/....Pro.2.1.1.zip

    The version number of the Ext.Net.dll is 2.1.1.18233.

    Thanks
  8. #8
    Try the following override
            Ext.tree.View.override({
                collectData: function(records) {
                    var data = this.callParent(arguments),
                        rows = data.rows,
                        len = rows.length,
                        i = 0,
                        row, record;
    
    
                    for (; i < len; i++) {
                        row = rows[i];
                        record = records[i];
                        if (record.get('qtip')) {
                            row.rowAttr = 'data-qtip="' + Ext.util.Format.htmlEncode(record.get('qtip')) + '"';
                            if (record.get('qtitle')) {
                                row.rowAttr += ' ' + 'data-qtitle="' + Ext.util.Format.htmlEncode(record.get('qtitle')) + '"';
                            }
                        }
                        if (record.isExpanded()) {
                            row.rowCls = (row.rowCls || '') + ' ' + this.expandedCls;
                        }
                        if (record.isLeaf()) {
                            row.rowCls = (row.rowCls || '') + ' ' + this.leafCls;
                        }
                        if (record.isLoading()) {
                            row.rowCls = (row.rowCls || '') + ' ' + this.loadingCls;
                        }
                    }
    
    
                    return data;
                }
            });
  9. #9
    The override works.

    Thank you!

Similar Threads

  1. [CLOSED] [#14] Tree Panel Bug double click
    By Kev in forum 2.x Legacy Premium Help
    Replies: 8
    Last Post: Feb 27, 2014, 3:42 PM
  2. [CLOSED] HtmlEditor text is rendered HTML encoded
    By vadym.f in forum 1.x Legacy Premium Help
    Replies: 8
    Last Post: Feb 22, 2012, 3:04 PM
  3. Replies: 2
    Last Post: Aug 04, 2011, 2:14 PM
  4. [CLOSED] [1.0] ComboBox with HTML encoded data
    By danielg in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: May 20, 2010, 8:55 AM
  5. 0.82 encoded html getting decoded on store
    By [WP]joju in forum 1.x Help
    Replies: 15
    Last Post: Dec 23, 2009, 6:40 AM

Posting Permissions