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

Editform above the columns names

3 Answers 27 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Bader
Top achievements
Rank 1
Bader asked on 19 Jul 2011, 08:39 AM
Hello,

Can I change the radgrid design in order to display the editform above the columns names (Plaese view the attached image)?
Here is my code:
<telerik:RadGrid ID="TasksRadGrid" runat="server" PageSize="20" AllowFilteringByColumn="false" ValidationGroup="NewTaskValidationGroup"
                        GridLines="None" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" Width="700px"
                        ShowStatusBar="true" OnPreRender="TasksRadGrid_PreRender" OnNeedDataSource="TasksRadGrid_NeedDataSource" OnUpdateCommand="TasksRadGrid_UpdateCommand" OnInsertCommand="TasksRadGrid_InsertCommand" OnDeleteCommand="TasksRadGrid_DeleteCommand">
                        <MasterTableView GridLines="None" Width="700px" CommandItemDisplay="Top" DataKeyNames="TID">
                            <CommandItemSettings AddNewRecordText="<%$ Resources:GeneralTelerikResource, TelerikRadGridAddNewRecordText %>"
                                                    RefreshText="<%$ Resources:GeneralTelerikResource, TelerikRadGridRefreshText %>" />
                            <Columns>
                                <telerik:GridEditCommandColumn UniqueName="EditCommandColumn1"  ItemStyle-VerticalAlign="Top" EditText="<%$ Resources:GeneralTelerikResource, TelerikRadGridEditColumnText %>">
                                </telerik:GridEditCommandColumn>
                                <telerik:GridTemplateColumn UniqueName="Status"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="10%" HeaderStyle-Width="10%" HeaderText="Status" DataField="Status">
                                   <ItemTemplate>
                                       <asp:Image ID="StatusImage" ImageUrl="~/Common/Design/Imgs/Tasks/Statuses/New.png" ToolTip="New" Width="20px" Height="20px" runat="server" />
                                   </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridBoundColumn UniqueName="Priority"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="10%" HeaderStyle-Width="10%" HeaderText="Priority" DataField="Priority">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="Title"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="35%" HeaderStyle-Width="35%" HeaderText="Title" DataField="Title">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="Comment"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="30%" HeaderStyle-Width="30%" HeaderText="Comment" DataField="Comment">
                                </telerik:GridBoundColumn>
                                 
                                <telerik:GridDateTimeColumn UniqueName="EndDate"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="15%" HeaderStyle-Width="15%" HeaderText="EndDate" DataField="EndDate">
                                </telerik:GridDateTimeColumn>
                                 <telerik:GridButtonColumn ConfirmText="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnConfirmText %>"  ItemStyle-VerticalAlign="Top" ConfirmDialogType="RadWindow"
                                    ConfirmTitle="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnConfirmTitle %>" ButtonType="ImageButton" CommandName="Delete" Text="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnText %>"
                                    UniqueName="DeleteColumn">
                                    <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
                                </telerik:GridButtonColumn>
                            </Columns>
                            <EditFormSettings UserControlName="~/OU/Tasks/c/CreateTask/SubUserControl.ascx" EditFormType="WebUserControl">
                                <EditColumn UniqueName="EditCommandColumn1">
                                </EditColumn>
                            </EditFormSettings>
                        </MasterTableView>
                    </telerik:RadGrid>

Please, I need your help,
It is appreciated to send me the modified code.

Regards,
Bader 

3 Answers, 1 is accepted

Sort by
0
Accepted
Vasil
Telerik team
answered on 22 Jul 2011, 07:45 AM
Hi Bader,

The grid does not provide such a build in functionality for placing the edit form above the column names. You could imitate the same user appearance using RadToolBar instead of the command item. Then place ExternalEditForm, and use the grid in the bottom of all.

I hope this helps.

All the best,
Vasil
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Timothy
Top achievements
Rank 1
answered on 11 Oct 2019, 02:28 PM

Just wondering if this still holds true?  I'd also like to place the edit form above the column header.

0
Eyup
Telerik team
answered on 16 Oct 2019, 08:16 AM

Hi Timothy,

 

I am afraid this requirement is still not provided built-in and forcing this change can break the layout of the grid. Nevertheless, you can log this idea as a Feature Request in our Public Portal:

Currently, you can use the following options:

1. Use an external edit form as suggested previously by my colleague Vasil, similar to this live sample:
https://demos.telerik.com/aspnet-ajax/dataform/application-scenarios/integration-with-radgrid/defaultcs.aspx

2. Use a PopUp edit form and place it directly above the grid using CSS and/or JavaScript:
https://www.telerik.com/forums/context-menu---open-a-pop-up#Qe9fJgzWrE2DhYPWX7OkCQ


Regards,
Eyup
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Bader
Top achievements
Rank 1
Answers by
Vasil
Telerik team
Timothy
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or