Get / Set RadComboBox values client side RadGrid BathEdit mode

2 posts, 0 answers
  1. Sean
    Sean avatar
    1 posts
    Member since:
    Feb 2016

    Posted 25 Jul Link to this post

    Greetings,

    I am trying to copy a selection from 1 RadComboBox to 11 other RadComboBoxes within a RadGrid.  I am using BatchEdit mode so am using client-side script.  The dataitem.findElement("cboRadPerson") in my script returns a div and not a combo box. Maybe there is a complication because I have a button in the EditItemTemplate.

    What is the best way to get the selected value of  a RadComboBox, and what is the best way to set the selected value in a RadComboBox?

    Thanks, Sean

            function CopyPerson(event) {

                event = event || window.event;
                var id = event.srcElement.name;
                var moFrom = id.slice(-2);
                var masterTableView = $find('<%= gvLINE_ITEM.ClientID %>').get_masterTableView();
                var selectedrow = masterTableView.get_selectedItems()[0];
                var dataitem = masterTableView.get_dataItems()[selectedrow._itemIndex];

                var cboFrom = dataitem.findElement("cboRadPerson");
                var cboTo;
                             
                for (i = parseInt(moFrom) + 1 ; i < 12; i++) {
                    cboTo = dataitem.findElement("cboRadPerson" + i);
                    cboTo.findItemByValue(cboFrom.get_value()).select();
                }            
            }

                  <telerik:RadGrid ID="gvLINE_ITEM" runat="server" Skin="Office2010Silver" ViewStateMode="Enabled"
                      DataSourceID="dsLINE_ITEM"  EnableViewState="true"
                      AllowSorting="True" AllowAutomaticDeletes="True" AllowAutomaticUpdates="False"
                      AllowPaging="false"  AllowAutomaticInserts="false" 
                      Height="670px" ShowFooter="True"
                      RenderMode="Lightweight" CssClass="DDGridView"
                      HeaderStyle-CssClass="th" 
                      EnableHeaderContextMenu="true" >
                        <ClientSettings ReorderColumnsOnClient="True" AllowDragToGroup="True" 
                            AllowColumnsReorder="True" EnableRowHoverStyle="true" AllowKeyboardNavigation="true" >
                           <Scrolling AllowScroll="True" UseStaticHeaders="true" />
          <Selecting AllowRowSelect="True" />
          <Resizing AllowRowResize="True" AllowColumnResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="False" />         
                           <ClientEvents OnRowSelected="RowSelected" OnBatchEditSetEditorValue="BatchEditSetEditorValue" />               
                        </ClientSettings>
           <GroupingSettings ShowUnGroupButton="true" />                  
                        <MasterTableView CommandItemDisplay="Top" 
                            DataKeyNames="LINE_ITEM_ID"  
                            ClientDataKeyNames="LINE_ITEM_ID,PERSON_ID_01,PERSON_ID_02,PERSON_ID_03,PERSON_ID_04,PERSON_ID_05,PERSON_ID_06,PERSON_ID_07,PERSON_ID_08,PERSON_ID_09,PERSON_ID_10,PERSON_ID_11,PERSON_ID_12"
                            DataSourceID="dsLINE_ITEM" HorizontalAlign="NotSet" EditMode="Batch" AllowMultiColumnSorting="true"  
                            AutoGenerateColumns="False" > 
                            <BatchEditingSettings EditType="ROW"  />
                            <CommandItemSettings ShowAddNewRecordButton="true" ShowSaveChangesButton="true" ShowCancelChangesButton="true" ShowRefreshButton="false" ShowExportToExcelButton="false" />

                               <telerik:GridTemplateColumn ItemStyle-CssClass="td1"  SortExpression="PERSON.NAME" HeaderText="Jan" HeaderStyle-Width="135px"  
                                   DataType="System.String"
                                   DataField="PERSON_ID_01" UniqueName="PERSON_NAME" ColumnGroupName="colGroup1" >
                                    <ItemTemplate>     
                                        <asp:LABEL ID="lblPERSON" runat="server" ToolTip='<%# Eval("PERSON_ID_01") %>'
                                            Text='<%# If(String.IsNullOrEmpty(Eval("PERSON.NAME")), "", If(Eval("PERSON.EXPENSE_LINE_TYPE_ID").ToString() = "1", Eval("PERSON.NAME") & " (e)", Eval("PERSON.NAME") & " (c)")) %>' />
                                    </ItemTemplate>
                                    <EditItemTemplate>
                                        <telerik:RadComboBox ID="cboRadPerson" runat="server" DataValueField="PERSON_ID" DataTextField="NAME" DataSourceID="dsPERSON_01" CssClass="DDDropDownList" />     
                                        <Button name="btnCopyPerson01" value="01" type="button"  onclick="CopyPerson();">
                                            Copy<img src='../img3/arrow right red16.jpg' alt="Copy Person" title="Copy selected value to the rest of year." ></Button>                                                                                                                                                                                                                
                                    </EditItemTemplate>                                 
                                </telerik:GridTemplateColumn> 
                                <telerik:GridTemplateColumn ItemStyle-CssClass="td1"  SortExpression="PERSON1.NAME" HeaderText="Feb" HeaderStyle-Width="135px" 
                                    DataField="PERSON_ID_02" UniqueName="PERSON1_NAME" ColumnGroupName="colGroup2" DataType="System.String" >
                                    <ItemTemplate>     
                                        <asp:LABEL ID="lblPERSON1" runat="server" Text='<%# If(String.IsNullOrEmpty(Eval("PERSON1.NAME")), "", If(Eval("PERSON1.EXPENSE_LINE_TYPE_ID").ToString() = "1", Eval("PERSON1.NAME") & " (e)", Eval("PERSON1.NAME") & " (c)")) %>' />
                                    </ItemTemplate>
                                    <EditItemTemplate>
                                         <telerik:RadComboBox ID="cboRadPerson1" runat="server" RenderMode="Lightweight" DataValueField="PERSON_ID" DataTextField="NAME" DataSourceID="dsPERSON_02" CssClass="DDDropDownList" />   
                                    </EditItemTemplate>                                 
                                </telerik:GridTemplateColumn>
                            </Columns>
                            
                        </MasterTableView>                  
                  </telerik:RadGrid>

     

  2. Peter Milchev
    Admin
    Peter Milchev avatar
    136 posts

    Posted 28 Jul Link to this post

    Hello,

    The expected behavior of the .findElement() is to return the DOM element, in your case the div element. In order to get the ComboBox control you should use the .findControl() method. Then you could easily get and set the selected value of the ComboBox:
     
    var cb = dataitem.findControl("RadComboBox1");
    var selectedValue = cb.get_selectedItem().get_value();
      
    var cb2 = dataitem.findControl("RadComboBox2");
    var itemToSelect = cb.findItemByValue(selectedValue);
    itemToSelect.select();

    The RadComboBox Client-side Programming section could be used for further reference.

    Regards,
    Peter Milchev
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top