This is a migrated thread and some comments may be shown as answers.

Skin of Radcombobox and Raddatetimepicker inside radgrid edit formtemplate is not working properly

3 Answers 77 Views
Grid
This is a migrated thread and some comments may be shown as answers.
shakil
Top achievements
Rank 1
shakil asked on 27 Jul 2010, 08:12 AM
In my page, I have 7 radgrid with edit formtemplate.
In the edit formtemplate I used several radcontrols like radcombobox, raddatetimepicker and radtextbox.
All are funtioning properly.
But when I click on edit on radgrid,  the edit template section, radcombobox and raddatetimepicker's skin
do not work. sometimes it comes and sometimes these don't. Then I used radstylesheetmanager...although
I face similar problem...skin is not working here.

NB: If I use it without ajaxified then this design is ok...but I need to be ajaxified...like your controls.

I wanted to use ajaxcontroltoolkit datetimepicker...I could not able to use that in the radgrid edit formtemplate section...

Please suggest me what are the possible cause...need urgent.

Code snippet:

 

<Telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

 

 

<AjaxSettings>

 

 

<Telerik:AjaxSetting AjaxControlID ="dgvDevelopmentActivity">

 

 

<UpdatedControls>

 

 

<Telerik:AjaxUpdatedControl ControlID ="dgvDevelopmentActivity" LoadingPanelID ="Radajaxloadingpanel1" />

 

 

<telerik:AjaxUpdatedControl ControlID="RadWindowManager1" />

 

 

</UpdatedControls>

 

 

</Telerik:AjaxSetting>

 

 

<Telerik:AjaxSetting AjaxControlID ="dgvFunctionalStrength">

 

 

 

 

 

<UpdatedControls>

 

 

 

 

 

<Telerik:AjaxUpdatedControl ControlID ="dgvFunctionalStrength" LoadingPanelID ="Radajaxloadingpanel1" />

 

 

 

 

 

<telerik:AjaxUpdatedControl ControlID="RadWindowManager1" />

 

 

 

 

 

</UpdatedControls>

 

 

 

 

 

</Telerik:AjaxSetting>

 

 

 

 

</AjaxSettings>

 

 

</Telerik:RadAjaxManager>

 

 

<Telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">

 

 

</Telerik:RadStyleSheetManager>

 

<

 

Telerik:RadGrid ID="dgvLeadershipStrength" runat="server"

 

 

AllowMultiRowEdit="true" AllowPaging="True" AllowSorting="True"

 

 

AutoGenerateColumns="False" GridLines="None"

 

 

OnItemCommand="dgvLeadershipStrength_ItemCommand"

 

 

OnItemCreated="dgvLeadershipStrength_ItemCreated"

 

 

OnItemDataBound="dgvLeadershipStrength_ItemDataBound"

 

 

OnNeedDataSource="dgvLeadershipStrength_NeedDataSource" PageSize="7"

 

 

ShowStatusBar="true" Skin="Outlook" Width="750px">

 

 

<headercontextmenu enableautoscroll="True">

 

 

</headercontextmenu>

 

 

<mastertableview commanditemdisplay="Top" datakeynames="DetailID" dir="LTR" editmode="EditForms" >

 

 

<commanditemsettings addnewrecordtext="Leadership Strength" ShowRefreshButton ="false" />

 

 

<Columns>

 

 

<Telerik:GridEditCommandColumn ButtonType="ImageButton" HeaderText="Edit">

 

 

<ItemStyle Width="20px" />

 

 

</Telerik:GridEditCommandColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="txtVanish"

 

 

DataField="DetailID" HeaderText="Vanish" UniqueName="colVanished"

 

 

Visible="false">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true"

 

 

ColumnEditorID="ddlCompetency" DataField="Competency" HeaderText="Competency"

 

 

UniqueName="colCompetency">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true"

 

 

ColumnEditorID="ddlCompetencyArea" DataField="area" HeaderText="areas"

 

 

SortExpression="area" UniqueName="colCompetencyArea">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="ddlLevel"

 

 

DataField="level" HeaderText="Level" SortExpression="level"

 

 

UniqueName="colLevel">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true"

 

 

ColumnEditorID="ddlIndicator" DataField="Indicator" HeaderText="Indicator"

 

 

SortExpression="Name" UniqueName="colIndicator">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn DataField="Evidence" HeaderText="Evidence"

 

 

SortExpression="Evidence" UniqueName="colEvidence" />

 

 

<Telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete"

 

 

HeaderText="Delete" UniqueName="DeleteColumn" />

 

 

</Columns>

 

 

 

<editformsettings editformtype="Template"

 

 

formstyle-backcolor="Transparent">

 

 

<editcolumn uniquename="EditCommandColumn1">

 

 

</editcolumn>

 

 

<formstyle backcolor="Transparent" />

 

 

<formtemplate>

 

 

<div style="width: 100%; height: 100%">

 

 

<table border="0" cellspacing="2" style="width: 100%; border-color: #99ccff">

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; vertical-align: top;" visible="false">

 

 

<asp:Label ID="lblVanish" runat="server" CssClass="captionlbl" Visible="false"

 

 

Width="100px"><b>Vanish</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;" visible="false">

 

 

<Telerik:RadTextBox ID="txtVanish" runat="Server" AutoPostBack="True"

 

 

Text='<%# Eval("DetailID") %>' Visible="false" Width="500px">

 

 

</Telerik:RadTextBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; vertical-align: top;">

 

 

<asp:Label ID="Competency" runat="server" CssClass="captionlbl" Width="100px"><b>Competency</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadComboBox ID="ddlCompetency" runat="Server" AutoPostBack="True"

 

 

OnSelectedIndexChanged="ddlCompetency_SelectedIndexChanged" Skin="Outlook"

 

 

TabIndex="1" Width="500px">

 

 

</Telerik:RadComboBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="vertical-align: top; width: 10%; text-align: left;">

 

 

<asp:Label ID="CompetencyArea" runat="server" CssClass="captionlbl"

 

 

Height="15px"><b>Area</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadComboBox ID="ddlCompetencyArea" runat="Server" AutoPostBack="True"

 

 

OnSelectedIndexChanged="ddlCompetencyArea_SelectedIndexChanged" Skin="Outlook"

 

 

TabIndex="2" Width="500px">

 

 

</Telerik:RadComboBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; height: 15px;">

 

 

<asp:Label ID="lblLevel" runat="server" CssClass="captionlbl"><b>Level</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadComboBox ID="ddlLevel" runat="Server" AutoPostBack="True"

 

 

OnSelectedIndexChanged="ddlLevel_SelectedIndexChanged" Skin="Outlook"

 

 

TabIndex="3" Width="500px">

 

 

</Telerik:RadComboBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="vertical-align: top; width: 10%; text-align: left; height: 15px;">

 

 

<asp:Label ID="lblIndicator" runat="server" CssClass="captionlbl"><b>Indicator</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadComboBox ID="ddlIndicator" runat="Server" AutoPostBack="True"

 

 

Skin="Outlook" TabIndex="4" Width="500px">

 

 

</Telerik:RadComboBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="vertical-align: top; width: 10%; text-align: left; height: 15px;">

 

 

<asp:Label ID="lblEvidance" runat="server" CssClass="captionlbl"><b>Evidance</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadTextBox ID="txtEvidence" runat="server" AutoPostBack="true"

 

 

Skin="Outlook" Text='<%# Eval("Evidence", "{0:C}") %>' Width="500px">

 

 

</Telerik:RadTextBox>

 

 

</td>

 

 

</tr>

 

 

<tr style="width: 100%">

 

 

<td colspan="2" style="height: 15px; text-align: left;">

 

 

</td>

 

 

</tr>

 

 

 

<tr>

 

 

<td align="left" colspan="2">

 

 

<asp:Button ID="btnEmpKrainsert" runat="server" CommandName='<%# (Container is Telerik.Web.UI.GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'

 

 

 

Text='<%# (Container is Telerik.Web.UI.GridEditFormInsertItem) ? "Insert" : "Update" %>'

 

 

Width="70px" Font-Bold ="true" ForeColor ="Blue" EnableTheming ="true" BorderStyle ="Solid"/>

 

 

 

<asp:Label ID="Label6" runat="server"

 

 

Text="Please Click to Perform the Operation" CssClass="captionlbl"

 

 

Style="color: #0000cc" />

 

 

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td align="left" colspan="2">

 

 

<asp:Button ID="btnEmpKraCancel" runat="server" BackColor="AliceBlue" BorderWidth="1px" CausesValidation="False" CommandName="Cancel"

 

 

Text="Cancel" Width="70px" Font-Bold ="true" ForeColor ="Blue" EnableTheming ="true" BorderStyle ="Solid" />

 

 

<asp:Label ID="Label7" runat="server" Text="Please Click Cancel to Perform" CssClass="captionlbl" Style="color: #0000cc"></asp:Label>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td colspan="2" style="height: 15px; text-align: left;">

 

 

</td>

 

 

</tr>

 

 

</table>

 

 

</div>

 

 

</formtemplate>

 

 

</editformsettings>

 

 

</mastertableview><clientsettings>

 

 

<clientevents onrowdblclick="RowDblClick" />

 

 

</clientsettings>

 

 

</Telerik:RadGrid>

 

<

 

Telerik:RadGrid ID="dgvDevelopmentActivity" runat="server"

 

 

AllowMultiRowEdit="true" AllowPaging="True" AllowSorting="True"

 

 

AutoGenerateColumns="False" GridLines="None"

 

 

OnItemCommand="dgvDevelopmentActivity_ItemCommand"

 

 

OnItemCreated="dgvDevelopmentActivity_ItemCreated"

 

 

OnItemDataBound="dgvDevelopmentActivity_ItemDataBound"

 

 

OnNeedDataSource="dgvDevelopmentActivity_NeedDataSource" PageSize="7"

 

 

ShowStatusBar="true" Skin="Outlook" Width="750px">

 

 

<headercontextmenu enableautoscroll="True">

 

 

</headercontextmenu>

 

 

<mastertableview commanditemdisplay="Top" datakeynames="ID" dir="LTR"

 

 

editmode="EditForms">

 

 

<commanditemsettings addnewrecordtext="Development Activity" ShowRefreshButton ="false" />

 

 

<Columns>

 

 

<Telerik:GridEditCommandColumn ButtonType="ImageButton" HeaderText="Edit">

 

 

<ItemStyle Width="20px" />

 

 

</Telerik:GridEditCommandColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="txtVanish"

 

 

DataField="ID" HeaderText="Vanish" UniqueName="Vanish" Visible="false">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="What"

 

 

DataField="What" HeaderText="What" UniqueName="What">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="How"

 

 

DataField="How" HeaderText="How" SortExpression="How" UniqueName="How">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridBoundColumn AutoPostBackOnFilter="true" ColumnEditorID="Whenn"

 

 

DataField="Whenn" HeaderText="When" SortExpression="Whenn" UniqueName="Whenn">

 

 

</Telerik:GridBoundColumn>

 

 

<Telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete"

 

 

HeaderText="Delete" ItemStyle-Width="20px" Text="Delete"

 

 

UniqueName="DeleteColumn">

 

 

<ItemStyle Width="20px" />

 

 

</Telerik:GridButtonColumn>

 

 

</Columns>

 

 

 

<editformsettings editformtype="Template"

 

 

formstyle-backcolor="Transparent">

 

 

<editcolumn uniquename="EditCommandColumn1">

 

 

</editcolumn>

 

 

<formstyle backcolor="Transparent" />

 

 

<formtemplate>

 

 

<div style="width: 100%; height: 100%">

 

 

<table border="0" cellspacing="2" style="width: 100%; border-color: #99ccff">

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; vertical-align: top;" visible="false">

 

 

<asp:Label ID="lblVanish" runat="server" CssClass="captionlbl" Visible="false"

 

 

Width="100px"><b>Vanish</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;" visible="false">

 

 

<Telerik:RadTextBox ID="txtVanish" runat="Server" AutoPostBack="True"

 

 

Skin="Web20" Text='<%# Eval("ID") %>' Visible="false" Width="500px">

 

 

</Telerik:RadTextBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; vertical-align: top;">

 

 

<asp:Label ID="What" runat="server" CssClass="captionlbl" Width="100px"><b>What</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadTextBox ID="txtWhat" runat="Server" AutoPostBack="True"

 

 

Skin="Web20" TabIndex="1" Text='<%# Eval("What")%>' Width="500px">

 

 

</Telerik:RadTextBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="vertical-align: top; width: 10%; text-align: left;">

 

 

<asp:Label ID="How" runat="server" CssClass="captionlbl" Height="15px"><b>How</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadTextBox ID="txtHow" runat="Server" AutoPostBack="True" Skin="Web20"

 

 

TabIndex="2" Text='<%# Eval("How")%>' Width="500px">

 

 

</Telerik:RadTextBox>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td style="width: 10%; text-align: left; height: 15px;">

 

 

<asp:Label ID="lblWhen" runat="server" CssClass="captionlbl"><b>When</b></asp:Label>

 

 

</td>

 

 

<td style="width: 60%; text-align: left;">

 

 

<Telerik:RadDateTimePicker ID="dtpwhen" runat="Server" AutoPostBack="True"

 

 

Skin="Outlook" TabIndex="3" Width="200px">

 

<%

-- <calendar skin="Outlook" usecolumnheadersasselectors="False"

 

userowheadersasselectors="False" viewselectortext="x">

</calendar>

<timeview cellspacing="-1">

</timeview>

<timepopupbutton hoverimageurl="" imageurl="" />

<datepopupbutton hoverimageurl="" imageurl="" tabindex="3" />

<dateinput autopostback="True" dateformat="dd MMM yyyy"

displaydateformat="dd MMM yyyy" tabindex="3">

</dateinput>--

 

%>

 

 

</Telerik:RadDateTimePicker>

 

 

</td>

 

 

</tr>

 

 

<tr style="width: 100%">

 

 

<td colspan="2" style="height: 15px; text-align: left;">

 

 

</td>

 

 

</tr>

 

 

 

<tr>

 

 

<td align="left" colspan="2">

 

 

<asp:Button ID="btnEmpKrainsert" runat="server" CommandName='<%# (Container is Telerik.Web.UI.GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'

 

 

 

Text='<%# (Container is Telerik.Web.UI.GridEditFormInsertItem) ? "Insert" : "Update" %>'

 

 

Width="70px" Font-Bold ="true" ForeColor ="Blue" EnableTheming ="true" BorderStyle ="Solid"/>

 

 

 

<asp:Label ID="Label6" runat="server"

 

 

Text="Please Click to Perform the Operation" CssClass="captionlbl"

 

 

Style="color: #0000cc" />

 

 

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td align="left" colspan="2">

 

 

<asp:Button ID="btnEmpKraCancel" runat="server" BackColor="AliceBlue" BorderWidth="1px" CausesValidation="False" CommandName="Cancel"

 

 

Text="Cancel" Width="70px" Font-Bold ="true" ForeColor ="Blue" EnableTheming ="true" BorderStyle ="Solid" />

 

 

<asp:Label ID="Label7" runat="server" Text="Please Click Cancel to Perform" CssClass="captionlbl" Style="color: #0000cc"></asp:Label>

 

 

</td>

 

 

</tr>

 

 

<tr>

 

 

<td colspan="2" style="height: 15px; text-align: left;">

 

 

</td>

 

 

</tr>

 

 

</table>

 

 

</div>

 

 

</formtemplate>

 

 

</editformsettings>

 

 

</mastertableview>

 

 

<clientsettings>

 

 

<clientevents onrowdblclick="RowDblClick" />

 

 

</clientsettings>

 

 

</Telerik:RadGrid>

 


3 Answers, 1 is accepted

Sort by
0
Iana Tsolova
Telerik team
answered on 30 Jul 2010, 07:21 AM
Hello shakil,

Could you please confirm that issue persists in case the cells with the problematic controls are visible by
default? Also, is the described behavior observed when multiple rows are edited?
Any additional information on the steps performed for replicating it might help us to find the source of it.

Sincerely yours,
Iana
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
shakil
Top achievements
Rank 1
answered on 01 Aug 2010, 09:53 AM
My master page used Jgrid, Page.ClientScript.RegisterClientScriptInclude for registry..
Most probably this Javascript and css method may overlapped. Although I could not able to detect the problem.
Hence I have to change old master page to new one.

Now it is ok.

I have a question.

Question: Can I give ajaxcontroltoolkit calendar extender or other extender in the radgrid edit formtemplate section??
                If yes? then how..Please sometimes I fall in problem so, i need to know.

BR
Shakil

 

0
Kiara
Top achievements
Rank 1
answered on 05 Aug 2010, 10:50 AM
There should be no problem using Telerik date picker inside RadGrid form template edit form - I just tested it using this live demo and put Telerik date pickers to replace the BirthDate and HireDate textboxes.

Kiara
Tags
Grid
Asked by
shakil
Top achievements
Rank 1
Answers by
Iana Tsolova
Telerik team
shakil
Top achievements
Rank 1
Kiara
Top achievements
Rank 1
Share this question
or