This is a migrated thread and some comments may be shown as answers.

Width are all 100% in input when upgraded to .NET 4.5

2 Answers 42 Views
Input
This is a migrated thread and some comments may be shown as answers.
wenbin
Top achievements
Rank 1
wenbin asked on 25 Nov 2012, 04:52 AM
For some reason, we have to upgrade our project's .net framework's version from 3.5 to 4.5. But the Telerik.Web.UI.dll in our project is still 2009.3.1314.35. And the bugs happened.

All inputs width are all 100% even if you set a width to them. For example you can see the html after the RadNumberTextBox rendered.

<table cellpadding="0" cellspacing="0" class="riTable" style="border-width:0;border-collapse:collapse;width:100%;">
        <tbody><tr>
            <td class="riCell" style="width:100%;white-space:nowrap;"><input type="text" value="1" id="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount_text" name="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount_text" class="riTextBox riEnabled" style="width: 100%;" maxlength="524288"><input style="visibility:hidden;float:right;margin:-18px 0 0 -1px;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount" class="rdfd_" value="1" type="text"><input style="visibility:hidden;float:right;margin:-18px 0 0 -1px;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount_Value" class="rdfd_" name="ctl01$ContentPlaceHolder1$ProductDetail1$rptGoods$ctl00$rntbAmount" value="1" type="text"></td><td class="riSpin"><a class="riUp" href="javascript:void(0)" id="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount_SpinUpButton"><span>Spin Up</span></a><a class="riDown" href="javascript:void(0)" id="ctl01_ContentPlaceHolder1_ProductDetail1_rptGoods_ctl00_rntbAmount_SpinDownButton"><span>Spin Down</span></a></td>
        </tr>
    </tbody></table>

As you see, there are some width:100% in code, But actually, I have set a width 80px to it.

I used reflector to see the code, and found this. I guess this bug is caused by the code "this.Browser.IsBrowser("Gecko")", can you help me fix that, And build a new dll for me, because I don't have the source code,
and it is hard for us to upgrade the telerik controls to a new version. Thanks.

protected override void RenderContents(HtmlTextWriter writer)
{
    if (this.isOnlyInputRendered())
    {
        this.RenderInputElements(writer);
    }
    else
    {
        writer.AddAttribute("cellpadding", "0");
        writer.AddAttribute("cellspacing", "0");
        writer.AddStyleAttribute(HtmlTextWriterStyle.BorderWidth, "0");
        writer.AddStyleAttribute(HtmlTextWriterStyle.BorderCollapse, "collapse");
        if ((base.DesignMode || !this.Browser.IsBrowser("Gecko")) || ((this.Browser.IsBrowser("Gecko") && !this.setWidth.IsEmpty) && (this.setWidth.Type == UnitType.Percentage)))
        {
            writer.AddStyleAttribute("width", "100%");
        }
        else
        {
            writer.AddStyleAttribute("width", this.setWidth.IsEmpty ? this.defaultWidth.ToString() : this.setWidth.ToString());
        }
        writer.AddAttribute(HtmlTextWriterAttribute.Class, "riTable");
        writer.RenderBeginTag(HtmlTextWriterTag.Table);
        writer.RenderBeginTag(HtmlTextWriterTag.Tr);
        if (this.Label != "")
        {
            writer.RenderBeginTag(HtmlTextWriterTag.Td);
            this.RenderLabel(writer, this.ClientID + "_text");
            writer.RenderEndTag();
        }
        if (this.ButtonsPosition == InputButtonsPosition.Left)
        {
            base.RenderContents(writer);
        }
        writer.AddAttribute("class", "riCell");
        writer.AddStyleAttribute(HtmlTextWriterStyle.Width, "100%");
        if (!base.DesignMode && !this.Browser.IsBrowser("Safari"))
        {
            writer.AddStyleAttribute("white-space", "nowrap");
        }
        if (!base.DesignMode && this.Browser.IsBrowser("Safari"))
        {
            writer.AddStyleAttribute("white-space", "normal");
        }
        writer.RenderBeginTag(HtmlTextWriterTag.Td);
        this.RenderInputElements(writer);
        writer.RenderEndTag();
        if (this.ButtonsPosition == InputButtonsPosition.Right)
        {
            base.RenderContents(writer);
        }
        writer.RenderEndTag();
        writer.RenderEndTag();
    }
}

2 Answers, 1 is accepted

Sort by
0
wenbin
Top achievements
Rank 1
answered on 26 Nov 2012, 06:31 AM
Is anyone here who can help me?
0
Vasil
Telerik team
answered on 26 Nov 2012, 12:14 PM
Hi wenbin,

Download the latest version of the controls, where this bug is fixed already. I am not sure what is your license, but if you have the code, you could fix it and recompile it.
Never the less this line
(this.Browser.IsBrowser("Gecko") && !this.setWidth.IsEmpty) && (this.setWidth.Type == UnitType.Percentage)
will be "true" only when the provided width is set in percentages. And if it is in pixels the 100% inline width will be not applied. Confirm that you set in your markup width in pixels like Width="80px" and not like Width="80".

Another option is to use CSS to apply the width. Set CssClass to your RadNumericTextBoxes and then style them by this class. Use the !important CSS rule to gain higher specificity than the inline styles.

Greetings,
Vasil
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.
Tags
Input
Asked by
wenbin
Top achievements
Rank 1
Answers by
wenbin
Top achievements
Rank 1
Vasil
Telerik team
Share this question
or