Chris Dalessandri
Top achievements
Rank 1
Rank 1
Chris Dalessandri
asked on 28 Mar 2012, 03:47 PM
Before the update to RadControls for .NET 2012.1 215, I was using the following css rule to darken the text when the RadNumericTextBox is disabled: .riDisabled { color: Black !important; }
Since the update, this no longer works for RadNumericTextBox though it still does for RadTextBox. The new rendering places the riDisabled class on the input element which seems to hold the non-rounded value, but this value is not shown when the box is disabled. There is no riDisabled class on the display span, nor is there an riDisabled class on the wrapper span. The display span is now styled using its style attribute.
Even stranger, using the DisabledStyle-CssClass attribute places the specified class on the input rather than on the display span or the wrapper span. Not sure how this could be useful.
This does not make sense to me. Am I missing something obvious or is this an oversight that will be addressed in a later release?
Thanks for your help.
Chris
Since the update, this no longer works for RadNumericTextBox though it still does for RadTextBox. The new rendering places the riDisabled class on the input element which seems to hold the non-rounded value, but this value is not shown when the box is disabled. There is no riDisabled class on the display span, nor is there an riDisabled class on the wrapper span. The display span is now styled using its style attribute.
Even stranger, using the DisabledStyle-CssClass attribute places the specified class on the input rather than on the display span or the wrapper span. Not sure how this could be useful.
This does not make sense to me. Am I missing something obvious or is this an oversight that will be addressed in a later release?
Thanks for your help.
Chris
6 Answers, 1 is accepted
0
Shawn Krivjansky
Top achievements
Rank 1
Rank 1
answered on 29 Mar 2012, 12:39 AM
I am having the EXACT same issue.
I use very similar CSS to darken/bold (in IE's case) the text on the riDisabled class that was used by Telerik up to this point.
I'm even using the "hotfix" version 2012.1.327
BTW, this is also an issue with
Telerik, this is a big problem for those of us who have had specific CSS to handle disabled state according to your markup. Now, your markup is so inconsistent that it doesn't seem like we can apply any generic style across the Telerik controls to handle "disabled" items.
What is going on here?
I use very similar CSS to darken/bold (in IE's case) the text on the riDisabled class that was used by Telerik up to this point.
I'm even using the "hotfix" version 2012.1.327
BTW, this is also an issue with
RadDateTimePicker
...and similar type controls where the riDisabled class isn't there anymore.Telerik, this is a big problem for those of us who have had specific CSS to handle disabled state according to your markup. Now, your markup is so inconsistent that it doesn't seem like we can apply any generic style across the Telerik controls to handle "disabled" items.
What is going on here?
0
Hello,
In the last version of RadControls the CSS class riDisabled is still rendered when the RadTextBox or RadNumericTextBox are disabled. The difference in the new version is that you can not use !important when you are styling the colour of the input. Therefore, use the following CSS rule
Also, please note that some browsers as IE do not allow to style the colour of the input in case it is disabled. You can verify it with the following regular <input />
However, I am sending you my test page. Please let me know if you manage to reproduce what you are getting in this project, and what steps to follow, so that we can test it too.
Looking forward to your reply.
Regards,
Galin
the Telerik team
In the last version of RadControls the CSS class riDisabled is still rendered when the RadTextBox or RadNumericTextBox are disabled. The difference in the new version is that you can not use !important when you are styling the colour of the input. Therefore, use the following CSS rule
html body span.riSingle .riDisabled{ color: black;}Also, please note that some browsers as IE do not allow to style the colour of the input in case it is disabled. You can verify it with the following regular <input />
<input type="text" value="Test" disabled="disabled" style="color: Red;" />However, I am sending you my test page. Please let me know if you manage to reproduce what you are getting in this project, and what steps to follow, so that we can test it too.
Looking forward to your reply.
Regards,
Galin
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.
0
Chris Dalessandri
Top achievements
Rank 1
Rank 1
answered on 29 Mar 2012, 05:01 PM
Your rule:
is not applied. The selector is overruled by the style tag:
Anyway, this does not address the issue raised that riDisabled is not on or above the display span. To wit, the css rule you supplied is not not even attempting to style the display span. If you are trying to make the input visible then you must stop the display span from displaying its value as the two can be different (see below). Anyway, this is not valid as only the display span holds the rounded value which is what should be displayed.
To see this issue, try the box below using a css rule that is actually applied (include the !important just to see what I am talking about). You will see 2.00 overwritten by 1.999
<telerik:RadNumericTextBox ID="RadBox" runat="server" Skin="WebBlue" NumberFormat-DecimalDigits="2"
NumberFormat-KeepNotRoundedValue="true" Value="1.999" Enabled="false">
</telerik:RadNumericTextBox>
html body span.riSingle .riDisabled{ color: black;}is not applied. The selector is overruled by the style tag:
element.style {
color: transparent;
}
Anyway, this does not address the issue raised that riDisabled is not on or above the display span. To wit, the css rule you supplied is not not even attempting to style the display span. If you are trying to make the input visible then you must stop the display span from displaying its value as the two can be different (see below). Anyway, this is not valid as only the display span holds the rounded value which is what should be displayed.
To see this issue, try the box below using a css rule that is actually applied (include the !important just to see what I am talking about). You will see 2.00 overwritten by 1.999
<telerik:RadNumericTextBox ID="RadBox" runat="server" Skin="WebBlue" NumberFormat-DecimalDigits="2"
NumberFormat-KeepNotRoundedValue="true" Value="1.999" Enabled="false">
</telerik:RadNumericTextBox>
0
Shawn Krivjansky
Top achievements
Rank 1
Rank 1
answered on 29 Mar 2012, 07:03 PM
I agree with Chris completely.
For the following definition:
It produces the following markup:
And... as Chris states, the SPAN is actually what is being displayed (NOT THE INPUT).
Moreover, in IE, it has "black" text (not the standard GRAY disabled text) which clearly means the SPAN is being shown (which isn't really the "disabled" element). The INPUT is the disabled element in this case, but it isn't the element being shown.
The RadDateTimePicker (and similar date pickers probably) has the SAME problem. The SPAN that is NOT disabled IS shown whereas the INPUT (which is NOT shown) has the disabled attributes.
Can we get a hotfix for this??
It is royally screwing up a lot of our stuff.
For the following definition:
<telerik:RadNumericTextBox ID="fldtxtSequence" runat="server" CssClass="hrnetTextBoxNumeric" DataType="Number" NumberFormat-DecimalDigits="0" ShowSpinButtons="True" IncrementSettings-InterceptArrowKeys="True" IncrementSettings-InterceptMouseWheel="True" />It produces the following markup:
<span style="width: 160px;" id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_wrapper" class="riSingle riContSpinButtons RadInput RadInput_Vista"><span style='text-align: left; color: black; line-height: normal; padding-right: 5px; padding-left: 5px; font-family: "segoe ui", arial, sans-serif; font-size: 12px; border-right-width: 4px; border-left-width: 1px; display: inline;' id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_display" class="riDisplay">100</span><input style="width: 100%; color: transparent; line-height: 10000px;" id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence" class="riTextBox riDisabled hrnetTextBoxNumeric" disabled="disabled" name="ctl00$MainContent$ucTabSetHRnetSetup1$ucTabListSitemap1$ucTabSitemap1$fldtxtSequence" value="100" type="text"><a id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_SpinUpButton" class="riUp" href="javascript:void(0)"><span>Spin Up</span></a><a id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_SpinDownButton" class="riDown" href="javascript:void(0)"><span>Spin Down</span></a><input id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_ClientState" name="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListSitemap1_ucTabSitemap1_fldtxtSequence_ClientState" value='{"enabled":false,"emptyMessage":"","minValue":-70368744177664,"maxValue":70368744177664}' type="hidden" autocomplete="off"></span>And... as Chris states, the SPAN is actually what is being displayed (NOT THE INPUT).
Moreover, in IE, it has "black" text (not the standard GRAY disabled text) which clearly means the SPAN is being shown (which isn't really the "disabled" element). The INPUT is the disabled element in this case, but it isn't the element being shown.
The RadDateTimePicker (and similar date pickers probably) has the SAME problem. The SPAN that is NOT disabled IS shown whereas the INPUT (which is NOT shown) has the disabled attributes.
<span style="width: 100%; display: block;" id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListErrorLog1_ucTabErrorLog1_fldrdpLogDate_dateInput_wrapper" class="riSingle RadInput RadInput_Vista"><span style='text-align: left; color: black; line-height: normal; padding-right: 5px; padding-left: 5px; font-family: "segoe ui", arial, sans-serif; font-size: 12px; border-right-width: 4px; border-left-width: 1px; display: inline;' id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListErrorLog1_ucTabErrorLog1_fldrdpLogDate_dateInput_display" class="riDisplay">03/27/2012 04:30:53 PM</span><input style="width: 100%; color: transparent; line-height: 10000px;" id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListErrorLog1_ucTabErrorLog1_fldrdpLogDate_dateInput"class="riTextBox riDisabled" disabled="disabled" name="ctl00$MainContent$ucTabSetHRnetSetup1$ucTabListErrorLog1$ucTabErrorLog1$fldrdpLogDate$dateInput" value="2012-03-27-16-30-53" type="text"><input id="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListErrorLog1_ucTabErrorLog1_fldrdpLogDate_dateInput_ClientState" name="ctl00_MainContent_ucTabSetHRnetSetup1_ucTabListErrorLog1_ucTabErrorLog1_fldrdpLogDate_dateInput_ClientState" value='{"enabled":false,"emptyMessage":"","minDateStr":"1/1/1980 0:0:0","maxDateStr":"12/31/2099 0:0:0","enteredText":""}' type="hidden" autocomplete="off"></span>Can we get a hotfix for this??
It is royally screwing up a lot of our stuff.
0
Hi all,
Currently you could use the old rendering of RadInput by setting EnableSingleInputRendering="false" for your inputs. We have this issue logged and our developers will fix it. However I could not promise it will happen for the service pack, since we are planning several more fixes/improvements for the RadInput that required lots of testing they are scheduled for the next Q2 2012.
All the best,
Vasil
the Telerik team
Currently you could use the old rendering of RadInput by setting EnableSingleInputRendering="false" for your inputs. We have this issue logged and our developers will fix it. However I could not promise it will happen for the service pack, since we are planning several more fixes/improvements for the RadInput that required lots of testing they are scheduled for the next Q2 2012.
All the best,
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.
0
Shawn Krivjansky
Top achievements
Rank 1
Rank 1
answered on 28 Jul 2012, 12:27 AM
Just an update in case anybody is interested.
I have validated this issue against 2012.2.724.
I believe things are back to "normal".
I have went back to EnableSingleInputRendering=True and things are much better now that in March.
The html output for the RadNumericTextBox spinners is quite different and needed a little css adjustment for my app, but the issues raised previously here seem to be fixed.
I have validated this issue against 2012.2.724.
I believe things are back to "normal".
I have went back to EnableSingleInputRendering=True and things are much better now that in March.
The html output for the RadNumericTextBox spinners is quite different and needed a little css adjustment for my app, but the issues raised previously here seem to be fixed.