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

Basic sample of DropDown in RadGrid

4 Answers 269 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Damon
Top achievements
Rank 1
Damon asked on 02 Nov 2012, 01:23 AM
I have been wrestling with this on and off over the last couple days, and have not yet found a good basic sample. I am managing data in a business layer, so what I'm passing into the grid are lists of objects. For simplicity, let's say the two lists are:

The rows are:
ClientId
ClientName
ContactId
ContactName
ContactTypeId

The ContactTypeId column needs to provide a lookup, and on ItemDataBound I am passing a list of:
ContactTypeId
ContactTypeName

So far I have gotten it to almost work in several ways, but there always seems to be some weird behavior. Is there a good sample somewhere with the fields to set to connect up the name and id on the lookup column, and to display the correct choice on view and when the dropdown first enters edit mode. Sorry if I'm missing something obvious, I feel like I'm running into a (very hard) wall.

Cheers.

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 02 Nov 2012, 07:09 AM
Hi,

I suppose you want to show the 'ContactTypeId' of the row being selected in the GridDropColumn in edit mode. Please take a look into the following Code snippet I tried.

ASPX:
<telerik:GridDropDownColumn UniqueName="DropDown1" DropDownControlType="RadComboBox"></telerik:GridDropDownColumn>

C#:
protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
{
   if (e.Item is GridEditableItem && e.Item.IsInEditMode)
   {
      GridEditableItem eitem = (GridEditableItem)e.Item;
      RadComboBox rdbmx = (RadComboBox)eitem["DropDown1"].Controls[0];
      rdbmx.DataSource=DataSource;
      rdbmx.DataTextField = "ContactTypeId";
      rdbmx.DataValueField = "ContactTypeName";
      rdbmx.DataBind();
      rdbmx.SelectedItem.Text = (string)DataBinder.Eval(e.Item.DataItem, "ContactTypeId").ToString();
   }
}

Please provide your code if it doesn't help.

Thanks,
Shinu.
0
Damon
Top achievements
Rank 1
answered on 02 Nov 2012, 05:23 PM
Hi Shinu,
Thank you for the reply. You are pretty much right on in terms of getting what I'm trying to do, the only difference is that I want to display the list of ContactTypeNames in the dropdown, the selected ContactTypeName in the row when not in edit mode, and store the ContactTypeId in the row.

The behavior I am getting now is similar to what I've been bumping into this week. The selected value is not showing up when the row is in View mode, it just shows up blank. When I go into edit mode, I'm getting the correct member of the list selected by default, but the actual dropdown lists are wonky. Some rows have the correct list to choose from, all have the right number of choices, but the list comes up for most rows with a missing selection and a duplicated one. For example, editing row 1 could show:

Brother
Sister
Mother

Where editing row 2 would show:

Sister
Sister
Mother

This list is hard-coded in my FakeDB class with no edit capability, so I know the lists are always the same. Here is the relevant code.

protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
    RadGrid1.DataSource = FakeDB.GetConnections();
}
 
protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
{
    if (e.Item is GridEditableItem && e.Item.IsInEditMode)
    {
        GridEditableItem eitem = (GridEditableItem)e.Item;
        RadComboBox rdbmx = (RadComboBox)eitem["ContactType"].Controls[0];
        var contactTypes = FakeDB.GetContactTypes();
        rdbmx.DataSource = contactTypes;
        rdbmx.DataTextField = "ContactTypeName";
        rdbmx.DataValueField = "ContactTypeId";
        rdbmx.DataBind();
        int contactTypeId = (int)DataBinder.Eval(e.Item.DataItem, "ContactTypeId");
        ContactType conType = contactTypes.AsQueryable().First<ContactType>(c => c.ContactTypeId == contactTypeId);
        rdbmx.SelectedItem.Text = conType.ContactTypeName;
    }
}


<telerik:GridDropDownColumn FilterControlAltText="Filter ContactType column"
    HeaderText="Contact Type" UniqueName="ContactType"
    DropDownControlType="RadComboBox" DataField="ContactTypeId">
</telerik:GridDropDownColumn>

In case this helps, here are the two data classes I am using and populating with fake data:

public partial class ContactConnection
{
    public int ClientId{get;set;}
    public string ClientName {get;set;}
    public int ContactId {get;set;}
    public string ContactName {get;set;}
    public int ContactTypeId { get; set; }
}
 
 
public partial class ContactType
{
    public int ContactTypeId {get;set;}
    public string ContactTypeName { get; set; }
}


Thanks again for your help!
0
Damon
Top achievements
Rank 1
answered on 02 Nov 2012, 09:31 PM
Maybe someone from Telerik can chime in?
0
Damon
Top achievements
Rank 1
answered on 02 Nov 2012, 11:49 PM
Solved.

Ok, this is not optimized, but I finally have the behavior I need. The trick, apparently, is to set the Edit and View modes separately, as far as I can tell the Grid has no way to work with the data friendly int in the record and display the user friendly string from the lookup object. Hopefully this will save someone some time and headache. Here is the code behind and the markup:

protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
{
    var contactTypes = FakeDB.GetContactTypes();
    if (e.Item is GridDataItem)
    {
        int contactTypeId = (int)DataBinder.Eval(e.Item.DataItem, "ContactTypeId");
        ContactType conType = contactTypes.AsQueryable().First<ContactType>(c => c.ContactTypeId == contactTypeId);
        GridDataItem item = e.Item as GridDataItem;
        item["ContactType"].Text = conType.ContactTypeName;
    }
 
    if (e.Item is GridEditableItem && e.Item.IsInEditMode)
    {
        GridEditableItem eitem = (GridEditableItem)e.Item;
        DropDownList rdbmx = (DropDownList)eitem["ContactType"].Controls[0];
        rdbmx.DataSource = contactTypes;
        rdbmx.DataTextField = "ContactTypeName";
        rdbmx.DataValueField = "ContactTypeId";
        rdbmx.DataBind();
        int contactTypeId = (int)DataBinder.Eval(e.Item.DataItem, "ContactTypeId");
        ContactType conType = contactTypes.AsQueryable().First<ContactType>(c => c.ContactTypeId == contactTypeId);
        rdbmx.Items.FindByValue(conType.ContactTypeId.ToString()).Selected = true;
    }
}


<telerik:GridDropDownColumn FilterControlAltText="Filter ContactType column"
    HeaderText="Contact Type" UniqueName="ContactType"
    DropDownControlType="DropDownList" DataField="ContactTypeId" ListDataMember="ContactTypeId"
    ListTextField="ContactTypeId" ListValueField="ContactName">
</telerik:GridDropDownColumn>


The POCO objects I'm using to pass in data are in a post above.

Cheers!
Tags
Grid
Asked by
Damon
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Damon
Top achievements
Rank 1
Share this question
or