RadCombo with ajax and IE8

5 posts, 0 answers
  1. Marcin
    Marcin avatar
    193 posts
    Member since:
    Jan 2011

    Posted 02 Jun 2011 Link to this post

    Hi, I'm having strange issue, which I don't know how to resolve.
    I have 3 panels on my page: left, middle and right
    On left there are combo with filters (rad combo ones), ajaxified with following way:


    <telerik:RadAjaxManagerProxy ID="rAjaxManagerProxy" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="left">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="left" />
                    <telerik:AjaxUpdatedControl ControlID="middle" LoadingPanelID="ralMain" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="middle">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="middle" />
                    <telerik:AjaxUpdatedControl ControlID="right" LoadingPanelID="ralMain" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManagerProxy>
    Evewrything is working like a charm when I'm using firefox, chrome or IE 9. The problem starts with IE8. After search on left panel, everything is displayed but combo is loosing its items. It is not happening if I'm not using ajax. Without ajax everything is working exept it it is no ajaxified. I'm filling values from database on page_load:

    protected void Page_Load(object sender, EventArgs e)
            {
                if (this.IsPostBack)
                {
                    return;
                }
     
                this.rcbIndustry.DataSource = GetIndustries();
                this.rcbIndustry.DataBind();
                this.rcbIndustry.Items.Insert(0, new RadComboBoxItem());
             
                this.rcbCustomer.DataSource = GetCustomers();
                this.rcbCustomer.DataBind();
                this.rcbCustomer.Items.Insert(0, new RadComboBoxItem());
                
            }

    On the beginning I thought it is related to not filling value if this is postback, but removing this check not helping. It is really strange because all comboboxes on such page are stopping working on IE.

    I looked to the page code using F12 on IE 8, and it s look like whole section for drop down is such case is missing.
    Do you have any advice?

    I just notice that this happen on all my comboboxes with website. If there is any ajax request e.g. through the ajaxpanel, combobox dropdown disapears  in IE 8.

    I'm using version: 2011.1.413.40

    Update

    I think I know what it is: I'm having folloing peace of code i master page in head section:

    <!--[if !IE]>-->
        <link href="Non-IE_themes/Telerik_nonIE.css" rel="stylesheet" type="text/css" />
        <!--<![endif]-->
          <!--[if gte IE 9]>
        <link href="Non-IE_themes/Telerik_nonIE.css" rel="stylesheet" type="text/css" />
        <![endif]-->

    which contains following css:
    .RadComboBoxDropDown .rcbScroll
    {
        height: 100% !important;
        max-height: 300px;
    }

    When this is section is added it is causing problems on IE 8. (IE 7 compatibility is working). When removed IE 8 is working... but other browsers have issue related to this css fix. :(

    Update 2

    Even removing this sentense from css won't help. Problem is on master page conditional statement. Only removing from master page helps.
  2. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1268 posts

    Posted 07 Jun 2011 Link to this post

    Hi Marcin,

    As you have noticed the problem is related to the styles you are setting and especially this one:
    height: 100% !important;

    My suggestion is to remove the styles you are setting and use the MaxHeight property of the RadComboBox.

    I hope this would help you out.

    Kind regards,
    Dimitar Terziev
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. Marcin
    Marcin avatar
    193 posts
    Member since:
    Jan 2011

    Posted 07 Jun 2011 Link to this post

    Hi, The problem is not in CSS. It is in condition on MasterPage. even if css is empty but condition exists, the problem occurs. Only removing condition fixing this problem.
  4. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1268 posts

    Posted 15 Jun 2011 Link to this post

    Hello Marcin,

    In case the problem is in your condition then you are loading the non IE styles even when IE is used.

    Could you verify that this is the problem, since I'm quite confused how this condition would affect your style in other situation?

    Best wishes,
    Dimitar Terziev
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  5. Marcin
    Marcin avatar
    193 posts
    Member since:
    Jan 2011

    Posted 15 Jun 2011 Link to this post

    No, it is like explained before. I already fixed it by making css hacks not IE conditional html hacks.
    Explanation:
    I have empty css file.
    I'm loading it with condition in html file. After ajax update - all comboboxes on page are wrong in IE 8. No drop down appears.
    Removing condition from html - still everything is the same since css was empty - now everything is working fine in IE 8.

    Kind Regards
Back to Top