RadTextBox Resizing

12 posts, 0 answers
  1. Su
    Su avatar
    1 posts
    Member since:
    Aug 2012

    Posted 23 Mar 2012 Link to this post

    I have a RadTextBox control set up as

    <telerik:RadTextBox ID ="Test" runat="server"
          EmptyMessage="Please enter subject search text...">
    </telerik:RadTextBox>

    Width property  is not declared in the markup, The textbox is resizing properly using the javascript but the span wrapper class is always set to 160px width. It has caused us a few issues in our project.  Is there anyway to remove the inline-style width?

    We are using  Q1 2012 version.


    <span style="width: 160px;" id="ctl00_SearchPagePaneContent_txtSearchSubject_txtTextBox_wrapper"
     
        class="riSingle RadInput RadInput_Office2007">
     
     .
     
     .

    </span>


  2. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 28 Mar 2012 Link to this post

    Hi Su,

    I tested it here and the input remains 160 pixels wide. The input and the upper span both have the same width.
    Do  you use some additional custom styling? In which browser you are testing?

    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Chamin
    Chamin avatar
    10 posts
    Member since:
    Mar 2012

    Posted 22 May 2012 Link to this post

    I also have this issue when I create text box without giving value to Width property. But I try to set width value by CSS class. Actually I’m creating this text box by dynamically on run time as follows,

    NewControl = New RadTextBox With {.AutoPostBack = True, .CssClass = "txtbox"}

    CSS class,

    .txtbox
    {
       background: url("images/text-box-bg.png") no-repeat !important;
        width:193px !important;
        height:29px !important;
        padding-left:5px !important;
        font-size:14px !important;
        padding-top:0px !important;
        line-height:17px !important;
        border:0px !important;
        margin-bottom:7px !important;
         
         
    }

    But when I looked the page after rendered as follows,

    <span id="ctl00_MainContentPlaceHolder_incPanelBar_i2_i0_i2_incPanelBar-ZIP_wrapper" class="riSingle RadInput RadInput_Default" style="width: 160px;">
    <span id="ctl00_MainContentPlaceHolder_incPanelBar_i2_i0_i2_incPanelBar-ZIP_display" class="riDisplay" style="display:none;"></span>
    <input id="ctl00_MainContentPlaceHolder_incPanelBar_i2_i0_i2_incPanelBar-ZIP" class="riTextBox riEnabled txtbox" type="text" size="20" name="ctl00$MainContentPlaceHolder$incPanelBar$i2$i0$i2$incPanelBar-ZIP">
    <input id="ctl00_MainContentPlaceHolder_incPanelBar_i2_i0_i2_incPanelBar-ZIP_ClientState" type="hidden" name="ctl00_MainContentPlaceHolder_incPanelBar_i2_i0_i2_incPanelBar-ZIP_ClientState" autocomplete="off">
    </span>

    And also see some unwanted styles created on run time as follows,

    .riSingle, .riSingle .riTextBox, .riSingle .riContentWrapper, .riSingle .riDisplay {
        -moz-box-sizing: border-box;
    }

    Please guide us to eliminate these issues.







  5. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 24 May 2012 Link to this post

    Hi Chamin,

    As you can see the "txtbox" is correctly added in the Class of the visible input element.
    If you need to add class to the wrapper of the control, use the WrapperCssClass property. Additionally you may test your code with the Q2 2012 Beta and tell us if you have any troubles.

    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.
  6. Balakrishnan R
    Balakrishnan R avatar
    5 posts
    Member since:
    Jun 2012

    Posted 18 Jun 2012 Link to this post

    Hi,

    I have problem with RadTextBox - width property, while setting width it applies to outer span tag not actual input tag, problem raise when i dynamically insert span after the input tag,  generated code RadControls for ASP.NET AJAX Q2 2012

    <span style="width: 350px;" class="riSingle RadInput RadInput_Grey" id="ctl00_ctl00_ctl00_cphHeader_cphApps_cphContent_uctrlRecordCreation_rtxtTitle_wrapper">
    <
    input type="text" class="riTextBox riEnabled" maxlength="80" size="20" name="ctl00$ctl00$ctl00$cphHeader$cphApps$cphContent$uctrlRecordCreation$rtxtTitle" id="ctl00_ctl00_ctl00_cphHeader_cphApps_cphContent_uctrlRecordCreation_rtxtTitle" style="padding-left: 5px;">
    <
    span title="Remaining letters 80" class="counter">80</span>
    <
    input type="hidden" name="ctl00_ctl00_ctl00_cphHeader_cphApps_cphContent_uctrlRecordCreation_rtxtTitle_ClientState" id="ctl00_ctl00_ctl00_cphHeader_cphApps_cphContent_uctrlRecordCreation_rtxtTitle_ClientState" autocomplete="off" value="{"enabled":true,"emptyMessage":"","validationText":"","valueAsString":""}">
    </
    span>

    <
    span style="display:none;" class="errorDot" id="cphHeader_cphApps_cphContent_uctrlRecordCreation_RequiredFieldValidator1">* Required </span>
    the problem not with previous release. generated code
    <span style="white-space: nowrap;" class="RadInput RadInput_Grey" id="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle_wrapper">
    <
    input type="text" style="width: 350px; padding-left: 5px;" class="riTextBox riEnabled" name="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle_text" id="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle_text" size="20" maxlength="80">
    <
    span title="Remaining letters 80" class="counter">[80]</span>
    <
    input type="text" value="" style="visibility:hidden;margin:-18px 0 0 -1px;width:1px;height:1px;overflow:hidden;border:0;padding:0;" title="" class="rdfd_" name="ctl00$ctl00$ctl00$cphLogo$cphMenu$cpContent$rtxtTitle" id="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle"><input type="hidden" name="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle_ClientState" id="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_rtxtTitle_ClientState" autocomplete="off"></span>
    <span style="color:Red;visibility:hidden;" id="ctl00_ctl00_ctl00_cphLogo_cphMenu_cpContent_RequiredFieldValidator1">* Required </span>

    how can i  remove inline style applied to outer span & apply it to input tag
  7. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 18 Jun 2012 Link to this post

    Hello Balakrishnan,

    This behaviour was changed previously in Q1 2012, because we get a lot of request about unifying width of the controls. So the width is applied to the wrapper now. This was firstly enabled in EnableSingleInputRendering only and later in both modes.

    For a solution you can style your inputs with CSS instead of placing 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.
  8. Balakrishnan R
    Balakrishnan R avatar
    5 posts
    Member since:
    Jun 2012

    Posted 18 Jun 2012 Link to this post

    Thanks Vasil, I will try
  9. Balakrishnan R
    Balakrishnan R avatar
    5 posts
    Member since:
    Jun 2012

    Posted 21 Jun 2012 Link to this post

    Hi Vasil,

    I have faced another problem with RadTextBox, used jquery to get RadTextBox value in client side like

    var $textbox = $("<%= RadTextBox1.ClientID %>_text");
    var result = $textbox.val()

     it was working with previous version, but now  it is not working .
  10. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 21 Jun 2012 Link to this post

    Hello,

    Use it like:

    var $textbox = $("<%= RadTextBox1.ClientID %>");

    Just remove the "_text"

    Regards,
    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.
  11. Balakrishnan R
    Balakrishnan R avatar
    5 posts
    Member since:
    Jun 2012

    Posted 21 Jun 2012 Link to this post

    Hi,
    But without _text previous version will not work.
    have to update for new version Only ?
  12. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 21 Jun 2012 Link to this post

    Hi Balakrishnan,

    Yes in Q2 2012 the visible input HTML element always have the same ID as the ClientID of the RadInputControl.

    In Q3 2011 and older, you have to use "_text" to access the visible input element.
    In Q1 2012, you have to use the client ID without suffix in case EnableSingleInputRendering="true" (by default), or to add "_text" suffix if EnableSingleInputRendering="false".
    In Q2 2012 and later in both rendering modes there is only one visible input.

    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.
  13. Balakrishnan R
    Balakrishnan R avatar
    5 posts
    Member since:
    Jun 2012

    Posted 21 Jun 2012 Link to this post

    Thanks vasil.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017