Ajaxify Checkboxes in a Radcombobox

9 posts, 2 answers
  1. Stafan Müller
    Stafan Müller avatar
    8 posts
    Member since:
    Jan 2009

    Posted 27 Feb 2012 Link to this post

    Hi,

    I have a problem with ajaxifing 5 checkboxes in this RadComboBox.

    <telerik:RadAjaxPanel ID="RadAjaxPanel3" runat="server">
       <telerik:RadComboBox ID="RadComboBox2" Runat="server" AllowCustomText="True" EmptyMessage="Alle Lagen"
                   DataSourceID="XmlDataSource1" DataTextField="Text" DataValueField="Value" Width="230px" >
                   <ItemTemplate>
                               <div>
                                   <asp:CheckBox runat="server" ID="chk1" Checked="false" onclick="onCheckBoxClick(this)"
                                       AutoPostBack="True"
                                       oncheckedchanged="chk1_CheckedChanged" />
                                   <asp:Label runat="server" ID="Label1" AssociatedControlID="chk1">
                                       <%# Eval("Text") %>
                                   </asp:Label>
                               </div>
                           </ItemTemplate>
                   <CollapseAnimation Duration="200" Type="OutQuint"></CollapseAnimation>
               </telerik:RadComboBox>
               <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/combobox.xml">
               </asp:XmlDataSource>
       </telerik:RadAjaxPanel>

    This is the code behind to add the ajaxsettings to the RadAjaxManager:
    Protected Sub RadComboBox2_DataBound(sender As Object, e As System.EventArgs) Handles RadComboBox2.DataBound
     
            For Each item As RadComboBoxItem In RadComboBox2.Items
                Dim chk As CheckBox = DirectCast(item.FindControl("chk1"), CheckBox)
                Dim text As Label = DirectCast(item.FindControl("Label1"), Label)
                RadAjaxManager1.AjaxSettings.AddAjaxSetting(chk, GridView1, RadAjaxLoadingPanel1)
               
            Next
     
        End Sub

    When I click one of the checkboxes, the loading panel is visible for a short time, but the gridview1 isn't updating.
    When I click another checkbox, the request doesn't use ajax but loads the whole site. Also when I click another checkbox.
    Only the first "click" is ajaxifyed, but the gridview1 is not affected. 

    Here is the link to the ajaxifyed Page: http://pension.sundaymedia.info/einrichtungajax.aspx?Typ=Pension
    And here the same page with no ajaxsettings added: http://pension.sundaymedia.info/Einrichtung.aspx?Typ=Pension

    The left ComboBox is the Problem-Combo-Box

    Best regards from Germany,
    Stefan
  2.
  3. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 01 Mar 2012 Link to this post

    Hello,

    The problem you are facing is mostly caused by the RadAjaxPanel you are using. When RadAjaxManager is used you should not use RadAjaxPanel to Ajaxify the same controls.

    Try removing the RadAjaxPanel control and then add one additional setting to the RadAjaxManager control:

    Protected Sub RadComboBox2_DataBound(sender As Object, e As System.EventArgs) Handles RadComboBox2.DataBound
     
           For Each item As RadComboBoxItem In RadComboBox2.Items
               Dim chk As CheckBox = DirectCast(item.FindControl("chk1"), CheckBox)
               Dim text As Label = DirectCast(item.FindControl("Label1"), Label)
               RadAjaxManager1.AjaxSettings.AddAjaxSetting(chk, GridView1, RadAjaxLoadingPanel1)
               Dim comboBox = CType(sender, RadComboBox)
               RadAjaxManager1.AjaxSettings.AddAjaxSetting(chk, comboBox, RadAjaxLoadingPanel1)
     
           Next
     
       End Sub

    Then check whether the issue is resolved.
    Greetings,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Stafan Müller
    Stafan Müller avatar
    8 posts
    Member since:
    Jan 2009

    Posted 01 Mar 2012 Link to this post

    Hi Andrey,

    thanks for answering!

    I removed all RadAjaxPanels on the page, but the issue isn't resolved.

    The first call is via Ajax but with no effect on Gridview1.
    When I use the right ComboBox after this (RadCombobox1 for sorting), the grid view is affected.

    The second call for RadCombobox2 (the Problem-Combobox) doesn't use an Ajax callback, it loads the whole site instead.

    Would it help if I post the whole .aspx and aspx.vb content?

    Greetings,
    Stefan
  7. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 02 Mar 2012 Link to this post

    Hi,

    The problem with your project is that the DataBound event of the RadComboBox is too late to add the Ajax settings for the RadAjaxManager control. Try moving the settings to the PageLoad event and thus you will succeed.

    I have created sample project to illustrate this approach. Give the project a try and check what are the differences with your.

    All the best,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  9. Stafan Müller
    Stafan Müller avatar
    8 posts
    Member since:
    Jan 2009

    Posted 02 Mar 2012 Link to this post

    Hi Andrey,

    unfortunately there is no .aspx file in your sample project. (Screenshot 2012-03-02)

    I tried to add the ajaxsettings on page load at first. But on the first load of the page, the combobox.item.count is 0. No ajaxsettings will be added. (combobox load.jpg)

    After the first postback the items.count object of the combobox is 5 and the ajaxsettings are added correct. Then the AjaxManager works correct an the gridview is affected. (combobox load2.jpg)

    After the second postback, items.count is 0 again, after the third it is 5 again and so on...

    I uploaded the edited files, so you can see the behavior: http://pension.sundaymedia.info/Einrichtungajax.aspx?Typ=Pension

    But I think we we move one step closer to the solution
  11. Answer
    Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 05 Mar 2012 Link to this post

    Hello,

    Please, excuse me for the missing files. I have attached the project again with the missing files included. The better place to add the AjaxSettings is the ItemCreated event of RadComboBox. I have modified the project to illustrate this approach.

    Give the project a try and check whether this is the desired behavior.

    Kind regards,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  13. Stafan Müller
    Stafan Müller avatar
    8 posts
    Member since:
    Jan 2009

    Posted 07 Mar 2012 Link to this post

    Hi Andrey,

    it works!!!

    Thanks a lot...

    One question is left: How can I prevent my combobox from closing after clicking a Checkbox?

    Best regards,
    Stefan
  14.
  15. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 07 Mar 2012 Link to this post

    Hello Stafan,

    Attach the following client side code to close the dropdown only on clicking the Dropdown image.

    Javascript:
    function OnClientDropDownClosing(sender, args)
       {
           if (args.get_domEvent().target == sender.get_imageDomElement())
           {
               args.set_cancel(false);
           }
           else
           {
               args.set_cancel(true);
           }
       }

    Hope it helps.

    Thanks,
    Shinu.
  17. Stafan Müller
    Stafan Müller avatar
    8 posts
    Member since:
    Jan 2009

    Posted 07 Mar 2012 Link to this post

    Thanks Shinu, that's it!

    Greez,
    Stefan
Back to Top