Currently I am Working in RadGrid in bind all data with Edit and Delete Image Button, First time my page loading when Radgrid bind all data with proper css, but after when I click on every alternate row Edit Button then row data css is missing and not show border and css, I have attached image file and code
<asp:Panel ID="pnl6" runat="server" Style="display: none;">
<telerik:RadAjaxPanel ID="RadAjaxPanel5" runat="server" LoadingPanelID="RALoading">
<table id="tblNewViolation" runat="server" align="center" cellspacing="2" cellpadding="2"
style="width: 98%;">
<tr>
<td colspan="2" align="left" class="header_title">New Violation
</td>
</tr>
<tr>
<td colspan="2" align="left">
<div class="hrstyle">
</div>
</td>
</tr>
<tr>
<td valign="top" align="right">
<asp:Label ID="lblResolutions" runat="server" CssClass="labelText" Text="Case # : "></asp:Label>
</td>
<td valign="top" align="left">
<telerik:RadComboBox ID="cmcCase" runat="server" Visible="false">
</telerik:RadComboBox>
<telerik:RadTextBox ID="txtNCCase" runat="server" MaxLength="200" Visible="false">
</telerik:RadTextBox>
</td>
</tr>
<tr>
<td valign="top" align="right">
<asp:Label ID="lblPre" runat="server" CssClass="labelText" Text="Services : "></asp:Label>
</td>
<td valign="top" align="left">
<telerik:RadComboBox ID="cmcServices" runat="server">
</telerik:RadComboBox>
</td>
</tr>
<tr>
<td valign="top" align="right">
<asp:Label ID="lblPreDefinedNotes" runat="server" CssClass="labelText" Text="Pre Defined Notes : "></asp:Label>
<span style="color: Red; font-size: 12px; font-weight: bold">*</span>
</td>
<td valign="top" align="left">
<telerik:RadComboBox ID="cmbPreDefinedNotes" runat="server" AutoPostBack="true" OnSelectedIndexChanged="cmbPreDefinedNotes_SelectedIndexChanged">
</telerik:RadComboBox>
<asp:CustomValidator ID="CustomValidator6" ErrorMessage="Please Select Pre Defined Notes"
SetFocusOnError="true" ControlToValidate="cmbPreDefinedNotes" ValidateEmptyText="true"
runat="server" ClientValidationFunction="validationFunction" Display="none" ValidationGroup="vsViolation"></asp:CustomValidator>
</td>
</tr>
<tr>
<td style="width: 15%" valign="top" align="right">
<asp:Label ID="lblShortDescription" runat="server" CssClass="labelText" Text="New Violation : "></asp:Label>
<span style="color: Red; font-size: 12px; font-weight: bold">*</span>
</td>
<td valign="top" align="left">
<telerik:RadTextBox ID="txtShortDescription" TextMode="MultiLine" runat="server" Height="100px" Width="493px">
</telerik:RadTextBox>
<asp:RequiredFieldValidator ID="reqShortDescription" runat="server" ValidationGroup="vsViolation"
SetFocusOnError="true" ErrorMessage="Please Enter New Violation" Display="none" ControlToValidate="txtShortDescription"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td colspan="2" align="left">
<div class="hrstyle">
</div>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<telerik:RadButton ID="btnNVSave" runat="server" Text="Save" ValidationGroup="vsViolation" OnClick="btnNVSave_Click">
</telerik:RadButton>
<telerik:RadButton ID="btnNVCancel" runat="server" CausesValidation="false" Text="Cancel" OnClick="btnNVCancel_Click">
</telerik:RadButton>
</td>
</tr>
<tr>
<td colspan="7" align="left">
<div class="hrstyle">
</div>
</td>
</tr>
<tr>
<td colspan="4" align="left">
<telerik:RadGrid ID="grdViolation" runat="server" AllowPaging="True" AllowSorting="True"
AutoGenerateColumns="False" AllowAutomaticDeletes="false" AllowAutomaticUpdates="false"
OnNeedDataSource="grdViolation_NeedDataSource" OnItemCommand="grdViolation_ItemCommand">
<PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
<MasterTableView Width="100%" CommandItemDisplay="None" EditMode="InPlace" DataKeyNames="NewViolationPK">
<CommandItemSettings ShowAddNewRecordButton="false" />
<Columns>
<telerik:GridTemplateColumn HeaderText="CaseNo" ItemStyle-HorizontalAlign="Left" SortExpression="CaseNoFK">
<ItemTemplate>
<%# Eval("CaseNoFK") %>
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" />
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Pre Defined Notes" ItemStyle-HorizontalAlign="Left" SortExpression="PreDefinedNotesFK">
<ItemTemplate>
<%# Eval("PreDefinedNotesFK") %>
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" />
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Services" ItemStyle-HorizontalAlign="Left" SortExpression="ServicesFK">
<ItemTemplate>
<%# Eval("ServicesFK") %>
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" />
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderText="Action"
UniqueName="editdetail">
<ItemTemplate>
<asp:ImageButton ID="lnkEdit" runat="server" CommandArgument='<%#Eval("NewViolationPK") %>' ToolTip="Click to Edit" ImageUrl="../Images/edit.gif"
CommandName="Edit" /><span style="padding-left:30px"></span>
<asp:ImageButton ID="lnkDelete" runat="server" CommandArgument='<%#Eval("NewViolationPK") %>' ImageUrl="../Images/delete.png"
CommandName="Delete" ToolTip="Click to Delete" OnClientClick="return confirm('Are you sure you want to delete this new violation record?');" ></asp:ImageButton >
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" />
</telerik:GridTemplateColumn>
</Columns>
<EditFormSettings>
<EditColumn Visible="false"></EditColumn>
</EditFormSettings>
</MasterTableView>
</telerik:RadGrid>
</td>
</tr>
</table>
</telerik:RadAjaxPanel>
</asp:Panel>
Have anybody can idea and give me solution ?
4 Answers, 1 is accepted
Rank 2
You issue is occuring because the edit form is empty. There is only GridTemplateColumns in the Radgrid.The controls writtern in EditItemTemplate only will be shown in RadGrid's edit form. In your code there is only ItemTemplate, ie.. the edit form is empty. That is the reason for the css issue. If you want to show any controls in edit form, Please try adding then inside the EditItemTemplate of the Radgrid as shown below.
ASPX:
<telerik:GridTemplateColumn HeaderText="CaseNo" ItemStyle-HorizontalAlign="Left" SortExpression="CaseNoFK"> <ItemTemplate> <%# Eval("CaseNoFK") %> </ItemTemplate> <ItemStyle HorizontalAlign="Left" /> <EditItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Text=<%# Eval("CaseNoFK") %>></asp:TextBox> </EditItemTemplate> </telerik:GridTemplateColumn>Thanks,
Shinu.
Rank 1
Hello, Mr. Shinu
Thanks for your replay
I am using your suggestion and make new <EditItemTemplate> Under the telerik:GridTemplateColumn in RadGrid
but currently my code in not edit record on in my inline RadGrid, I am using on edit button click event with command name and bind all pnl6 control data in server side Ex .(Pre Defined Notes, New Violation, Case, Services ) in grdViolation_ItemCommand command event.
so I need not to use <EditItemTemplate>
But I am using your reply and try it but not yet working, I try it all but not working, same as my problem css facing
if you any other idea ?
<telerik:RadGrid ID="grdViolation" runat="server" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" AllowAutomaticDeletes="false" AllowAutomaticUpdates="false" OnNeedDataSource="grdViolation_NeedDataSource" OnItemCommand="grdViolation_ItemCommand"> <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle> <MasterTableView Width="100%" CommandItemDisplay="None" EditMode="InPlace" DataKeyNames="NewViolationPK"> <CommandItemSettings ShowAddNewRecordButton="false" /> <Columns> <telerik:GridTemplateColumn HeaderText="Case #" ItemStyle-HorizontalAlign="Left" SortExpression="CaseNoFK"> <ItemTemplate> <%# Eval("CaseNoFK") %> </ItemTemplate> <ItemStyle HorizontalAlign="Left" /> <EditItemTemplate> <%# Eval("CaseNoFK") %> </EditItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderText="Pre Defined Notes" ItemStyle-HorizontalAlign="Left" SortExpression="PreDefinedNotesFK"> <ItemTemplate> <%# Eval("PNName") %> </ItemTemplate> <ItemStyle HorizontalAlign="Left" /> <EditItemTemplate> <%# Eval("PNName") %> </EditItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderText="Services" ItemStyle-HorizontalAlign="Left" SortExpression="ServicesFK"> <ItemTemplate> <%# Eval("ServiceName") %> </ItemTemplate> <EditItemTemplate> <%# Eval("ServiceName") %> </EditItemTemplate> <ItemStyle HorizontalAlign="Left" /> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn HeaderStyle-HorizontalAlign="Center" HeaderText="Action" UniqueName="editdetail"> <ItemTemplate> <asp:ImageButton ID="lnkEdit" runat="server" CommandArgument='<%#Eval("NewViolationPK") %>' ToolTip="Click to Edit" ImageUrl="../Images/edit.gif" CommandName="Edit" /><span style="padding-left:30px"></span> <asp:ImageButton ID="lnkDelete" runat="server" CommandArgument='<%#Eval("NewViolationPK") %>' ImageUrl="../Images/delete.png" CommandName="Delete" ToolTip="Click to Delete" OnClientClick="return confirm('Are you sure you want to delete this new violation record?');" ></asp:ImageButton > </ItemTemplate> <HeaderStyle HorizontalAlign="Center" /> <ItemStyle HorizontalAlign="Center" /> </telerik:GridTemplateColumn> </Columns> <EditFormSettings> <EditColumn Visible="false"></EditColumn> </EditFormSettings> </MasterTableView> </telerik:RadGrid>
Rank 2
Please try closing the Radgrid's default edit form if you are not using it for edit. Here is the code I tried.
C#:
public static string edit = string.Empty;protected void grdViolation_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e){ if (e.CommandName == RadGrid.EditCommandName) { edit = "edit"; }}protected void grdViolation_PreRender(object sender, EventArgs e){ if (edit == "edit") { grdViolation.MasterTableView.ClearEditItems(); grdViolation.Rebind(); }}Thanks,
Shinu.
Rank 1
Hello, Mr. Shinu
As you post replay mention on above code is working fine to my css problem, after the grdViolation_PreRender event to clear all grid data
Thanks you very much