RadGrid as Data Entry form?

[Dan]

Hi all, I wanted to use a radgrid as a way to enter data for a couple columns (Using DropDown's) and the CommandItem as the button to insert new rows. 

I don't want to attach a Datasource to this, I just want to enter data, then loop through the rows and insert to SQL. I saw other posts about this with no answer or links to broken pages.

 <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateEditColumn="True" CellSpacing="0"  GridLines="None">
                    <ClientSettings>
            <Selecting AllowRowSelect="True" />
        </ClientSettings>
        <MasterTableView AutoGenerateColumns="False" CommandItemDisplay="Top" DataSourceID="sdsDisks">
            <Columns>
                <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
                    </telerik:GridEditCommandColumn>
                <telerik:GridDropDownColumn FilterControlAltText="Filter Disk_Speed column" HeaderText="Disk Speed" UniqueName="Disk_Speed">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridDropDownColumn>
                <telerik:GridDropDownColumn FilterControlAltText="Filter Disk_Size_In_GB column" HeaderText="Disk Size in GB" UniqueName="Disk_Size_In_GB">
                    <ColumnValidationSettings>
                        <ModelErrorMessage Text="" />
                    </ColumnValidationSettings>
                </telerik:GridDropDownColumn>
                </Columns>
            <EditFormSettings>
                <EditColumn FilterControlAltText="Filter EditCommandColumn1 column" UniqueName="EditCommandColumn1">
                </EditColumn>
            </EditFormSettings>
            </MasterTableView>
        </telerik:RadGrid>

[Angel Petrov]

Hello Dan,

From the code I noticed that the MasterTableView.DataSourceID property is assigned. Should the grid allow automatic inserts or do you want to manually perform them?

If using automatic operations is the goal you should set the AllowAutomaticInserts property to true, configure the select command to return an empty collection and modify the InsertCommand accordingly. A possible realization of this scenario is available below.

ASPX:

     <telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" runat="server"
        AutoGenerateColumns="False" AllowAutomaticInserts="True">
        <MasterTableView DataSourceID="SqlDataSource1" DataKeyNames="CustomerID" CommandItemDisplay="Top">
            <Columns>
                <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
                    <HeaderStyle Width="20px"></HeaderStyle>
                    <ItemStyle CssClass="MyImageButton"></ItemStyle>
                </telerik:GridEditCommandColumn>
                <telerik:GridBoundColumn SortExpression="CustomerID" HeaderText="CustomerID" HeaderButtonType="TextButton"
                    DataField="CustomerID" UniqueName="CustomerID" MaxLength="5">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn SortExpression="ContactName" HeaderText="Contact Name" HeaderButtonType="TextButton"
                    DataField="ContactName" UniqueName="ContactName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn SortExpression="CompanyName" HeaderText="Company" HeaderButtonType="TextButton"
                    DataField="CompanyName" UniqueName="CompanyName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn SortExpression="Address" HeaderText="Address" HeaderButtonType="TextButton"
                    DataField="Address" UniqueName="Address">
                </telerik:GridBoundColumn>
                <telerik:GridButtonColumn ConfirmText="Delete this customer?" ButtonType="ImageButton"
                    CommandName="Delete" Text="Delete" UniqueName="DeleteColumn">
                    <HeaderStyle Width="20px"></HeaderStyle>
                    <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton"></ItemStyle>
                </telerik:GridButtonColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
    ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString35 %>"
    InsertCommand="INSERT INTO [Customers] ([CustomerID], [CompanyName], [ContactName], [Address]) VALUES (@CustomerID, @CompanyName, @ContactName, @Address)"
    SelectCommand="SELECT TOP 0 * FROM [Customers]" >
    <InsertParameters>
        <asp:Parameter Name="CustomerID" Type="String"></asp:Parameter>
        <asp:Parameter Name="CompanyName" Type="String"></asp:Parameter>
        <asp:Parameter Name="ContactName" Type="String"></asp:Parameter>
        <asp:Parameter Name="Address" Type="String"></asp:Parameter>
    </InsertParameters>
</asp:SqlDataSource>

The above example does not uses GridDropDownColumn but you should not experience any problem when modifying it to your needs.

Now if you want to manually handle the insert you can again use the above SelectCommand setup but instead of setting the AllowAutomaticInserts property to true subscribe to the OnInsertCommand event where you can access the data.

ASPX:

<telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" runat="server"
            AutoGenerateColumns="False" OnInsertCommand="RadGrid1_InsertCommand">

C#:

protected void RadGrid1_InsertCommand(object sender, GridCommandEventArgs e)
{
    GridEditFormInsertItem insertItem = e.Item as GridEditFormInsertItem;
    Hashtable newValues = new Hashtable();
    insertItem.ExtractValues(newValues);
    string customerId = newValues["CustomerID"].ToString();
}

Have in mind that when following either of these two approaches you should set the DataField, DataSourceID, ListTextField and ListValueField properties of the column in order for it to function correctly. More information about these properties is available here.

Regards,
Angel Petrov
Telerik