Radgrid with a multiselect field edited InPlace with RadComboBox CheckBoxes=true

5 posts, 0 answers
  1. Darrell
    Darrell avatar
    4 posts
    Member since:
    Feb 2014

    Posted 18 Jun 2014 Link to this post

    Wondering if this is possible - that is, to edit a radgrid row that has a "multiselect" field that displays a comma separated list when viewed in the grid, but when the row is edited InPlace there is a way to select multiple items (and thus get and save their ID values), for example using RadComboBox with CheckBoxes=true, or even an autocomplete box that allows multiselection.

    How to populate the box - how to populate and select items on editing the row, and how to get multiple values back on saving.

    Possible? If so any examples out there?

    Thanks
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Jun 2014 in reply to Darrell Link to this post

    Hi Darrell,

    Please try the below sample code snippet which works fine at my end.

    ASPX:
    <telerik:RadGrid ID="rgrdEmployees" runat="server" DataSourceID="sqldsEmployees"
        AutoGenerateEditColumn="true" OnUpdateCommand="rgrdEmployees_UpdateCommand">
        <MasterTableView>
            <Columns>
                <telerik:GridTemplateColumn>
                    <EditItemTemplate>
                        <telerik:RadComboBox ID="rcboEmployees" runat="server" DataSourceID="sqldsEmployees" DataTextField="FirstName" CheckBoxes="true">
                        </telerik:RadComboBox>
                    </EditItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    <asp:SqlDataSource ID="sqldsEmployees" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT [EmployeeID], [FirstName] FROM [Employees]"></asp:SqlDataSource>

    C#:
    protected void rgrdEmployees_UpdateCommand(object sender, GridCommandEventArgs e)
    {
        GridEditableItem item = (GridEditableItem)e.Item;
        //accessing RadComboBox
        RadComboBox multiSelectCombo = (RadComboBox)item.FindControl("rcboEmployees");
        foreach (RadComboBoxItem checkedItem in multiSelectCombo.CheckedItems)
        {
            // all the checked Items
            string itemText = checkedItem.Text;
            //your code for updating the DB
        }
    }

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Darrell
    Darrell avatar
    4 posts
    Member since:
    Feb 2014

    Posted 13 Jul 2014 in reply to Shinu Link to this post

    Thanks for your response, Shinu.
    With your help I got this working. A few code snippets to help others:
    This column in radgrid:
       
                <telerik:GridTemplateColumn UniqueName="AllSites" HeaderText="Regions" SortExpression="" ItemStyle-Width="400px"><br>                    <ItemTemplate><br>                        <asp:Label ID="lblSiteList" runat="server" Text='<%# Eval("AllSites") %>'></asp:Label><br>                    </ItemTemplate><br>                    <EditItemTemplate><br>                        <!-- RadComboBox with all sites --><br>                        <telerik:RadComboBox ID="RadComboBoxSites" runat="server" Width="100%" CheckBoxes="true"><br>                        </telerik:RadComboBox><br>                    </EditItemTemplate><br>                </telerik:GridTemplateColumn>

    And this method in code behind to populate combobox when editing a row, or to show label in each row when not editing:
    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
        {
            if (e.Item is GridEditableItem && (e.Item as GridEditableItem).IsInEditMode)
            {
                GridEditableItem item = e.Item as GridEditableItem;
                //bind dropdownlist
                GridEditManager editMan = item.EditManager;
                GridDropDownListColumnEditor editor = editMan.GetColumnEditor("RegionDropdown") as GridDropDownListColumnEditor;
                Region.BindFilterRegionList(editor, "All", true);
                editor.DropDownListControl.SelectedValue = DataBinder.Eval(e.Item.DataItem, "RegionID").ToString();
                //populate site check box list
                RadComboBox siteSelector = item.FindControl("RadComboBoxSites") as RadComboBox;
                SiteDetails.BindFilterSiteList(siteSelector);
                //now tick items in check box list
                if (e.Item is GridEditFormInsertItem || e.Item is GridDataInsertItem)
                {
                    // inserting item - nothing to add to do list
                }
                else
                {
                    // editing item
                    Word word = new Word((int)item.GetDataKeyValue("ID"));
                    foreach (RadComboBoxItem site in siteSelector.Items)
                    {
                        if (word.SiteIDs.Contains(int.Parse(site.Value)))
                        {
                            site.Checked = true;
                        }
                    }
                }
            }
            else if (e.Item is GridDataItem)
            {
                GridDataItem item = (GridDataItem)e.Item;
                DataRowView row = (DataRowView)e.Item.DataItem;
                item["RegionDropdown"].Text = row["RegionName"].ToString();
            }
        }

    And these methods to get data after saving:

    protected void RadGrid1_UpdateCommand(object sender, GridCommandEventArgs e)
    {
        var item = ((GridEditableItem)e.Item); 
        //get multi-select sites if any
        RadComboBox siteSelector = item.FindControl("RadComboBoxSites") as RadComboBox;
        List<int> siteIDs = new List<int>();
        foreach (RadComboBoxItem checkedItem in siteSelector.CheckedItems)
        {
            siteIDs.Add(int.Parse(checkedItem.Value));
        }
        //etc ...    
    }
     
    protected void RadGrid1_InsertCommand(object sender, GridCommandEventArgs e)
    {
        var item = ((GridEditableItem)e.Item);
        // get siteIDs if set
        List<int> siteIDs = new List<int>();
        RadComboBox siteSelector = item.FindControl("RadComboBoxSites") as RadComboBox;
        var collection = siteSelector.CheckedItems;
        foreach (var selectedItem in collection)
        {
            siteIDs.Add(int.Parse(selectedItem.Value));
        }
        //etc...
    }
     


    Thanks
    Darrell

  5. Elango
    Elango avatar
    1 posts
    Member since:
    Apr 2013

    Posted 01 Jun 2015 in reply to Darrell Link to this post

    This does not work in Batch Edit mode. I usually set the SetCellValue clientside event to set the value of a selected RadComboBox onto the Label field. But that doesn't work with Multi-select checkboxes as setting the value throws ScriptManager errors. Is there a right way to do that?

      <MasterTableView CommandItemDisplay="Top" AutoGenerateColumns="False" DataSourceID="objDataSourceID" HorizontalAlign="NotSet" EditMode="Batch">

    <Columns>

    .................................

    <telerik:GridTemplateColumn DataField="GroupName" UniqueName="GroupName" HeaderText="Group"
    ItemStyle-Width="400px" HeaderStyle-Width="400px" AllowFiltering="true" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true">
    <ItemTemplate>
    <asp:Label ID="lblGroupName" runat="server" Width="395px" Text='<%# Eval("GroupName")%>'></asp:Label>
    </ItemTemplate>
    <EditItemTemplate>
    <telerik:RadComboBox ID="searchgroupname" runat="server" AutoPostBack="false" EmptyMessage="" Width="195" DropDownWidth="195" Height="100"
    EnableLoadOnDemand="true" OnItemsRequested="BindRowCombo" OnClientItemsRequested="OnClientItemsRequested" ClientIDMode="Static"
    CheckBoxes="true" EnableCheckAllItemsCheckBox="false">
    </telerik:RadComboBox>
    <asp:RequiredFieldValidator ID="searchgroupnameValidator" runat="server" ControlToValidate="searchgroupname"
    ErrorMessage="*Required" ForeColor="Red" Display="Dynamic"></asp:RequiredFieldValidator>
    </EditItemTemplate>
    </telerik:GridTemplateColumn>

     

    </Columns>

    </MasterTableView>
    <ClientSettings AllowKeyboardNavigation="true">
    <ClientEvents OnBatchEditOpening="SetLabels" OnBatchEditSetCellValue="SetCellValue" OnCommand="gridCommand" />
    <Scrolling AllowScroll="true" UseStaticHeaders="true" />
    </ClientSettings>

  6. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 04 Jun 2015 Link to this post

    Hi Elango,

    I have to say that this scenario is not supported out of the box. In order to make things work one needs to handle things manually by subscribing to the four batch editing events(OnBatchEditGetCellValue, OnBatchEditSetCellValue, OnBatchEditGetEditorValueOnBatchEditSetEditorValue) as demonstrated here. The idea is to pass the checked combo items values to the arguments in the OnBatchEditGetEditorValue handler thus making them available on the server.

    Regards,
    Maria Ilieva
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017