[Solved] How to customize edit/insert form

[Truong Pham]

Please guide me how to customize edit/insert form. For example, the default edit control is text box but I want to change to RadDateInput or RadNumericInput based on data content. I will to config these change in the design time

[Princy]

Hi,

I would suggest you to use a FormTemplate or a UserControl edit form to customize the edit/Insert form. Go through the following onlinde demos for details about using FormTemplate /UserControl edit form.
Form Template Edit Form
User Control Edit Form

Thanks
Princy

[Truong Pham]

Dear Princy,

Thank for your advise. I have tried but It still use default edit form. I include the source code as following:

<code>

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Expense.ascx.vb" Inherits="Expense" %>
<telerik:RadGrid ID="RadGrid1" runat="server" AllowAutomaticDeletes="True"
    AllowAutomaticInserts="True" AllowAutomaticUpdates="True"
    AllowFilteringByColumn="True" AllowPaging="True" AllowSorting="True"
    AutoGenerateDeleteColumn="True" AutoGenerateEditColumn="True"
    DataSourceID="DocumentDataSource" GridLines="None" Height="600px"
    ShowFooter="True" ShowGroupPanel="True" ShowStatusBar="True" Skin="Vista"
    Width="100%">
    <PagerStyle Mode="NextPrevNumericAndAdvanced" />
<MasterTableView AutoGenerateColumns="False" DataSourceID="DocumentDataSource" CommandItemDisplay="TopAndBottom">
<RowIndicatorColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</RowIndicatorColumn>

<ExpandCollapseColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</ExpandCollapseColumn>
<EditFormSettings >
    <FormTemplate>
        <table style="width:100%; height: 197px;">
            <tr>
                <td>
                    <asp:Label ID="Label1" runat="server" Text="Expense name:"></asp:Label>
                </td>
                <td>
                    <telerik:RadTextBox ID="RadTextBox1" Runat="server" Skin="Vista"
                        Text='<%# Bind("expense_name") %>' Width="125px">
                    </telerik:RadTextBox>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="Label2" runat="server" Text="Description:"></asp:Label>
                </td>
                <td>
                    <telerik:RadTextBox ID="RadTextBox2" Runat="server" Skin="Vista"
                        Text='<%# Bind("description") %>' Width="125px">
                    </telerik:RadTextBox>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="Label3" runat="server" Text="Realized date:"></asp:Label>
                </td>
                <td>
                    <telerik:RadDateInput ID="RadDateInput1" Runat="server"
                        Culture="English (United States)" SelectedDate='<%# Bind("realized_date") %>'
                        Width="125px">
                    </telerik:RadDateInput>
                </td>
            </tr>
            <tr>
                <td>
                    Amount:</td>
                <td>
                    <telerik:RadNumericTextBox ID="RadNumericTextBox1" Runat="server"
                        Culture="English (United States)" DbValue='<%# Bind("amount") %>' Width="125px">
                    </telerik:RadNumericTextBox>
                </td>
            </tr>
            <tr>
                <td>
                    Notes:</td>
                <td>
                    <telerik:RadTextBox ID="RadTextBox3" Runat="server" Skin="Vista"
                        Text='<%# Bind("kind_of_expense") %>' Width="125px">
                    </telerik:RadTextBox>
                </td>
            </tr>
        </table>
    </FormTemplate>
    </EditFormSettings>
    <Columns>
        <telerik:GridBoundColumn DataField="expense_name" HeaderText="expense_name"
            SortExpression="expense_name" UniqueName="expense_name">
        </telerik:GridBoundColumn>
        <telerik:GridBoundColumn DataField="description" HeaderText="description"
            SortExpression="description" UniqueName="description">
        </telerik:GridBoundColumn>
        <telerik:GridBoundColumn DataField="realized_date" DataType="System.DateTime"
            HeaderText="realized_date" SortExpression="realized_date"
            UniqueName="realized_date">
        </telerik:GridBoundColumn>
        <telerik:GridBoundColumn DataField="amount" DataType="System.Decimal"
            HeaderText="amount" SortExpression="amount" UniqueName="amount">
        </telerik:GridBoundColumn>
        <telerik:GridBoundColumn DataField="kind_of_expense"
            HeaderText="kind_of_expense" SortExpression="kind_of_expense"
            UniqueName="kind_of_expense">
        </telerik:GridBoundColumn>
    </Columns>
</MasterTableView>
    <ClientSettings AllowColumnsReorder="True" AllowDragToGroup="True">
        <Scrolling AllowScroll="True" UseStaticHeaders="True" />
    </ClientSettings>
</telerik:RadGrid>
<asp:SqlDataSource ID="DocumentDataSource" runat="server"
    ConnectionString="<%$ ConnectionStrings:documentConnectionString %>"
    SelectCommand="SELECT [expense_name], [description], [realized_date], [amount], [kind_of_expense] FROM [expense]">
</asp:SqlDataSource>

</code>

[Shinu]

Hi,

Try setting the EditFormType to Template as shown below.

ASPX:

<EditFormSettings EditFormType="Template" >
  ....

</EditFormSettings>

Thanks
Shinu

[Truong Pham]

I have tried and it works. But when I insert new row use above Edit form template. There is the error with the "realized_date" column:

The ASPX code:
<td>

 

 

 

<asp:Label ID="Label3" runat="server" Text="Realized date:"></asp:Label>

 

 

 

</td>

 

 

 

<td>

 

 

 

<telerik:RadDatePicker ID="txtRealized_date" Runat="server"

 

 

Culture="English (United States)" SelectedDate='<%# Bind("realized_date") %>'

 

 

Width="80%">

 

 

 

</telerik:RadDatePicker>

 

 

 

</td>

and the behind code:

 

If

 

(e.CommandName = RadGrid.InitInsertCommandName) Then

 

e.Canceled =

True

 

 

Dim newValues As System.Collections.Specialized.ListDictionary = New System.Collections.Specialized.ListDictionary()

 

newValues(

"realized_date") = Date.Now

 

e.Item.OwnerTableView.InsertItem()

 

End If

The error is InvalidCastException.

Please guide me to set intial values in this case