Currently we would like to use the RadTileList in a Master/Detail situation. This means that dependent upon the selected tile in the master-tilelist, the detail-tilelist is rendered.
This application scenario works rather well, but fails in the following situation:
1. Open page
-- Ensure nothing is selected and only master items are visible.
2. Click/select a master item, e..g A
-- Ensure that after postback "A" is selected and no detail item is selected.
3. Click/select a detail item, e.g. 2
-- Ensure that after postback "2" is selected
4. Click/select another master item, e.g. B
-- Ensure that after postback "B" is selected and no detail item is selected.
5. Click/select a detail item, e.g. "4"
-- Ensure that after postback "4" is selected <-- BUG, event of TileClick/Selectionchange is not firing and thus is the selection not persisted.
To reproduce this, I've created a new Telerik Web Application (which I cannot currently attach?).
This new web application contains the following implementation of Default.aspx:
And the following implementation of Default.aspx.cs:
I hope you are able to identify why the event is not triggered. One thing that I already noted is that the control id differs before and after the postback (view attached files ctrl_id_before_postback and ctrl_id_after_postback): This might have to do something with the issue.
This application scenario works rather well, but fails in the following situation:
1. Open page
-- Ensure nothing is selected and only master items are visible.
2. Click/select a master item, e..g A
-- Ensure that after postback "A" is selected and no detail item is selected.
3. Click/select a detail item, e.g. 2
-- Ensure that after postback "2" is selected
4. Click/select another master item, e.g. B
-- Ensure that after postback "B" is selected and no detail item is selected.
5. Click/select a detail item, e.g. "4"
-- Ensure that after postback "4" is selected <-- BUG, event of TileClick/Selectionchange is not firing and thus is the selection not persisted.
To reproduce this, I've created a new Telerik Web Application (which I cannot currently attach?).
This new web application contains the following implementation of Default.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
<!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
>
<
telerik:RadStyleSheetManager
id
=
"RadStyleSheetManager1"
runat
=
"server"
/>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"RadScriptManager1"
runat
=
"server"
>
<
Scripts
>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.Core.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQuery.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQueryInclude.js"
/>
</
Scripts
>
</
telerik:RadScriptManager
>
<
script
type
=
"text/javascript"
>
//Put your JavaScript code here.
</
script
>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
>
</
telerik:RadAjaxManager
>
<
div
>
<
telerik:RadTileList
runat
=
"server"
ID
=
"tlMaster"
AutoPostBack
=
"true"
DataSourceID
=
"ldsMaster"
SelectionMode
=
"Single"
OnTileClick
=
"tlMaster_TileClick"
OnSelectionChanged
=
"tlMaster_SelectionChanged"
>
<
DataBindings
>
<
CommonTileBinding
TileType
=
"RadContentTemplateTile"
Shape
=
"Square"
DataNameField
=
"Name"
/>
<
ContentTemplateTileBinding
>
<
ContentTemplate
>
<%#DataBinder.Eval(Container.DataItem, "Description")%>
</
ContentTemplate
>
</
ContentTemplateTileBinding
>
</
DataBindings
>
</
telerik:RadTileList
>
<
asp:LinqDataSource
runat
=
"server"
ID
=
"ldsMaster"
OnSelecting
=
"ldsMaster_Selecting"
></
asp:LinqDataSource
>
</
div
>
<
div
>
<
telerik:RadTileList
runat
=
"server"
ID
=
"tlDetail"
AutoPostBack
=
"true"
DataSourceID
=
"ldsDetail"
SelectionMode
=
"Single"
OnTileClick
=
"tlDetail_TileClick"
>
<
DataBindings
>
<
CommonTileBinding
TileType
=
"RadContentTemplateTile"
Shape
=
"Square"
DataNameField
=
"Name"
/>
<
ContentTemplateTileBinding
>
<
ContentTemplate
>
<%#DataBinder.Eval(Container.DataItem, "Description")%>
</
ContentTemplate
>
</
ContentTemplateTileBinding
>
</
DataBindings
>
</
telerik:RadTileList
>
<
asp:LinqDataSource
runat
=
"server"
ID
=
"ldsDetail"
OnSelecting
=
"ldsDetail_Selecting"
></
asp:LinqDataSource
>
</
div
>
</
form
>
</
body
>
</
html
>
And the following implementation of Default.aspx.cs:
using
System;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
using
System.Data;
using
System.Configuration;
using
System.Web.Security;
using
System.Web.UI.WebControls.WebParts;
using
System.Web.UI.HtmlControls;
using
Telerik.Web.UI;
using
System.Collections.Generic;
using
System.Linq;
public
partial
class
Default : System.Web.UI.Page
{
protected
void
Page_Load(
object
sender, EventArgs e)
{
/* Test case to reproduce issue:
* 1. Open default.aspx
* 2. Click/select a master item, e.g. "A"
* 3. Click/select a detail item, e.g. "2"
* 4. Click/select another master item, e.g. "B"
* -- Currently no detail item is selected. That's good.
* 5. Click/select a detail item, e.g. "4"
* BUG: Click/Select event is not fired and thus is the selection not persisted.
*/
if
(!Page.IsPostBack)
{
this
.tlMaster.DataBind();
}
}
protected
void
tlMaster_TileClick(
object
sender, TileListEventArgs e)
{
foreach
(var tile
in
this
.tlMaster.GetSelectedTiles())
{
tile.Selected =
false
;
}
e.Tile.Selected =
true
;
this
.tlDetail.DataBind();
}
protected
void
tlMaster_SelectionChanged(
object
sender, TileListDataEventArgs e)
{
this
.tlDetail.DataBind();
}
protected
void
ldsMaster_Selecting(
object
sender, LinqDataSourceSelectEventArgs e)
{
e.Result =
new
List<MasterData>
{
new
MasterData(
"A"
,
"A"
),
new
MasterData(
"B"
,
"B"
),
new
MasterData(
"C"
,
"C"
)
};
}
protected
void
tlDetail_TileClick(
object
sender, TileListEventArgs e)
{
foreach
(var tile
in
this
.tlDetail.GetSelectedTiles())
{
tile.Selected =
false
;
}
e.Tile.Selected =
true
;
}
protected
void
ldsDetail_Selecting(
object
sender, LinqDataSourceSelectEventArgs e)
{
var selectedTiles =
this
.tlMaster.GetSelectedTiles();
if
(selectedTiles.Any())
{
var data =
new
List<DetailData>
{
new
DetailData(
"A"
,
"1"
,
"1"
),
new
DetailData(
"A"
,
"2"
,
"2"
),
new
DetailData(
"A"
,
"3"
,
"3"
),
new
DetailData(
"A"
,
"4"
,
"4"
),
new
DetailData(
"A"
,
"5"
,
"5"
),
new
DetailData(
"B"
,
"1"
,
"1"
),
new
DetailData(
"B"
,
"2"
,
"2"
),
new
DetailData(
"B"
,
"3"
,
"3"
),
new
DetailData(
"B"
,
"4"
,
"4"
),
new
DetailData(
"B"
,
"5"
,
"5"
),
new
DetailData(
"C"
,
"1"
,
"1"
),
new
DetailData(
"C"
,
"2"
,
"2"
),
new
DetailData(
"C"
,
"3"
,
"3"
),
new
DetailData(
"C"
,
"4"
,
"4"
),
new
DetailData(
"C"
,
"5"
,
"5"
)
};
var selectedTile = selectedTiles.Single();
e.Result = data
.Where(dd => dd.Master == selectedTile.Name);
}
else
{
e.Result = Enumerable.Empty<DetailData>();
}
}
private
class
MasterData
{
public
string
Name {
get
;
private
set
; }
public
string
Description {
get
;
private
set
; }
private
MasterData() { }
public
MasterData(
string
name,
string
description)
{
this
.Name = name;
this
.Description = description;
}
}
private
class
DetailData
{
public
string
Master {
get
;
private
set
; }
public
string
Name {
get
;
private
set
; }
public
string
Description {
get
;
private
set
; }
private
DetailData() { }
public
DetailData(
string
masterName,
string
name,
string
description)
{
this
.Master = masterName;
this
.Name = name;
this
.Description = description;
}
}
}
I hope you are able to identify why the event is not triggered. One thing that I already noted is that the control id differs before and after the postback (view attached files ctrl_id_before_postback and ctrl_id_after_postback): This might have to do something with the issue.