Jan 20, 2015, 5:23 PM
[OPEN] [#649] When Tree selection is not set to TreeSelectionModel, node is selected when it's expanded
In 12/04/2014 i opened a thread related to node selection after its expansion http://forums.ext.net/showthread.php...-it-s-expanded.
In 14/01/2015 i confirmed that it has been fixed on version 3.1.
But at this time i found another issue regarding node expansion.
When TreePanel's SelecionModel is set to TreeSelectionModel (default), everything works as expected.
But when TreePanel's SelecionModel is set to CheckboxSelectionModel, RowSelectionModel or CellSelectionModel, the node is selected when it's expanded.
As mentioned on the related thread, it's possible to overcome this issue by overriding Ext.grid.NavigationModel.onCellClick, as shown below:
Note: It only fixes CheckboxSelectionModel and RowSelectionModel
In 14/01/2015 i confirmed that it has been fixed on version 3.1.
But at this time i found another issue regarding node expansion.
When TreePanel's SelecionModel is set to TreeSelectionModel (default), everything works as expected.
But when TreePanel's SelecionModel is set to CheckboxSelectionModel, RowSelectionModel or CellSelectionModel, the node is selected when it's expanded.
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" Theme="Gray" ScriptMode="Debug" runat="server" />
<ext:TreePanel RootVisible="false" Title="Ext.Net" Height="700" Width="500" runat="server">
<Store>
<ext:TreeStore runat="server">
<Proxy>
<ext:AjaxProxy Url="~/Example/LoadTreeFakeChildren">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader RootProperty="data" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Name" />
</Fields>
</ext:Model>
</Model>
</ext:TreeStore>
</Store>
<Root>
<ext:Node NodeID="0" Text="Root" />
</Root>
<ColumnModel>
<Columns>
<ext:TreeColumn Text="Name" DataIndex="Name" Flex="2" runat="server" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CheckboxSelectionModel runat="server" />
</SelectionModel>
</ext:TreePanel>
</body>
</html>
namespace SandBox.Controllers
{
public class ExampleController : System.Web.Mvc.Controller
{
public ActionResult Index()
{
return View();
}
public StoreResult LoadTreeFakeChildren()
{
NodeCollection nodes = new NodeCollection(false);
for (int index = 1; index < 6; index++)
{
Node node = new Node();
node.NodeID = index.ToString() + DateTime.Now.Second;
node.CustomAttributes.Add(new ConfigItem { Name = "Name", Value = node.NodeID, Mode = ParameterMode.Value });
nodes.Add(node);
}
return new StoreResult { Data = nodes.ToJson() };
}
}
}
As mentioned on the related thread, it's possible to overcome this issue by overriding Ext.grid.NavigationModel.onCellClick, as shown below:
Note: It only fixes CheckboxSelectionModel and RowSelectionModel
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<script type="text/javascript">
Ext.override(Ext.grid.NavigationModel, {
onCellClick: function (view, cell, cellIndex, record, row, recordIndex, clickEvent) {
if (Ext.isEmpty(clickEvent.target.className) || clickEvent.target.className.indexOf("expander") < 0) {
if (this.position.isEqual(clickEvent.position)) {
this.fireNavigateEvent(clickEvent);
} else {
this.setPosition(clickEvent.position, null, clickEvent);
}
}
}
});
</script>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" Theme="Gray" ScriptMode="Debug" runat="server" />
<ext:TreePanel RootVisible="false" Title="Ext.Net" Height="700" Width="500" runat="server">
<Store>
<ext:TreeStore runat="server">
<Proxy>
<ext:AjaxProxy Url="~/Example/LoadTreeFakeChildren">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader RootProperty="data" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Name" />
</Fields>
</ext:Model>
</Model>
</ext:TreeStore>
</Store>
<Root>
<ext:Node NodeID="0" Text="Root" />
</Root>
<ColumnModel>
<Columns>
<ext:TreeColumn Text="Name" DataIndex="Name" Flex="2" runat="server" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel runat="server" />
</SelectionModel>
</ext:TreePanel>
</body>
</html>
Last edited by Daniil; Jan 22, 2015 at 5:36 PM.
Reason: [OPEN] [#649]