Ext.net script error in IE8 that doesn't occur in other browsers (including IE9)

I use ext.net controls in ASP.NET WebForms application.

It works fine in Chrome 13-14, Opera 11, FF 6 but not in IE8.

It throws JavaScript errors such as:

Invalid argument

And:

BaseMainContent_MainContent_ctlContent_txtFax_txtCountryCode' is undefined

If it's enough information, how can I resolve it?

A code example

<div>
    <ext:TextField runat="server" MsgTarget="Side" ID="LoginTxt" IsRemoteValidation="true">
        <RemoteValidation OnValidation="ValidateLogin" ShowBusy="true" />
    </ext:TextField>
</div>
<br />
<div>
    <div>
        <ext:TextField ID="PasswordTxt1" runat="server" InputType="Password"></ext:TextField>
        <ext:TextField runat="server" ID="PasswordTxt2" Vtype="password" FieldLabel="Повторите пароль"
            InputType="Password" MsgTarget="Side" IsRemoteValidation="true">
            <RemoteValidation OnValidation="ValidatePasswords" ShowBusy="true" />
        </ext:TextField>
    </div>
</div>
<div>
    <ext:ComboBox Width="200"  runat="server" ID="LocaleCmb" Editable="false"
        SelectedIndex="0">
        <Items>
            <ext:ListItem Text="Русский" Value="ru-RU" />
            <ext:ListItem Text="English" Value="en-US" />
        </Items>
    </ext:ComboBox>
</div>
<div>
    <ext:TextField runat="server"  ID="LastNameTxt" />
</div>

<ext:TextField runat="server" ID="EmailTxt" MsgTarget="Side" FieldLabel="Email" Vtype="email"
    IsRemoteValidation="true">
    <RemoteValidation OnValidation="ValidateEmail" ShowBusy="true" />
</ext:TextField>
<div>
    <uc:PhoneTextBox2 ID="PhoneUc" runat="server"/>
</div>

<div>
    <uc:PhoneTextBox2 ID="FaxUc" runat="server"  />
</div>
<br />

<div>
    <uc:Address2 Title="Адрес" ID="AddressUc" CoordinatesVisible="false" runat="server" />
</div>
<div>

    <div id="RecaptchaDiv" runat="server" class="x-form-invalid-icon" style="left: 350px; top: 0px;
        position: relative; visibility: visible;">
    </div>
    <recaptcha:RecaptchaControl ID="Recaptcha" runat="server" />
</div>


<ext:Button runat="server" ID="SubmitTxt" Text="Register me">
    <DirectEvents>
        <Click OnEvent="SubmitBtnClick">
            <EventMask ShowMask="true"></EventMask>
        </Click>
    </DirectEvents>
</ext:Button>
<uc:BackLinkButton ID="lnkPreviousPage" runat="server" />

In this case the error is

SCRIPT87: Invalid argument. 
ext.axd?v=21945, line 7 character 31283

UPDATE: a screenshot

UPDATE2: I forgot to say I works good in IE9. Here is the source of the uc:PhoneTextBox2

<style>
    .invalidPhoneBox
    {
        border-color: #C30;
        background: url('/extjs/resources/images/default/grid/invalid_line-gif/ext.axd') repeat-x scroll center bottom white;
    }
</style>
<ext:CompositeField runat="server" ID="eCompositeField" CombineErrors="false" AutoWidth="true"
    MsgTarget="Title">
    <Items>
        <ext:DisplayField runat="server" Text="(" />
        <ext:NumberField ID="txtCountryCode" Width="29" AllowNegative="false" AllowDecimals="false"
            MaxLength="3" runat="server" />
        <ext:DisplayField runat="server" Text=")" />
        <ext:NumberField runat="server" ID="txtCityCode" Width="58" AllowNegative="false" AllowDecimals="false"
            MaxLength="7" />
        <ext:TextField runat="server" ID="txtMainPhoneNumber" Width="60" MaxLength="7" AllowNegative="false"
            AllowDecimals="false" />
        <ext:TextField runat="server" ID="txtExtraPhoneNumber" Width="44" AllowBlank="false" MaxLength="5"
            AllowNegative="false" AllowDecimals="false" MsgTarget="Side" />
    </Items>
</ext:CompositeField>

code behind

public partial class PhoneTextBox2 : System.Web.UI.UserControl {

    public bool EnableEmptyValues { get; set; }
    public string Title { get; set; }
    protected void Page_Init(object sender, EventArgs e) {
        txtCountryCode.AllowBlank = EnableEmptyValues;
        txtCityCode.AllowBlank = EnableEmptyValues;
        txtMainPhoneNumber.AllowBlank = EnableEmptyValues;

    }

    protected void Page_Load(object sender, EventArgs e) {
        if (!IsPostBack) {
            eCompositeField.FieldLabel = Title;
            // eCompositeField.LabelWidth = Title.Length*5;
            if (!string.IsNullOrWhiteSpace(DataSource)) {

                string[] phoneNumberArray = DataSource.Split('-');
                if (phoneNumberArray.Length >= _standartDimension) {
                    txtCountryCode.Text = phoneNumberArray[0];
                    if (txtCountryCode.Text[0] == _plus) {
                        txtCountryCode.Text = txtCountryCode.Text.Remove(0, 1);
                    }
                    txtCityCode.Text = phoneNumberArray[1];
                    txtMainPhoneNumber.Text = phoneNumberArray[2];
                    if (phoneNumberArray.Length >= _extraDimension) {
                        txtExtraPhoneNumber.Text = phoneNumberArray[3];
                    }
                }
            }
        }
    }



    public string DataSource { get; set; }


    private const string _phoneNumberMask = "+{0}-{1}-{2}-{3}";
    private const char _plus = '+';
    private const int _standartDimension = 3;
    private const int _extraDimension = 4;


    public string Number {
        get {
            if (!string.IsNullOrWhiteSpace(txtCountryCode开发者_如何学运维.Text) &&
                !string.IsNullOrWhiteSpace(txtCityCode.Text) &&
                !string.IsNullOrWhiteSpace(txtMainPhoneNumber.Text)) {


                if (!string.IsNullOrWhiteSpace(txtExtraPhoneNumber.Text))
                    return string.Format(_phoneNumberMask, txtCountryCode.Text, txtCityCode.Text, txtMainPhoneNumber.Text, txtExtraPhoneNumber.Text);

                string phoneNumber = string.Format(_phoneNumberMask, txtCountryCode.Text, txtCityCode.Text, txtMainPhoneNumber.Text, string.Empty);
                return phoneNumber.Remove(phoneNumber.Length - 1);

            }
            return string.Empty;
        }
    }





    public bool IsEmpty {
        get {
            return (string.IsNullOrWhiteSpace(txtCountryCode.Text) &&
                    string.IsNullOrWhiteSpace(txtCityCode.Text) &&
                    string.IsNullOrWhiteSpace(txtMainPhoneNumber.Text) &&
                    string.IsNullOrWhiteSpace(txtMainPhoneNumber.Text));
        }
    }




    /// <summary>
    /// Validate 
    /// </summary>
    public void Validate() {
        if (EnableEmptyValues) {
            if (!IsEmpty && Number == string.Empty)
                MarkInvalid();
            else
                MarkValid();
        }



        else {

            if (IsEmpty)
                MarkInvalid();
            else {

                if (Number == string.Empty)
                    MarkInvalid();
                else
                    MarkValid();
            }
        }
    }

    private const string InvalidFormatNumberMessage = "InvalidFormatNumberMessage";
    private const string EmptyNumberMessage = "EmptyNumberMessage";


    private const string InvalidCls = "invalidPhoneBox";
    public void MarkInvalid(string msg = null) {
       // eCompositeField.AddLabelCls(InvalidCls);
        txtCountryCode.MarkInvalid(msg);
        txtCityCode.MarkInvalid(msg);
        txtMainPhoneNumber.MarkInvalid(msg);
        txtExtraPhoneNumber.MarkInvalid(msg);

    }

    public void MarkValid() {
        //eCompositeField.RemoveLabelCls(InvalidCls);

        //eCompositeField.MarkAsValid();
        txtCountryCode.MarkAsValid();
        txtCityCode.MarkAsValid();
        txtMainPhoneNumber.MarkAsValid();
        txtExtraPhoneNumber.MarkAsValid();
    }


    public const string InvalidCheckBoxCssStyle = "border-color:#C30; background:  url('/extjs/resources/images/default/grid/invalid_line-gif/ext.axd') repeat-x scroll center bottom white; width: 40px !important;";
    public const string ValidCheckBoxCssStyle = "border-color:#000; background: none repeat scroll 0 0 transparent;";

}

I had this exact error and while I can't reproduce your case exactly I can hopefully give you a good idea on how to fix it. The problem is that somehow an invalid width is getting assigned to one of the controls on the page. This can happen because of some incorrect configuration in the markup, or possibly a bug of some sort in Ext.NET. To determine which control is at fault:

1. Load your page in IE8 and allow the built-in script debugger to halt execution at the point shown in your screenshot.
2. In the right hand section of the developer pane click the "Watch" tab button and add a watch for H. Expand the tree until you can see the ID property. This will give you the ClientID of the control causing the problem.
3. Locate the control in your .ascx markup and make sure that you've got the width configuration correct. The correct configuration may depend on the layout used for the parent container. Try diffent methods of setting the width to see if any resolve the issue.

Hopefully these steps can help you to narrow down the control causing the error and rectify it. In my case I had used AutoWidth="True". Changing to AnchorHorizontal="100%" fixed the problem.