insert item from the client side

2 posts, 0 answers
  1. Bassem
    Bassem avatar
    14 posts
    Member since:
    Jul 2012

    Posted 12 Apr 2014 Link to this post

    i am having an issue with radCombobx item inserted from the client side,two problem are occurring :

    i have a radGrid with client selecting when i select a row onRowSelected  client side function is fired and a combobox item is added to the combobox,the combobox have the checkboxes property set to true and EnableCheckAllItemsCheckBox="true"
    • first problem : when i click on check all items all the statically added items are checked but the new added one from the client side are not
    • second problem : i have added a server side oncheckedchanged function to radcombobox ,when i check a static item it fires the server side function but when i check the added one from the client side it does not fire the event

    can someone please explain why this behavior is occurring because i can't understand the problem :/ here is my code

      <telerik:RadComboBox ID="Country_dd"  EnableCheckAllItemsCheckBox="true"  runat="server"
                                  CheckBoxes="true"  AutoPostBack="true"  EnableLoadOnDemand="true"
                                  OnItemChecked="Country_dd_CheckedChanged" >
                                    <Items>
                                    <telerik:RadComboBoxItem Text="asd" />
                                    </Items>
                                </telerik:RadComboBox>
     
    <telerik:RadGrid ID="ServiceCountryGrid" runat="server" AllowSorting="true" OnNeedDataSource="ServiceCountryGrid_NeedDataSource"
                            SkinID="RadGridSkin" DataKeyNames="COUNTRY_ID" AllowMultiRowSelection="true"
                            ShowHeader="true" OnItemDataBound="Grid_ItemDataBound" >
                            <ClientSettings >
                                <ClientEvents OnRowSelected="Row_Selected" OnRowDeselected="Row_Selected" />
                                <Selecting UseClientSelectColumnOnly="true" AllowRowSelect="true"  />
                                <Scrolling AllowScroll="true" ScrollHeight="400px" />
                            </ClientSettings>
                            <MasterTableView AutoGenerateColumns="false" ShowHeadersWhenNoRecords="true">
                                <Columns>
                                    <telerik:GridClientSelectColumn HeaderTooltip="Allow All" UniqueName="SelectCountries"
                                        HeaderStyle-Width="100px" ItemStyle-Width="100px">
                                    </telerik:GridClientSelectColumn>
                                    <telerik:GridBoundColumn UniqueName="COUNTRY" HeaderText="<%$ Resources:Strings,Country %>"
                                        DataField="COUNTRY_NAME">
                                    </telerik:GridBoundColumn>
                                    <telerik:GridBoundColumn UniqueName="COUNTRY_ID" DataField="COUNTRY_ID" Display="false"></telerik:GridBoundColumn>
                                    <telerik:GridTemplateColumn HeaderText="<%$ Resources:Strings,Profile%>" UniqueName="GRDPROFILE">
                                        <ItemTemplate>
                                            <asp:DropDownList class="grdCountryProfiledd" ID="GrdProfile_dd" DropDownWidth="196"
                                                Enabled="false" runat="server" DataTextField="PROFILE_NAME" DataValueField="PROFILE_ID">
                                            </asp:DropDownList>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>

    javascript function :

    function Row_Selected(sender, eventArgs) {
               var ServiceCountryGrid = $find("<%= ServiceCountryGrid.ClientID %>");
                
               var selectedValue = $("#Profile_dd option:selected").val();
              
               var MasterTable = ServiceCountryGrid.get_masterTableView();
               var row = MasterTable.get_dataItems()[eventArgs.get_itemIndexHierarchical()];
               var GrdProfile_dd = $("#" + row.get_element().getElementsByTagName("select")[0].id);
     
               if (!row.get_selected()) {
                   GrdProfile_dd.attr("disabled", "disabled");
                   GrdProfile_dd.val(selectedValue);
                   var combo = $find("<%=Country_dd.ClientID %>");
                   combo.trackChanges();
                   combo.get_items().remove(combo.findItemByValue(row._element.cells[2].innerHTML));
                   
                   combo.commitChanges();       
               }
               else {
                   GrdProfile_dd.removeAttr("disabled");
                   var value = row._element.cells[2].innerHTML;
                   var text = row._element.cells[1].innerHTML;
                   var combo = $find("<%=Country_dd.ClientID %>");
                   var comboItem = new Telerik.Web.UI.RadComboBoxItem();
                   comboItem.set_text(text);
                   comboItem.set_value(value);
                   combo.trackChanges();
                   combo.get_items().add(comboItem);
                   
                   combo.commitChanges();       
                 
               }
           }

    please someone provide me a clear answer for this behavior
  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 15 Apr 2014 Link to this post

    Hello,

    We are not aware of such problem with the RadComboBox items added from the client-side. I am attaching a sample code that demonstrates very similar behavior. I would suggest calling the trackChanges client-side method of the RadComboBox and calling the commitChanges after the items are added on the client-side. This way you will make sure that those items are persisted between post-backs and no errors are thrown if you check one of those items.


    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top