This is a migrated thread and some comments may be shown as answers.
RadGrid Model Binding for Custom Edit Forms
1 Answer 23 Views
This is a migrated thread and some comments may be shown as answers.
Angelo
Top achievements
Rank 1
Angelo asked on 05 Jul 2016, 01:13 PM

Hi,

Trying to gather some info on how to bind the model to a RadGrid when in Edit mode for a dropdown list (or even a RadDropDownList).

I have the following markup:

<telerik:RadGrid ID="rgTest" runat="server"
    AutoGenerateColumns="false"
    AllowPaging="true"
    AllowSorting="true"
    ClientSettings-EnableRowHoverStyle="true"
    OnItemCommand="rgTest_ItemCommand"
    OnDeleteCommand="rgTest_DeleteCommand"
    OnItemDataBound="rgTest_ItemDataBound"
    PageSize="10" >
    <PagerStyle Mode="NextPrevAndNumeric" />
    <MasterTableView AutoGenerateColumns="false"
        DataKeyNames="Id"
        SelectMethod="GetData"
        UpdateMethod="UpdateData"
        ItemType="Model.TestData"
        CommandItemDisplay="Top">
        <CommandItemSettings ShowAddNewRecordButton="false" />
        <Columns>
            <telerik:GridButtonColumn
                UniqueName="EditItem"
                CommandName="Edit"
                ItemStyle-Width="40"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-ForeColor="White"
                Text="Edit"
                ButtonType="LinkButton"
                ButtonCssClass="btn btn-primary btn-sm">
            </telerik:GridButtonColumn>
            <telerik:GridTemplateColumn UniqueName="Id" HeaderText="ID">
                <ItemTemplate>
                    <asp:Label ID="lblID" runat="server" Text='<%# Item.Id %>'></asp:Label>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="TestTitle" HeaderText="Title">
                <ItemTemplate>
                    <asp:Label ID="lblTestTitle" runat="server" Text='<%# Item.TestTitle %>'></asp:Label>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="TestType" HeaderText="Type">
                <ItemTemplate>
                    <asp:Label ID="lblTestType" runat="server" Text='<%# Item.TestType %>'></asp:Label>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
         
        <EditFormSettings EditFormType="Template">
            <FormStyle />
            <FormTemplate>
                <label for="txtTestTitle" class="col-md-4 control-label">Title</label>
                <asp:TextBox ID="txtTestTitle" runat="server" ClientIDMode="Static" Text='<%# BindItem.TestTitle %>' CssClass="form-control" autocomplete="off"></asp:TextBox>
                <label for="ddlType" class="col-md-4 control-label">Type</label>
                <asp:DropDownList ID="ddlType" runat="server" Width="100%" CssClass="form-control" >
                </asp:DropDownList>
            </FormTemplate>
        </EditFormSettings>
    </MasterTableView>
</telerik:RadGrid>

My code behind as follows:

public IQueryable<Model.TestData> GetData()
{
    DbContext ctx = new DbContext();
    return (from c in ctx.TestData
       select c).OrderBy(a => a.Id);
}
 
public void UpdateWebProjectRequest(int Id)
{
    using(DbContext ctx = new DbContext())
    {
        Model.TestData td = ctx.TestData.Where(a => a.Id == Id).FirstOrDefault();
 
        TryUpdateModel(td);
        if (ModelState.IsValid)
        {
         ctx.SaveChanges();
        }
    }
}
 
protected void rgTest_ItemDataBound(object sender, GridItemEventArgs e)
{
    if(e.Item is GridEditableItem && e.Item.IsInEditMode)
    {
        GridEditableItem editItem = (GridEditableItem)e.Item;
 
        // Populate the DropdownList here.
        DropDownList ddlType = (DropDownList) editItem.FindControl("ddlType");
         
        // Some method here to load the dropdownlist.
        var list = new List<Models.TestTypes>();
        ddlType.DataSource = lst;
        ddlType.DataValueField = "TypeId";
        ddlType.DataTextField = "TypeName";
        ddlType.DataBind();

        ddlType.SelectedValue = DataBinder.Eval(editItem.DataItem, "TestType").ToString();

    }
}

The issue I am having is that when I changed the value in the dropdownlist and invoke an update command, the new value selected on the dropdownlist is not being propagated to the model, hence, the correct data is not being saved.

I've looked at the article in this link:

http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/edit-mode/custom-edit-forms

But I am not able to figure out how to bind the dropdownlist value properly.

Any suggestions or ideas would be appreciated.

Thanks.

~A

 

1 Answer, 1 is accepted

Sort by
0
Viktor Tachev
Telerik team
answered on 08 Jul 2016, 09:21 AM
Hello Angelo,

Please examine the following article that describes in detail how you can use RadGrid and Model Binding.



Regards,
Viktor Tachev
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Grid
Asked by
Angelo
Top achievements
Rank 1
Answers by
Viktor Tachev
Telerik team
Share this question
or