ComboBox is not loaded

[Cecilie Nordbø]

Hi.
I have a grid with one combobox and some numerice columns. In edit/insert mode it is not possible to choose any value from the combobox, the combobox is locked and i can not cancel either. (I have to reload the page to get out of the edit/insert mode.) I am using EnableAutomaticLoadOnDemand = true and fill up the combobox in the ItemDataBound events. The code i am using is:

<telerik:RadGrid ID="RadGrid2" runat="server" AllowAutomaticDeletes="True" AllowAutomaticInserts="True" AllowAutomaticUpdates="True"
      AllowFilteringByColumn="True" AllowMultiRowSelection="True" AllowPaging="True" AllowSorting="True" DataSourceID="LinqDataSource1"
      GridLines="None" ondatabound="RadGrid1_DataBound" onitemdatabound="RadGrid1_ItemDataBound"
      onitemdeleted="RadGrid1_ItemDeleted" oniteminserted="RadGrid1_ItemInserted" onitemupdated="RadGrid1_ItemUpdated">
      <MasterTableView AutoGenerateColumns="False" CommandItemDisplay="Top" DataSourceID="LinqDataSource1" DataKeyNames="Id">
      <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
      <Columns>
          <telerik:GridTemplateColumn DataField="Id" HeaderText="Gruppe" SortExpression="Id" UniqueName="Id" AutoPostBackOnFilter="True" ShowFilterIcon="false">
              <FooterTemplate>Template footer</FooterTemplate><FooterStyle VerticalAlign="Middle" HorizontalAlign="Center" />
              <ItemTemplate><%#DataBinder.Eval(Container.DataItem, "Id")%></ItemTemplate>
              <EditItemTemplate>
              <telerik:RadComboBox DataTextField="Id" DataValueField="Id" ID="RadComboBox1" HighlightTemplatedItems="true" EmptyMessage="Velg et element..." AllowCustomText="true"
                          runat="server" Height="100px" Width="95px" SelectedValue='<%#Bind("Id") %>' AutoPostBack="true" EnableAutomaticLoadOnDemand="True"></telerik:RadComboBox>
              </EditItemTemplate>
          </telerik:GridTemplateColumn>
          <telerik:GridNumericColumn DataField="FEE" DataType="System.Double" HeaderText="Avgift" SortExpression="FEE" UniqueName="FEE">
          </telerik:GridNumericColumn>
          <telerik:GridNumericColumn DataField="PBE" DataType="System.Double" HeaderText="PBE" SortExpression="PBE" UniqueName="PBE">
          </telerik:GridNumericColumn>
          <telerik:GridEditCommandColumn CancelText="Avbryt" EditText="Endre" InsertText="Sett inn" UpdateText="Oppdater">
          </telerik:GridEditCommandColumn>
          <telerik:GridButtonColumn CommandName="Delete" Text="Slett" UniqueName="column1">
          </telerik:GridButtonColumn>
  </Columns>
  </MasterTableView>
  </telerik:RadGrid>

  <asp:LinqDataSource ID="LinqDataSource2" runat="server"
      OnInserting="GridDataSource_Inserting" ContextTypeName="Mobitech.Mtbs2InfoEasy.linq.Mtbs2InfoEasy_DataClassesDataContext"
      TableName="Groups" OrderBy="Id"
      Select="new (Id, FEE, PBE)">
  </asp:LinqDataSource>

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

   if (e.Item.OwnerTableView.IsItemInserted && e.Item is GridDataInsertItem)

   {               

         FillComboBoxWithClassCodes(e, "RadComboBox1");

         SetColumnWidthInInsertMode(e);                   

   }

   else if (!(e.Item is GridDataInsertItem) && e.Item.IsInEditMode)

   {
          FillComboBoxWithClassCodes(e, "RadComboBox1");

          SetColumnWidthInEditMode(e);

          SetFocusOnField(e, "PBE");

   }

}

 

private void FillComboBoxWithClassCodes(GridItemEventArgs e, string comboBoxName)

{

            var editItem = (GridDataItem) e.Item;

            if (editItem == null)

                return;

 

            var comboBox = (RadComboBox) editItem.FindControl(comboBoxName);

            comboBox.Items.Clear();

            


                                var classCodes = new List<string>();
                               for (int i = 1; i < 10; i++)
                              {
                                       classCodes.Add("B0" + i);
                              }

 

 

            foreach (var classCode in classCodes)

            {

                var item = new RadComboBoxItem();

                item.Text = classCode;

                item.Value = classCode;

                comboBox.Items.Add(item);

            }

 

            comboBox.DataBind();

}

I have used equivalent code in another project without problem with loading the combobox. So i don't understand why it is not working. Some have any idea what i am doing wrong?

[Tsvetina]

Hi Cecilie,

When you have EnableAutomaticLoadOnDemand set to true, you need to assign a DataSource for the RadComboBox control, so it can handle its binding automatically (you do not have to populate it manually).

My suggestion is, if you need to manually add the items to the combobox, that you consider replacing AutomaticLoadOnDemand property with EnableLoadOnDemand and populate your RadComboBox in its ItemsRequested event handler.

For more information you can view the respective help articles on EnableLoadOnDemand and EnableAutomaticLoadOnDemand.

Sincerely yours,
Tsvetina
the Telerik team

[Cecilie Nordbø]

I replaced AutomaticLoadOnDemand with EnableLoadOnDemand and populate RadComboBox in its ItemsRequested event handler.
It works for the case i have posted the code but i have another case where it  didn't worked. For the case that not work, worked if i remove the SelectedVaule, the combobox is loading the values but than the selected value is not updated. I have view the articles but can not find out what is wrong. The code is:

<telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" AllowFilteringByColumn="True" AllowPaging="True" AllowSorting="True"
       DataSourceID="LinqDataSource1" Culture="Norwegian, Bokmål (Norway)" ondatabound="RadGrid1_DataBound" onitemupdated="RadGrid1_ItemUpdated"
       PageSize="20" ShowStatusBar="True" Width="500px" onitemdatabound="RadGrid1_ItemDataBound" AllowAutomaticUpdates="True">
       <MasterTableView AutoGenerateColumns="False" EditMode="InPlace" DataKeyNames="FaretypeNumber,FareGroupNumber,FaresetId,CompanyId" DataSourceID="LinqDataSource1">
       <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
       <RowIndicatorColumn><HeaderStyle Width="20px"></HeaderStyle></RowIndicatorColumn>
       <ExpandCollapseColumn><HeaderStyle Width="20px"></HeaderStyle></ExpandCollapseColumn>
       <Columns>
           <telerik:GridTemplateColumn ReadOnly="true" DataField="FaretypeNumber" HeaderText="Billettkode" SortExpression="FaretypeNumber" UniqueName="FaretypeNumber" AutoPostBackOnFilter="True" ShowFilterIcon="false">
               <FooterTemplate>Template footer</FooterTemplate>
               <ItemTemplate><asp:Label ID="FaretypeLabel" runat="server"></asp:Label></ItemTemplate>
               <HeaderStyle Width="270px"></HeaderStyle>
           </telerik:GridTemplateColumn>
           <telerik:GridTemplateColumn HeaderStyle-Width="110px" UniqueName="GroupId" DataField="GroupId" HeaderText="Gruppe" AutoPostBackOnFilter="True" ShowFilterIcon="False" SortExpression="GroupId">
                   <FooterTemplate>Template footer</FooterTemplate>
                   <FooterStyle VerticalAlign="Middle" HorizontalAlign="Center" />
                   <ItemTemplate><%#DataBinder.Eval(Container.DataItem, "GroupId")%></ItemTemplate>
                   <EditItemTemplate>
                       <telerik:RadComboBox DataTextField="GroupId" DataValueField="GroupId" ID="RadComboBox1" HighlightTemplatedItems="true" EmptyMessage="Velg et element..."
                           SelectedValue='<%#Bind("GroupId")%>' runat="server"  Height="240px" Width="95px" EnableLoadOnDemand="true"  OnItemsRequested="RadComboBox1_ItemsRequested">
                       </telerik:RadComboBox>
                   </EditItemTemplate><HeaderStyle Width="110px"></HeaderStyle>
           </telerik:GridTemplateColumn>
           <telerik:GridEditCommandColumn CancelText="Avbryt" EditText="Endre" InsertText="Sett inn" UpdateText="Oppdater">
           <HeaderStyle Width="100px"></HeaderStyle><ItemStyle HorizontalAlign="Right" /></telerik:GridEditCommandColumn>
   </Columns>
   <EditFormSettings><EditColumn UniqueName="EditCommandColumn1"></EditColumn></EditFormSettings>
   </MasterTableView>
   <ClientSettings EnableRowHoverStyle="true">
       <ClientEvents OnRowDblClick="RowDblClick" />
       <Selecting AllowRowSelect="true" />
        <Resizing AllowColumnResize="true"/>
   </ClientSettings>
   <SortingSettings EnableSkinSortStyles="False" SortedAscToolTip="Sortert stigende" SortedDescToolTip="Sortet synkende" SortToolTip="Klikk her for å sortere" />
   </telerik:RadGrid>

   <asp:LinqDataSource ID="LinqDataSource1" runat="server"  ContextTypeName="Mobitech.Mtbs2InfoEasy.linq.Mtbs2InfoEasy_DataClassesDataContext"
       EnableUpdate="True" OrderBy="FaretypeNumber, FaresetId" TableName="Faretypes">
   </asp:LinqDataSource>

protected void RadComboBox1_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
     {
         if (o is RadComboBox)
         {
             var comboBox = (RadComboBox)o;
             comboBox.Items.Clear();

             SessionController sc = this.Session.GetSessionController();
             FcGroupMapping controller = sc.FcGroupMapping;
             List<string> groups = controller.GetGroups();
             foreach (var group in groups)
             {
                 var item = new RadComboBoxItem();
                 item.Text = group;
                 item.Value = group;
                 comboBox.Items.Add(item);
             }
         }
     }

I really hope some can help.

[Tsvetina]

Hi Cecilie,

When the RadComboBox with Load-On-Demand feature initially loads - it is empty and it has no items. Load-On-Demand fires and populates the control with data when user types in the input area or clicks on the drop-down toggle image (if there are no items in the RadComboBox). That is why when the parent control enters “Edit” mode – there are no items at the RadComboBox and an item cannot be preselected.

However, as a work around you can use the approach described in this CodeLibrary article which handles the RadGrid.OnItemDatabound event and creates an initial RadComboBoxItem to be displayed at the control input.

I hope this helps you achieve the desired functionality.

All the best,
Tsvetina
the Telerik team

[Cecilie Nordbø]

I have find a kind of way to load the combobox. I set  the AppendDataBoundItems property to true and use the itemdatabound event to fill up the combobox, also to set the selectedvalue and the combobox is loaded. But when i am saving the edit record, the new value from the combobox is not saved. The update event is fired. I have tried to manually save the edit record in the updateCommand event without luck.
(And it works neither to do it automatic.) I also want to tried to changed the value here but the DataItem is null and also when i am using the FindControl on the griddataItem. So how/where can I set the new value manually?

[Princy]

Hello Cecilie,

 Another suggestion is adding the items in OnDataBound event of RadComboBox. This is the code that i tried in my appilcation for a similar kind of scenario. I tried adding the new RadComboBoxItems in OnDataBound event and in UpdateCommand I could access the Selectedvalue. Check out the following code snippet.

ASPX:

<EditItemTemplate>
     <telerik:RadComboBox DataSourceID="SqlDataSource1" DataTextField="EmployeeID"
       DataValueField="EmployeeID" ID="RadComboBox1"
       HighlightTemplatedItems="true" AppendDataBoundItems="true" runat="server"
       EnableLoadOnDemand="true" OnDataBound="RadComboBox1_DataBound">
     </telerik:RadComboBox>
</EditItemTemplate>

C#:

protected void RadComboBox1_DataBound(object sender, EventArgs e)
    {
        RadComboBox combo = (RadComboBox)sender;
        RadComboBoxItem item1 = new RadComboBoxItem("25","25");
        combo.Items.Add(item1);
    }

protected void RadGrid2_UpdateCommand(object source, GridCommandEventArgs e)
    {
          GridEditFormItem editedItem = (GridEditFormItem)e.Item;
          RadComboBox combo = (RadComboBox)editedItem.FindControl("RadComboBox1");
          string value = combo.SelectedValue;
    }

Thanks,
Princy.

[Cecilie Nordbø]

The problem is not accessing the selected value but how i can save this value to the dataitem in RadGrid2_UpdateCommand without doing a manually update. Dataitem is null here. And i can not find a event where i both can access the selected value and the dataitem. Someone who knows?

[Tsvetina]

Hello Cecilie,

In the UpdateCommand event handler of RadGrid you should be updating the GridEditableItem instance, not the GridDataItem. You can see the three general approaches for this situation in this help article. You may try to implement the second one - using the ExtractValuesFromItem method - this KB article deals with a scenario similar to yours, so you can use it as an example.

Best wishes,
Tsvetina
the Telerik team