Radgrid batch edit - get value from combobox and read only values code-behind

2 posts, 0 answers
  1. Lars Erik
    Lars Erik avatar
    2 posts
    Member since:
    May 2015

    Posted 01 Oct 2019 Link to this post

    Hi 

    I have a problem with radgrid in batch edit mode. I am trying to find out how I can get all values from all columns/rows when saving. I have not bound this grid to a simple datasource. Based on all data from the grid I need to create and populate a new class and send it to the server (via other functions). So I need to get all values from the grid so I can build and populate the correct class (datatable). My grid consist of both normal editable fields, read-only fields and radcombo boxes. Based on the value in my combobox I make columns read-only or not. I am trying to achive a mass update of a list<class>.

    I need to find all values in code-behind! I can find the new values for updated editable fields this example

    foreach (GridBatchEditingCommand command in e.Commands)
                {
                    if ((command.Type == GridBatchEditingCommandType.Update))
                    {
                        Hashtable newValues = command.NewValues;
                        Hashtable oldValues = command.OldValues;

     

    But I can not find out how I can get:

    1. selected value from radcombobox (datasource for this combo is build on-click).

    2. value from read-only columns in the grid.

    <%@ Page Title="Mass update of requisition lines/Parts" Language="C#" MasterPageFile="~/SunFlower.Master" AutoEventWireup="true" CodeBehind="RequisitionLineMassUpdate.aspx.cs" Inherits="SunflowerWeb.RequisitionLineMassUpdate" %>
     
    <%@ Register Assembly="Sunflower.Web.Controls" Namespace="Sunflower.Web.Controls" TagPrefix="sunflower" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
     
    <asp:Content ID="MassUpdateContent" ContentPlaceHolderID="mcph"  runat="server">
         
       <telerik:RadAjaxManagerProxy ID="ManagerProxy" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="MasterAjaxManger">
                    <UpdatedControls>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="gridMassUpdate">
                    <UpdatedControls>
                    </UpdatedControls>
                </telerik:AjaxSetting>
     
            </AjaxSettings>
        </telerik:RadAjaxManagerProxy>
     
         <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">
                var ReqLineFunctions = new Array();
     
                function saveAll() {
                    var grid1 = $find("<%=gridMassUpdate.ClientID%>");
                    var batchManager1 = grid1.get_batchEditingManager();
                    var hasChanges = batchManager1.hasChanges(grid1.get_masterTableView());
                    if (hasChanges) {
                        batchManager1.saveTableChanges([grid1.get_masterTableView()]);
                    } else {
                        var ajaxPanel = $find("<%=RadAjaxPanel1.ClientID%>");
                        ajaxPanel.ajaxRequest("saveChanges");
                    }
                }
     
                function GetSelectedFunction(sender, args) {
                    var batchManager = sender.get_batchEditingManager();
                    var masterTable = sender.get_masterTableView();
                    masterTable.get_dataItems();
                    var dataItem = $find(args.get_row().id);
                    var combo = dataItem.findControl("cbFunction");
                    var comboValue = combo.get_selectedItem().get_value();
                    return comboValue;            
                }
     
                function GetReqLineId(sender, args) {
                    var batchManager = sender.get_batchEditingManager();
                    var masterTable = sender.get_masterTableView();
                    masterTable.get_dataItems();
                    var dataItem = $find(args.get_row().id);
                    var reqLineId = dataItem.findElement("lblReqLineId");
                    var reqLineIdValue = reqLineId.innerText;
                    return reqLineIdValue;            
                }
     
                function batchEditOpening(sender, args) {
     
                    var selectedFunc = GetSelectedFunction(sender, args);
                    var reqLineId = GetReqLineId(sender, args);
     
                    if (selectedFunc !== null && reqLineId !== null) {
                        if (ReqLineFunctions.length > 0) {
                            //Is partnumber updatable
                            for (let i = 0; i < ReqLineFunctions.length; i++) {
                                if (ReqLineFunctions[i].ReqLineId === reqLineId) {
                                    var funcs = ReqLineFunctions[i].Functions;
     
                                    for (let k = 0;k < funcs.length; k++) {
                                        if (funcs[k].FunctionName === selectedFunc) {
                                            if (!funcs[k].IsPartUpdatable) {
                                                args.set_cancel(true);
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
     
                function SelectFunction(sender, eventArgs) {
                    //todo: populate the rest of the columns based on the selected function
               
                }
     
                function GetFunctions(sender, args) {
                    var text = args._text;
                    itemsRequesting(sender, args);
     
                    //Dummy collection of functions. todo: replace with functions from api-call
                    var funcs = new Array();
                    funcs.push({
                         FunctionName: "SuppToTecOk",
                         FunctionDescription : "Receive from supplier",  
                         IsPartUpdatable : true
                      });
     
                    funcs.push({
                         FunctionName: "TecOkToCust",
                         FunctionDescription : "Deliver to customer",  
                         IsPartUpdatable : false
                      });
     
                    //add to global array so i can lookup and find values later
                    var reqlineid = sender.get_attributes().getAttribute("data-reqlineid");
                    if (reqlineid !== null) {
                        ReqLineFunctions.push({
                            ReqLineId: reqlineid,
                            Functions: funcs
                        })
                    }
     
                    FillCombo(sender, funcs);
                    sender.highlightAllMatches(sender.get_text());
                }
     
                // This cancels the default RadComboBox behavior
                function itemsRequesting(sender, args) {
                    if (args.set_cancel != null) {
                        args.set_cancel(true);
                    }
                    if (sender.get_emptyMessage() == sender.get_text())
                        sender.set_text("");
                }
     
                function FillCombo(combo, functions) {
                    combo.clearItems();
                    combo.trackChanges();
                    for (var i = 0; i < functions.length; i++) {
                        var comboItem = new Telerik.Web.UI.RadComboBoxItem();
                        comboItem.set_text(functions[i].FunctionDescription);
                        comboItem.set_value(functions[i].FunctionName);
                        combo.get_items().add(comboItem);
                    }
                }
     
            </script>
        </telerik:RadCodeBlock>
     
        <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" OnAjaxRequest="RadAjaxPanel1_AjaxRequest">
            <h1>Mass update parts</h1>
            <h4><asp:Label ID="litTip" runat="server" Text=""></asp:Label></h4>
     
            <div class="buttonFormBorderXL">
                <div class="fltlft buttons tools">
                    <telerik:RadButton runat="server" ID="RadButton1" AutoPostBack="false" Text="Save all"  OnClientClicked="saveAll"></telerik:RadButton>
                </div>
            </div>
            <div class="box fltlft formXL clft">
                <img src="fwimages/form_curve01.gif" class="curve01" alt="" />
                <img src="fwimages/form_curve02.gif" class="curve02" alt="" />
                <br />
     
                <div class="simpleList">
                    <telerik:RadGrid ID="gridMassUpdate" renderMode="Lightweight" runat="server" OnNeedDataSource="gridMassUpdate_NeedDataSource" AllowAutomaticInserts="True" 
                            AllowPaging="false" AutoGenerateColumns="False" Skin="SunflowerSkin" EnableEmbeddedSkins="False"
                            OnBatchEditCommand="gridMassUpdate_BatchEditCommand" CellSpacing ="0" GridLines="None" Height="680px">
                    <ClientSettings>
                        <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                    </ClientSettings>
                         
                    <AlternatingItemStyle Font-Size="8pt" />
                    <MasterTableView EditMode="Batch" PageSize="50" CommandItemDisplay="None" AllowPaging="false" DataKeyNames="SearchResultRowId" AutoGenerateColumns="false">
                        <BatchEditingSettings EditType="Cell"/>
                        <Columns>
                            <telerik:GridTemplateColumn Visible="true" ReadOnly="true" UniqueName="SearchResultRowId"  DataField="SearchResultRowId" HeaderText="id">
                                <ItemTemplate>
                                    <telerik:RadLabel ID="lblReqLineId" runat="server" Text='<%# Eval("SearchResultRowId")%>'></telerik:RadLabel>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                             
                            <telerik:GridNumericColumn Visible="true" ReadOnly="true" DataField="RequisitionNumber" HeaderText="Requisition" AllowFiltering="false">
                            </telerik:GridNumericColumn>
     
                            <telerik:GridTemplateColumn DataField="PartNumber"  HeaderText="Part" UniqueName="PartNumber">
                                <ItemTemplate>
                                    <telerik:RadLabel ID="lblPartNumber" runat="server" Text='<%# Eval("PartNumber")%>'></telerik:RadLabel>
                                </ItemTemplate>
                                <EditItemTemplate>
                                    <telerik:RadTextBox ID="txtPartNumber" runat="server" Text='<%# Eval("PartNumber")%>'></telerik:RadTextBox>
                                </EditItemTemplate>
                            </telerik:GridTemplateColumn>
     
                            <telerik:GridBoundColumn DataField="PartDescription" ReadOnly="true" HeaderText="Description" UniqueName="PartDescription">
                            </telerik:GridBoundColumn>
     
                             <telerik:GridTemplateColumn HeaderText="Function" UniqueName="SelectedFunction">
                                <ItemTemplate>
                                    <telerik:RadComboBox ID="cbFunction" RenderMode="Lightweight" runat="server" EnableLoadOnDemand="true" EmptyMessage="Select"
                                        data-reqlineid='<%# Eval("SearchResultRowId")%>' OnClientItemsRequesting="GetFunctions" OnClientSelectedIndexChanged="SelectFunction" Text="Select">
                                    </telerik:RadComboBox>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
     
                        </Columns>
                    </MasterTableView>
                    <ClientSettings>
                        <ClientEvents OnBatchEditOpening="batchEditOpening" />
                    </ClientSettings>
                    <ItemStyle Font-Size="8pt" />
                </telerik:RadGrid>
            </div>
        </div>
        </telerik:RadAjaxPanel>
    </asp:Content>

     

    and code-behind:

    using Sunflower.Web.Controls;
    using System;
    using System.Collections;
    using System.Collections.Generic;
    using System.Data;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace SunflowerWeb
    {
        public partial class RequisitionLineMassUpdate : System.Web.UI.Page
        {
            private bool saveChanges = false;
     
            private List<Sunflower.Business.RequisitionLineMassUpdate> ReqLines
            {
                get
                {
                    return (List<Sunflower.Business.RequisitionLineMassUpdate>)Session["ReqLines" + MassUpdateId];
                }
            }
     
            public string MassUpdateId
            {
                get
                {
                    return (string)ViewState["MassUpdateId"];
                }
                set
                {
                    ViewState["MassUpdateId"] = value;
                }
            }
     
            protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack)
                {
                    if (Request.QueryString["MassUpdateId"] == null && string.IsNullOrEmpty(MassUpdateId))
                        MassUpdateId = Guid.NewGuid().ToString();
                    else if (Request.QueryString["MassUpdateId"] != null)
                        MassUpdateId = Request.QueryString["MassUpdateId"];
                }
     
            }
     
            protected void gridMassUpdate_BatchEditCommand(object sender, GridBatchEditingEventArgs e)
            {
                saveChanges = true;
     
                //Trying to read all items....do not work!
                foreach (GridDataItem item in gridMassUpdate.Items)
                {
                    string func = item.Cells[4].Text;  //radcombo
                    string part = item.Cells[2].Text;  //radtexbox
                }
     
                foreach (GridBatchEditingCommand command in e.Commands)
                {
                    if ((command.Type == GridBatchEditingCommandType.Update))
                    {
                        Hashtable newValues = command.NewValues;
                        Hashtable oldValues = command.OldValues;
     
                        try
                        {
                            string combinedId = newValues["SearchResultRowId"].ToString();
                            string partNumber = newValues["PartNumber"].ToString();
     
                            //NONONO. Not possible to get value from radcombobox. Why ?
                            string function = newValues["SelectedFunction"].ToString();
                        }
                        catch (Exception ex)
                        {
                        }
                    }
                }
            }
     
            protected void Page_PreRender(object sender, EventArgs e)
            {
                if (saveChanges)
                {
                    //Save the values from the other controls
                }
            }
     
            protected void RadAjaxPanel1_AjaxRequest(object sender, AjaxRequestEventArgs e)
            {
                if (e.Argument == "saveChanges")
                {
                    saveChanges = true;
                }
            }
     
            protected void gridMassUpdate_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
            {
                if (ReqLines.Count > 0)
                {
                    gridMassUpdate.DataSource = ReqLines;
                }
            }
     
        }
    }

     

    Is it possible to get all values from an updated radgrid in batch mode ????

     

    Best regards

    Lars

     

     

     

     

     

     

  2. Eyup
    Admin
    Eyup avatar
    3962 posts

    Posted 03 Oct 2019 Link to this post

    Hello Lars,

     

    Generally, I am afraid having combo with individual binding or EnableLoadOnDemand in Batch editing scenario is not supported:
    https://www.telerik.com/support/kb/aspnet-ajax/grid/details/radgrid-batch-editing-templates-and-specifics

    However, since you are so close to the final implementation and have everything else working as expected, I will try to assist you in resolving this remaining problem.

    So, to get the values from the ReadOnly fields, you can add the field names to the DataKeyNames collection of the MasterTableView tag. Then, you will be able to access these values any time using the GetDataKeyValue method:
    https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/rows/accessing-cells-and-rows#accessing-raw-field-data-and-key-values

    This leaves only the combo value. This can be somewhat tricky, but nevertheless, we can achieve it. Basically, you can try these things to get the value on the server:

    1. SelectedValue property of the combo

    2. Text property of the combo

    3. On selected index changed client-side event handler of the combo set the value to some HiddenField:
    https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.hiddenfield?view=netframework-4.8

    If you want to achieve that for multiple rows, you can also save the values in a JS object using their IDs:
    https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/rows/accessing-cells-and-rows#getdatakeyvalue

    Then, you can pass this object to the HiddenField.value using JSON.stringify.

    And finally, you can deserialize it to a Dictionary on server side to access the value, similar to this:

    JavaScriptSerializer serializer = new JavaScriptSerializer();
                Dictionary<string, string> details = serializer.Deserialize<Dictionary<string, string>>(e.CommandArgument.ToString());

    I hope this will prove helpful. Feel free to try out these solutions and keep us updated on the result.

     

    Regards,
    Eyup
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top