Regarding Rad Combo box is not updated in FF 4.0

[Raj]

Hi,

I have  come across one issue in firefox 4.0. I have a page with two telerik rad combo boxes. Based on the value selected on the first combo box, second combo value will be loaded. In this scenario, on selecting the first combo box value, the second combo box is not loading due to ajax problem occured with FF 4.0. It is working fine in IE 7.0 and safari browsers.. But only in new version of FF 4.0 is not working. Its showing error as "dropdownplaceholder is null".

Kindly check with this issue in FF 4.0 and let us know. Appreciated if you give a solution for this.

[Helen]

Hello Raj,

Could you please open a support ticket and send us a sample project which demonstrates the issue to examine it locally?

Otherwise we are not exactly sure where the issue might be.

Regards,
Helen
the Telerik team

[Ingo Oltmann]

Hi,

I have exactly the same issue. Every other browser is working but FF 4 does not work anymore. The dependent combobox is updated with data though it is not possible to open it.

In the console I get two messages:
this.DropDownPlaceholder is null

and 

U.getElementsByTagName is not a function



Regards,
Ingo

[D444n]

Unfortunately I don't have time to submit a support ticket with sample project, but I can confirm this is an issue with FF4. I can also (hopefully) point you in the right direction in terms of what needs looking at ...

Running the same code in FF3.6 and FF4, FF3.6 works fine, while FF4 does not, throwing the error "this.dropdownplaceholder is null".

To be precise, I'm using the RadComboBox inside a RadAjaxPanel. On first load, everything works fine, however when the AjaxPanel posts back, the HTML it returns for the RadComboBox is not valid and therein lies the problem. It's missing the entire "DropDownPlaceholder" div that would normally contain each combo box item as a separate div. This IS present in FF3.6, but for some reason it's not being rendered in FF4. So the issue is not with FF4 directly, rather that for some reason the RadComboBox is failing to render that all important div for FF4.

I would expect that if you place a RadComboBox inside a RadAjaxPanel and run it in FF4, you will find the issue immediately.

Hope that helps and that you can find a workaround ...

[Helen]

Hi all,

I just tried the code below under FF4.0 and the RadComboBox worked without any errors:

//aspx:

<telerik:RadAjaxPanel ID="CallbackPanel1" runat="server" Height="228px" Width="257px">
<telerik:RadComboBox ID="RadComboBox1" runat="server" Autopostback="True"
     Width="229px" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged1">
    </telerik:RadComboBox>
    <asp:Label ID="Label1" runat="server"></asp:Label>
    <asp:Button ID="Button1" runat="server" Text="Add Item" OnClick="Button1_Click"/>
    <asp:Button ID="Button2" runat="server" Text="Remove Last Item" OnClick="Button2_Click" />
</telerik:RadAjaxPanel>

//cs:

protected void Button1_Click(object sender, EventArgs e)
    {
        RadComboBoxItem item = new RadComboBoxItem("ComboItem" + (RadComboBox1.Items.Count));
        RadComboBox1.Items.Add(item);
        Label1.Text = item.Text + " added.";
        RadComboBox1.SelectedIndex = RadComboBox1.Items.Count - 1;
    }

    protected void Button2_Click(object sender, EventArgs e)
    {
        if (RadComboBox1.Items.Count > 0)
        {
            int index = RadComboBox1.Items.Count - 1;
            RadComboBoxItem item = RadComboBox1.Items[index];
            RadComboBox1.Items.Remove(index);
            Label1.Text = item.Text + " removed.";
            RadComboBox1.SelectedIndex = RadComboBox1.Items.Count - 1;
        }
    }
    protected void RadComboBox1_SelectedIndexChanged1(object o, RadComboBoxSelectedIndexChangedEventArgs e)
    {
        Label1.Text = RadComboBox1.SelectedItem.Text + " selected.";
    }

What are we missing?

Regards,
Helen
the Telerik team

[D444n]

Hi Helen,

Thanks very much for your reply. I've run your code on my own system and I can confirm it works fine for me too. Using it as a starting point, I've played around with in an attempt to break it and in doing so I've found that the culprit is the AjaxLoadingPanel. Adding the following immediately after the RadAjaxPanel close tag should be enough for you to see the problem everyone is describing:

<telerik:AjaxLoadingPanel ID="LoadingPanel1" runat="server">
     Loading ...
</telerik:AjaxLoadingPanel>

With this in place, click the "Add Item" button and you'll see that you now won't be able to get the combo to dropdown. Furthermore if you look at the error console, you'll see the JS error that we've all mentioned. For some reason the presence of the AjaxLoadingPanel is causing the HTML for the dropdown to not be rendered correctly as I described in my first post.

Let me know if I can provide anything else of use and thanks again for taking the time to look into this.

Dan

[Ingo Oltmann]

Hi,

I just made a sample. Obviously I need to open a new ticket to submit the project. Dan, I will update you when there is a solution.

Regards,
Ingo

[D444n]

That's great, thanks. Will wait to hear from you.

[Ingo Oltmann]

Dan,

here is a screencast to show the misbehaviour I am facing:

http://www.screencast.com/users/ingo.o/folders/Jing/media/51ce306c-86a9-41be-8db8-8c990f724aaa

Regards,
Ingo

[D444n]

Great, I'm sure that will help them. That's exactly what I'm seeing too, but just to re-iterate you don't NEED the second combo to get the error: having the AjaxLoadingPanel looks like enough to break it (or at least that's what I've found here anyway).

Let me know when you hear anything ... really need a fix!

[Simon]

Hello D444n,

I tested the following code, which worked fine on my side, i.e. the drop down of the ComboBox opened:

<rad:RadAjaxPanel ID="CallbackPanel1" runat="server" Height="228px" Width="257px">
    <rad:RadComboBox ID="RadComboBox3" runat="server" Autopostback="True"
         Width="229px" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged1">
    </rad:RadComboBox>
    <asp:Label ID="Label1" runat="server"></asp:Label>
    <asp:Button ID="Button1" runat="server" Text="Add Item" OnClick="Button1_Click"/>
    <asp:Button ID="Button2" runat="server" Text="Remove Last Item" OnClick="Button2_Click" />
</rad:RadAjaxPanel>
<rad:AjaxLoadingPanel ID="LoadingPanel1" runat="server">
     Loading ...
</rad:AjaxLoadingPanel>

Am I missing something?

Additionally, just to let you know, we have discontinued any maintenance & support for the Classic RadControls as stated here.

Best wishes,
Simon
the Telerik team

[Ingo Oltmann]

Simon,

can you create your sample using AjaxManger as well? Our application is much to complex so we cannot switch to AjaxPanel.
I Still get:
_4f is null
&
this.DropDownPlaceholder is null
By the way, I always try to deliver more than expected, hopefully you do also.

Regards,
Ingo

[Simon]

Hello Ingo,

Yes, I managed to reproduce the problem with RadAjaxManager as well. I am sending you the patched version of RadAjaxNamespace.js that fixes the problem in Firefox 4. You need to modify your page in this way to use the patched version:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <script type="text/javascript" src="RadControls/Ajax/Scripts/1_8_8/RadAjaxNamespace.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <rad:RadAjaxManager ID="RadAjaxManager1" runat="server" RadControlsDir="RadControls" UseEmbeddedScripts="false">
            <AjaxSettings>
                <rad:AjaxSetting AjaxControlID="Button1_Click">
                    <UpdatedControls>
                        <rad:AjaxUpdatedControl ControlID="RadComboBox3" LoadingPanelID="LoadingPanel1" />
                    </UpdatedControls>
                </rad:AjaxSetting>
                <rad:AjaxSetting AjaxControlID="Button2_Click">
                    <UpdatedControls>
                        <rad:AjaxUpdatedControl ControlID="RadComboBox3" LoadingPanelID="LoadingPanel1" />
                    </UpdatedControls>
                </rad:AjaxSetting>
            </AjaxSettings>
        </rad:RadAjaxManager>

        <rad:RadComboBox ID="RadComboBox3" runat="server" Autopostback="True"
             Width="229px" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged1">
        </rad:RadComboBox>

        <asp:Label ID="Label1" runat="server"></asp:Label>
        <asp:Button ID="Button1" runat="server" Text="Add Item" OnClick="Button1_Click"/>
        <asp:Button ID="Button2" runat="server" Text="Remove Last Item" OnClick="Button2_Click" />

        <rad:AjaxLoadingPanel ID="LoadingPanel1" runat="server">
             Loading ...
        </rad:AjaxLoadingPanel>
    </div>
    </form>
</body>
</html>

I hope this helps.

Best wishes,
Simon
the Telerik team

[Ryan Grossman]

Can you attach a full example where this is working? I tried replacing the namespace file to fix the FF 4.0 issues and I get error script is undefined on line 1993 bolded below

        function extractInlineScripts(element) {
            var scripts = element.getElementsByTagName("script");
            var inlineScripts = [];


            for (var i = 0, len = scripts.length; i < len; i++) {
                var script = scripts[i];
                if (script.type && script.type.toLowerCase() == "text/javascript" && script.src == "") {
                    inlineScripts[inlineScripts.length] = script;
                    script.parentNode.removeChild(script);
                }
            }


            return inlineScripts;
        }

[Simon]

Hi Ryan,

Here is a working example of the patch. Please note that the sample has been tested with RadAjax v1.8.8.0. 

I hope this helps.

Kind regards,
Simon
the Telerik team

[GSBV]

Hi Simon,

We are using Rad Grids for our project and are facing a similar issue. (On row click of one grid, the other grid is updated) I applied the

 

 

UseEmbeddedScripts

="false"

 

 

in the RadAjaxManager. But I guess I need a different RadAjaxNamespace.js for Rad Grids.
Can you please provide us with a similar code for Rad Grids.

FYI, we understand that Classic Rad Controls are a bit out date now. (We use RadGrid.Net2.dll version 4.6.2.0 and RadAjax.Net2.dll version 1.7.2.0). We have already placed request for the new telerik controls. But we need this fixed urgently.
Let me know if you need details from the actual code/solution.
 Thanks in advance.

Regards,
hangelo

[Simon]

Hello SLB,

Yes, the RadControls Classic you are using are with one major version and a bit more behind the latest version and it is highly possible that the code is quite different.

On the other hand, we do not support the Classic controls any more, so please consider upgrading to RadControls for ASP.NET AJAX. The new suite does not have many of the problems the Classic controls have, so it is a good way to avoid such issues.

Regards,
Simon
the Telerik team