RadInputManager textbox ReadOnlyCssClass is not applied

[Tadas]

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?

[Vasil]

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

[Patrick]

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

[Vasil]

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

[Patrick]

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