RadInputManager textbox ReadOnlyCssClass is not applied

5 posts, 0 answers
  1. Tadas
    Tadas avatar
    8 posts
    Member since:
    Jun 2010

    Posted 26 Aug 2011 Link to this post

    Hi,

    I have an issue with RadInputManager TextBoxSetting. I have specified ReadOnlyCssClass but readonly textbox is still with default css:
    <telerik:TextBoxSetting  ErrorMessage="Required..." Validation-IsRequired="true"
     ReadOnlyCssClass="DisabledControl" >
        <TargetControls>
        <telerik:TargetInput ControlID="txtYearBuilt" />
        <telerik:TargetInput ControlID="txtModel" />
        </TargetControls>
         
    <Validation IsRequired="True"></Validation>
     
        </telerik:TextBoxSetting>

    I'm in dotnetnuke environment and DisabledControl class is in module.css I'm changing textbox to readonly on pageload

    Can you help me with this?
  2.
  3. Vasil
    Admin
    Vasil avatar
    1641 posts

    Posted 01 Sep 2011 Link to this post

    Hi Tadas,

    I tried this code.
    Aspx:
    <telerik:RadInputManager ID="RadInputManager2" runat="server">
      <telerik:TextBoxSetting ErrorMessage="Required..." Validation-IsRequired="true" ReadOnlyCssClass="DisabledControl">
        <TargetControls>
          <telerik:TargetInput ControlID="TextBox1" />
        </TargetControls>
        <Validation IsRequired="True"></Validation>
      </telerik:TextBoxSetting>
    </telerik:RadInputManager>
    <asp:TextBox runat="server" ID="TextBox1"></asp:TextBox>
    C#:
    protected void Page_Load(object sender, EventArgs e)
    {
        TextBox1.ReadOnly = true;
    }


    And the rendered HTML was:
    <input name="TextBox1" type="text" readonly="readonly" id="TextBox1" class="RadInputMgr RadInputMgr_Default RadInput_Read_Default DisabledControl" onmouseover="javascript:$radIE.mouseOver(event);" onmouseout="javascript:$radIE.mouseOut(event);" onkeypress="javascript:$radIE.keyPress(event);" onblur="javascript:$radIE.blur(event);" onfocus="javascript:$radIE.focus(event);" />

    Can you confirm that your text box is set to read only? What is your rendered HTML?

    Regards,
    Vasil
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  5. Patrick
    Patrick avatar
    29 posts
    Member since:
    May 2011

    Posted 15 Dec 2011 Link to this post

    I am having the same issue.
    I set the ReadOnlyStyle CssClass to "ReadonOnlyStyle" a Style I set in my CSS file as.
     
    .ReadOnlyStyle
    {
    background-color:#AABBCC;
    }
    I set the RadTextBox to ReadOnly.

    Below is the rendered HTML.

    <input value=" " type="text" size="20" 
        id="ctl00_ContentPlaceHolder1_lvPeakLoadInfo_ctrl0_PeakLoadInfo1_tbLastUpdatedBy_text" 
      name    ="ctl00_ContentPlaceHolder1_lvPeakLoadInfo_ctrl0_PeakLoadInfo1_tbLastUpdatedBy_text" 
      class    ="riTextBox riRead ReadOnlyStyle" readonly="readonly" style="width:125px;"
    />

    And the background color does not change.
    If i explicitly set the BackColor Property of the RadTextBoxes ReadOnlyStyle it works just fine, but not when i reference it via the CssClass Property. (And the CSS file is registered with the page and other styles are working just fine)
    What am I doing wrong?

    Also, is it possible to set this value in the webconfig so that it applies to all RadTextBox.ReadOnlyStyles?

    Thanks,
    ~Patrick
  7. Vasil
    Admin
    Vasil avatar
    1641 posts

    Posted 16 Dec 2011 Link to this post

    Hi Patrick,

    As you see the rendered input element has right class.
    <input value=" " type="text" size="20"   id="ctl00_ContentPlaceHolder1_lvPeakLoadInfo_ctrl0_PeakLoadInfo1_tbLastUpdatedBy_text"   name="ctl00_ContentPlaceHolder1_lvPeakLoadInfo_ctrl0_PeakLoadInfo1_tbLastUpdatedBy_text"   class="riTextBox riRead ReadOnlyStyle" readonly="readonly" style="width:125px;" />

    You just need to use higher specificity for your CSS rule like:
    html body div .RadInput_Vista .riTextBox .ReadOnlyStyle {
        background-color:#AABBCC;
    }
    Note that "RadInput_Vista" will vary depending on your skin, could be "RadInput_Default" for example.

    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
  9. Patrick
    Patrick avatar
    29 posts
    Member since:
    May 2011

    Posted 19 Dec 2011 Link to this post

    Hi,
     That didn't quite work, but it pointed me in the right direction.
     Instead of:

    html body div .RadInput_Vista .riTextBox .ReadOnlyStyle {
        background-color:#AABBCC;
    }

    I had to remove the .riTextBox for:

    html body div .RadInput_Vista .ReadOnlyStyle {
        background-color:#AABBCC;
    }

    Thanks,
    ~Patrick
Back to Top