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

textbox disabled style not being aplpied in radgrid edit template

8 Answers 268 Views
FormDecorator
This is a migrated thread and some comments may be shown as answers.
James
Top achievements
Rank 1
James asked on 11 May 2015, 09:11 AM

Hi - I have used formdecorator to skin a site quickly. all is great, except disabled text boxes have the exact same style as a none disabled text box. I have used the telerik visual style builder to create a custom skin based on web20, and have applied this to the site.

 

i am not doing anything clever to disable the textboxes - they simply have their asp.net property enabled set to false. the text box is set to multiline and is inside a radgrid edit template.

 

the rendered ouput is as follows:

 

<tr>
<td><label for="ctl00_ContentPlaceHolder1_RadGrid1_ctl00_ctl05_notesTextBox">Completion Notes:</label></td><td id="ctl00_ContentPlaceHolder1_RadGrid1_ctl00_ctl05_EditCell__notes">
<textarea name="ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl05$notesTextBox" rows="4" cols="60" id="ctl00_ContentPlaceHolder1_RadGrid1_ctl00_ctl05_notesTextBox" disabled="disabled">
</textarea>
</td>
</tr>

 

the disabled stlye is not being applied to it - it looks identical to the enabled text box.

 

the style does seem to be applied if i have a disabled text box outside of the radgrid edit form though.

 

 

 

 

8 Answers, 1 is accepted

Sort by
0
Danail Vasilev
Telerik team
answered on 12 May 2015, 11:23 AM
Hi James,

I am not able to reproduce the mentioned issue. The code below renders like this - http://screencast.com/t/CWbRhNDcM

The disabled textarea is properly decorated when placed inside and outside of the grid.

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Skin="Web20" />
<textarea name="aaa" rows="4" cols="60" id="dd" runat="server" disabled="disabled">sdfsdfsdfs sdfsdf sdf sdf 222</textarea>
<telerik:RadGrid ID="RadGrid1" runat="server">
    <MasterTableView>
        <Columns>
            <telerik:GridEditCommandColumn></telerik:GridEditCommandColumn>
        </Columns>
        <EditFormSettings EditFormType="Template">
            <FormTemplate>
                <textarea name="aaa" rows="4" cols="60" id="dd" runat="server" disabled="disabled">sdfsdfsdfs sdfsdf sdf sdf 222</textarea>
            </FormTemplate>
        </EditFormSettings>
    </MasterTableView>
</telerik:RadGrid>

C#:
protected void Page_Load(object sender, EventArgs e)
{
    RadGrid1.DataSource = new int[] { 1, 2, 3 };
    RadGrid1.DataBind();
}


Regards,
Danail Vasilev
Telerik
 
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
James
Top achievements
Rank 1
answered on 12 May 2015, 02:46 PM

Hi Danail - you are right. it looks like it has not applied the style on mine sa there is no text in the box when it is disabled. with no text you cannot see any difference between the enabled and disabled text box!

 

I have already got a custom skin based on web20 - do you know which classes I need to change the make the disabled text boxes and text areas have a grey background to make it more obvious that they are disabled please.

 

thanks

 

james

 

0
Danail Vasilev
Telerik team
answered on 13 May 2015, 12:21 PM
Hi James,

You can use the styles below in order to change the background-color and opacity of a disabled and decorated textarea by the decorator.

<style>
    .RadForm.rfdTextarea textarea[disabled] {
        background-color: gray;
        opacity: 0.7 !important;
    }
</style>



Regards,
Danail Vasilev
Telerik
 
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
James
Top achievements
Rank 1
answered on 13 May 2015, 12:36 PM
thanks. is there a class to change the style of disabled drop downs as well?
0
James
Top achievements
Rank 1
answered on 13 May 2015, 12:36 PM
thanks. is ther ea calss to change the style of disabled drop downs as well?
0
James
Top achievements
Rank 1
answered on 13 May 2015, 12:55 PM
thanks. is there a class to change the style of disabled drop downs as well?
0
Danail Vasilev
Telerik team
answered on 14 May 2015, 08:32 AM
Hello James,

Generally the classic render mode of the formdecorator uses sprite images for styling selects. Therefore in order to change its appearance you should use new sprites.

You can, however, try the lightweight render mode where is used semantic HTML, in order to change the appearance of decorated selects with few lines of CSS:

CSS:

<style>
    .RadForm_Web20 .rfdSelect_Web20.rfdSelectDisabled,
    .RadForm_Web20 .rfdSelect_Web20.rfdSelectDisabled:hover,
    .RadForm_Web20 .rfdSelect_Web20.rfdSelectDisabled:active,
    .RadForm_Web20 .rfdSelect_Web20.rfdSelectDisabled:focus {
        background-color: green !important;
        background-image: none !important;
    }
</style>

ASPX:

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Skin="Web20" RenderMode="Lightweight" />
<asp:DropDownList ID="Dropdownlist1" runat="server" Enabled="false">
    <asp:ListItem Text="text1" />
    <asp:ListItem Text="text2" />
</asp:DropDownList>



Regards,
Danail Vasilev
Telerik
 
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
James
Top achievements
Rank 1
answered on 15 May 2015, 08:23 AM
Thanks for your help Danail. I'll probably go down the sprit editing route as I quite like the rest of the styling in classic mode.
Tags
FormDecorator
Asked by
James
Top achievements
Rank 1
Answers by
Danail Vasilev
Telerik team
James
Top achievements
Rank 1
Share this question
or