insert item from the client side

[Bassem]

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

[Boyan Dimitrov]

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