or
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
<
style
type
=
"text/css"
>
.rotatorBackground
{
float: left;
margin-left: 50px;
margin-top: 10px;
width: 440px;
height: 185px;
border: solid 2px #dedede;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}
.rotatorStyle
{
margin: 40px auto 0px;
}
.rotatorStyle .RotatorItem
{
margin:5px;
height: 100px;
width: 100px;
}
.rotatorCarouselStyle
{
margin: 0px auto;
}
.RotatorItem
{
border: solid 1px #dff3ff !important;
}
.mainDiv
{
margin-bottom: 20px;
}
.configurationPanel
{
width: 290px;
border: 0px;
}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"RadScriptManager1"
runat
=
"server"
>
</
telerik:RadScriptManager
>
<
telerik:RadAjaxLoadingPanel
ID
=
"LoadingPanel1"
runat
=
"Server"
Transparency
=
"30"
EnableSkinTransparency
=
"false"
BackColor
=
"#E0E0E0"
>
</
telerik:RadAjaxLoadingPanel
>
<
telerik:RadAjaxPanel
ID
=
"AjaxPanel1"
runat
=
"server"
LoadingPanelID
=
"LoadingPanel1"
>
<
div
class
=
"mainDiv"
>
<
div
class
=
"rotatorBackground"
>
<
telerik:RadRotator
ID
=
"RadRotator1"
runat
=
"server"
Width
=
"224px"
Height
=
"112px"
CssClass
=
"rotatorStyle"
ItemHeight
=
"112"
ItemWidth
=
"112"
SlideShowAnimation-Type
=
"Fade"
SlideShowAnimation-Duration
=
"3000"
>
<
Items
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/ANATR.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image1"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/ANTON.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image2"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/BOTTM.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/CACTU.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/CENTC.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/ERNSH.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/LAUGB.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/MAISD.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/MEREP.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
asp:Image
runat
=
"server"
ID
=
"Image3"
ImageUrl
=
'Img/Northwind/Customers/Thumbs/OCEAN.jpg'
CssClass
=
"RotatorItem"
AlternateText
=
"Customer Image"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
</
Items
>
</
telerik:RadRotator
>
</
div
>
</
div
>
</
telerik:RadAjaxPanel
>
</
form
>
</
body
>
</
html
>
<
telerik:RadSplitter
ID
=
"RadSplitter1"
runat
=
"server"
skin
=
"vista"
Width
=
"100%"
>
<
telerik:RadPane
ID
=
"LeftPane"
runat
=
"server"
Scrolling
=
"None"
Width
=
"58%"
>
<
telerik:RadSlidingZone
ID
=
"Zone1"
runat
=
"server"
Width
=
"22px"
ClickToOpen
=
"true"
>
<
telerik:RadPane
ID
=
"Expanding_CONTENT1"
Title
=
"Pane1"
runat
=
"server"
Scrolling
=
"None"
Width
=
"100%"
>
</
telerik:RadPane
>
<
telerik:RadPane
ID
=
"Expanding_CONTENT2"
Title
=
"Pane1"
runat
=
"server"
Scrolling
=
"None"
Width
=
"100%"
>
</
telerik:RadPane
>
</
telerik:RadSlidingZone
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
runat
=
"server"
ID
=
"SplitBar1"
CollapseMode
=
"Both"
/>
<
telerik:RadPane
ID
=
"RightPane_AlwaysOpen"
runat
=
"server"
Scrolling
=
"None"
Width
=
"38%"
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
<telerik:RadWindowManager ID="RadWindowManager1" Skin="WebBlue" runat="server" Behaviors="Close, Move" |
Modal="True" ReloadOnShow="True" ShowContentDuringLoad="False" OnClientClose="OnClientClose" |
InitialBehaviors="Close"> |
<Windows> |
<telerik:RadWindow ID="frmCoordonneesPostale" runat="server" Title="<%$ Resources:Labels, SubSpacefrmCoordonneesPostaleTitle %>" |
DestroyOnClose="False" Height="510px" KeepInScreenBounds="True" VisibleStatusbar="false" |
Width="575px" ReloadOnShow="true" ShowContentDuringLoad="false" Animation="FlyIn" OnClientClose="OnClientClose" /> |
<telerik:RadWindow ID="frmMsg" runat="server" Title="<%$ Resources:Labels, SubSpacefrmMsgTitle %>" |
DestroyOnClose="False" Height="534px" KeepInScreenBounds="True" VisibleStatusbar="false" OnClientClose="OnClientClose" |
Width="575px" ReloadOnShow="true" ShowContentDuringLoad="false" Animation="FlyIn" /> |
<telerik:RadWindow ID="frmConfirmRegister" runat="server" Title="confimation" DestroyOnClose="False" Height="200px" KeepInScreenBounds="True" VisibleStatusbar="false" OnClientClose="OnClientClose" |
Width="570px" ReloadOnShow="true" ShowContentDuringLoad="false" Animation="FlyIn" /> |
</Windows> |
</telerik:RadWindowManager> |
<script type="text/javascript"> |
function OnClientClose(radWindow) { |
if (radWindow.Argument != null & radWindow.Argument == 'ConfirmMessage') { |
radWindow.Argument = null; |
if (radWindow._name == 'frmCoordonneesPostale') { |
$find("<%= RadToolTip1.ClientID %>").show(); |
return; |
} |
if (radWindow._name == 'frmMsg') { |
$find("<%= RadToolTip2.ClientID %>").show(); |
return; |
} |
} |
if (radWindow._name == 'frmConfirmRegister') { |
document.location.href = "login.aspx"; |
} |
} |
............... |
</script> |
<asp:UpdatePanel runat="Server" ID="UpdatePanel1"> |
<ContentTemplate> |
<table cellspacing="2" cellpadding="2" border="0" width="100%" style="position: relative; |
left: 21px; z-index: 1000;"> |
<tr> |
<td colspan="2"> |
<span class="repliB" id="ChangePwd"><span class="changePassword" onclick="cacherMontrerB('ChangePwdContent','ChangePwd')"> |
<img src="Images/pixel.gif" width="13" height="13" alt="puce" class="puceTriangleB" |
style="cursor: pointer" /> |
<asp:Label ID="lbChangePassword" runat="server" Style="cursor: pointer"><% =Resources.Labels.SubSpaceTdChangePassword%></asp:Label> |
</span><span id="ChangePwdContent" class="listeCache listeItems"> |
<table id="tblChangePwdDefaultMessage" runat="server" Visible="True" cellspacing="2" cellpadding="2" border="0" width="90%" style="padding-left: 22px"> |
<tr style="vertical-align: text-top;height: 70px"> |
<td colspan="2" style="text-align: right"> |
<asp:Label runat="server" ID="MsgInfoDefaultModifPwd" Text="<%$ Resources:Labels, MsgInfoDefaultModifPwd %>" CssClass="MsgInfoDefaultModifPwd"/> |
</td> |
</tr> |
</table> |
<table cellspacing="2" cellpadding="2" border="0" width="90%" style="padding-left: 22px"> |
<tr style="vertical-align: text-top"> |
<td style="text-align: right"> |
<span class="classTitleMember"> |
<asp:Label ID="Label1" runat="server" Text="<%$ Resources:Labels, SubSpaceTdTapeOldPassword %>"></asp:Label></span> |
</td> |
<td style="text-align: right"> |
<telerik:RadTextBox ID="tbxOldPwd" runat="server" ValidationGroup="ChangePassword" |
CssClass="classTbx" Skin="WebBlue" TextMode="Password" Width="160px"> |
</telerik:RadTextBox> |
</td> |
</tr> |
<tr style="vertical-align: text-top"> |
<td style="text-align: right"> |
<asp:Label ID="Label9" CssClass="classTitleMember" runat="server" Text="<%$ Resources:Labels, SubSpaceTdTapeNewPassword %>"></asp:Label> |
</td> |
<td style="text-align: right"> |
<telerik:RadTextBox ID="tbxNewPwd" runat="server" CssClass="classTbx" Skin="WebBlue" |
ValidationGroup="ChangePassword" TextMode="Password" Width="160px"> |
</telerik:RadTextBox> |
</td> |
</tr> |
<tr style="vertical-align: text-top"> |
<td style="text-align: right"> |
<asp:Label ID="Label2" CssClass="classTitleMember" runat="server" Text="<%$ Resources:Labels, SubSpaceTdConfirmPassword %>"></asp:Label> |
</td> |
<td style="text-align: right"> |
<telerik:RadTextBox ID="tbxConfirmNewPwd" runat="server" CssClass="classTbx" Skin="WebBlue" |
ValidationGroup="ChangePassword" TextMode="Password" Width="160px"> |
</telerik:RadTextBox> |
</td> |
</tr> |
</table> |
<table cellspacing="2" cellpadding="2" border="0" width="90%" style="padding-left: 22px"> |
<tr style="vertical-align: text-top"> |
<td style="text-align: right"> |
</td> |
<td style="text-align: right"> |
<asp:Button UseSubmitBehavior="false" CssClass="classebouton" ID="btnChangePassword" runat="server" Text="<%$ Resources:Labels, SubSpacebtnValidate %>" |
OnClick="btnChangePassword_Click" Width="165px" ValidationGroup="ChangePassword"> |
</asp:Button> |
</td> |
</tr> </table> |
............ |
</ContentTemplate> |
</asp:UpdatePanel> |
I am trying to add/delete rows using on client(webmethods), but when the last row is deleted the
CommandItemDisplay is also getting deleted.
2. Also the grid layout is changing when a row is deleted/added.
3. The Databinder expression for the years attended column does not work after rebind.
can you please point out the problems from the code below
Class:
public class Education
{
#region Private fields
private int? _ID;
private string _Degree;
private string _Program;
private string _School;
private DateTime _From;
private DateTime _To;
#endregion
#region Constructors
public Education()
{
}
public Education(int ID, string Degree, string Program, string School, DateTime From, DateTime To)
{
this._ID = ID;
this._Program = Program;
this._Degree = Degree;
this._School = School;
this._From = From;
this._To = To;
}
#endregion
#region Public properties
public int? ID
{
get
{
return this._ID.Value;
}
set
{
if ((this._ID != value))
{
this._ID = value;
}
}
}
public string Degree
{
get
{
return this._Degree;
}
set
{
if ((this._Degree != value))
{
this._Degree = value;
}
}
}
public string Program
{
get
{
return this._Program;
}
set
{
if ((this._Program != value))
{
this._Program = value;
}
}
}
public string School
{
get
{
return this._School;
}
set
{
if ((this._School != value))
{
this._School = value;
}
}
}
public DateTime From
{
get
{
return this._From;
}
set
{
if ((this._From != value))
{
this._From = value;
}
}
}
public DateTime To
{
get
{
return this._To;
}
set
{
if ((this._To != value))
{
this._To = value;
}
}
}
#endregion
}
ASPX:
<
telerik:RadGrid
ID
=
"RadGrid1"
Width
=
"489px"
runat
=
"server"
Skin
=
"Windows7"
OnDataBound
=
"RadGrid1_DataBound"
OnItemCreated
=
"RadGrid1_ItemCreated"
OnPreRender
=
"RadGrid1_PreRender"
>
<
MasterTableView
CommandItemDisplay
=
"Bottom"
AutoGenerateColumns
=
"False"
CommandItemSettings-ShowRefreshButton
=
"False"
HeaderStyle-CssClass
=
"gridHeader"
CommandItemSettings-AddNewRecordText
=
"Add"
DataKeyNames
=
"ID"
ClientDataKeyNames
=
"ID"
ShowHeadersWhenNoRecords
=
"true"
>
<
Columns
>
<
telerik:GridEditCommandColumn
ButtonType
=
"ImageButton"
UniqueName
=
"EditColumn"
>
<
ItemStyle
/>
<
HeaderStyle
Width
=
"1%"
HorizontalAlign
=
"Center"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridEditCommandColumn
>
<
telerik:GridTemplateColumn
UniqueName
=
"ID"
HeaderText
=
"ID"
ItemStyle-Width
=
"1px"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"LblID"
runat
=
"server"
Text='<%# DataBinder.Eval(Container.DataItem, "ID") %>'> ></
asp:Label
>
</
ItemTemplate
>
<
HeaderStyle
Width
=
"0%"
HorizontalAlign
=
"Left"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridTemplateColumn
>
<
telerik:GridTemplateColumn
UniqueName
=
"Degree"
HeaderText
=
"Degree"
ItemStyle-Width
=
"80px"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"lblDegree"
runat
=
"server"
Text='<%# DataBinder.Eval(Container.DataItem, "Degree") %>'> ></
asp:Label
>
</
ItemTemplate
>
<
HeaderStyle
Width
=
"12%"
HorizontalAlign
=
"Left"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridTemplateColumn
>
<
telerik:GridTemplateColumn
UniqueName
=
"Program"
HeaderText
=
"Program"
ItemStyle-Width
=
"80px"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"lblProgram"
runat
=
"server"
Text='<%# DataBinder.Eval(Container.DataItem, "Program") %>'>></
asp:Label
>
</
ItemTemplate
>
<
HeaderStyle
Width
=
"30%"
HorizontalAlign
=
"Left"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridTemplateColumn
>
<
telerik:GridTemplateColumn
UniqueName
=
"School"
HeaderText
=
"School"
ItemStyle-Width
=
"80px"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"lblSchool"
runat
=
"server"
Text='<%# DataBinder.Eval(Container.DataItem, "School") %>'>></
asp:Label
>
</
ItemTemplate
>
<
HeaderStyle
Width
=
"37%"
HorizontalAlign
=
"Left"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridTemplateColumn
>
<
telerik:GridTemplateColumn
UniqueName
=
"YearsAttended"
HeaderText
=
"Years"
ItemStyle-Width
=
"80px"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"lblFrom"
runat
=
"server"
Text='<%# DataBinder.Eval(Container.DataItem, "From","{0:yyyy}") + " - " + DataBinder.Eval(Container.DataItem, "To","{0:yyyy}") %>'></
asp:Label
>
</
ItemTemplate
>
<
HeaderStyle
Width
=
"23%"
HorizontalAlign
=
"Left"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
</
telerik:GridTemplateColumn
>
<
telerik:GridButtonColumn
CommandName
=
"Delete"
ButtonType
=
"ImageButton"
UniqueName
=
"DeleteColumn"
>
<
HeaderStyle
Width
=
"1%"
HorizontalAlign
=
"Center"
/>
<
ItemStyle
HorizontalAlign
=
"Center"
/>
</
telerik:GridButtonColumn
>
</
Columns
>
<
CommandItemTemplate
>
<
div
style
=
"padding-top: 3px; margin-top: 3px;"
>
<
asp:LinkButton
Style
=
"vertical-align: bottom"
ID
=
"btnAddEducation"
runat
=
"server"
OnClientClick
=
"return showEditEducation('Add');"
>
<
img
alt
=
""
src
=
"Images/AddRecord.gif"
style
=
"border:0px;padding-left:2px;padding-right:5px;margin-top:0px;margin-top:-5px;"
/>Add</
asp:LinkButton
>
</
div
>
</
CommandItemTemplate
>
</
MasterTableView
>
<
ClientSettings
>
<
Selecting
AllowRowSelect
=
"true"
/>
<
ClientEvents
OnRowSelected
=
"rowSelected"
/>
<
Scrolling
UseStaticHeaders
=
"true"
/>
</
ClientSettings
>
</
telerik:RadGrid
>
Code Behind:
protected void Page_Load(object sender, EventArgs e)
{
educationList = new List<
Education
>();
educationList.Add(new Education(0, "X", "General", "stanford", Convert.ToDateTime("1/1/1988"), Convert.ToDateTime("1/1/2000")));
educationList.Add(new Education(0, "X", "General", "stanford", Convert.ToDateTime("1/1/1988"), Convert.ToDateTime("1/1/2000")));
educationList.Add(new Education(0, "X", "General", "stanford", Convert.ToDateTime("1/1/1988"), Convert.ToDateTime("1/1/2000")));
educationList.Add(new Education(0, "X", "General", "stanford", Convert.ToDateTime("1/1/1988"), Convert.ToDateTime("1/1/2000")));
RadGrid1.DataSource = educationList;
RadGrid1.DataBind();
}
protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem)
{
GridDataItem item = (GridDataItem)e.Item;
((ImageButton)item["DeleteColumn"].Controls[0]).Attributes.Add("onclick", "deleteCurrent('" + item.ItemIndex + "');return false;");
}
}
JavaScript:
function deleteCurrent(index) {
var grid = $find("<%= RadGrid1.ClientID %>");
var MasterTable = grid.get_masterTableView();
var row = MasterTable.get_dataItems()[index];
id = row.getDataKeyValue("ID") //access DataKeyValue
if (id != null) {
PageMethods.DeleteEducationByID(id, updateGrid);
}
return false;
}
function updateGrid(result) {
var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
if (result != null) {
tableView.set_dataSource(result);
tableView.dataBind();
var grid = $find("<%= RadGrid1.ClientID %>");
grid.repaint();
}
}