PDA

View Full Version : [CLOSED] TreePanel Qtips double html encoded



bogc
Jan 05, 2013, 1:50 AM
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>

Vladimir
Jan 05, 2013, 5:07 PM
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

bogc
Jan 07, 2013, 4:51 PM
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

Vladimir
Jan 07, 2013, 5:10 PM
I suggest to use version 2.1.1 (from Nuget or get it from 'branch 2' in SVN)

bogc
Jan 07, 2013, 5:15 PM
Sorry, my mistake, I am already using 2.1.1.

Vladimir
Jan 07, 2013, 5:35 PM
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

bogc
Jan 07, 2013, 5:45 PM
I downloaded it from this link: https://github.com/downloads/extnet/Ext.NET.Pro/Ext.NET.MVC.Pro.2.1.1.zip

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

Thanks

Vladimir
Jan 07, 2013, 6:07 PM
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;
}
});

bogc
Jan 07, 2013, 6:18 PM
The override works.

Thank you!