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

RadMaskedTextBox Remove Wrapping CSS Classes

2 Answers 94 Views
MaskedTextBox
This is a migrated thread and some comments may be shown as answers.
Scott
Top achievements
Rank 1
Scott asked on 17 Apr 2017, 04:58 PM
I have a pre-existing set of styles in use for an application I'm building and the RadMaskedTextbox creates a <div /> wrapper around the control, with 
RadInput RadInput_Default

in the class declaration for the div. Is it possible to remove these? They override some of my default styling, so I'd rather they just don't get attached upon render at all if possible. This is for version 2017.1.228.45.

Thanks!

2 Answers, 1 is accepted

Sort by
0
Accepted
Peter Milchev
Telerik team
answered on 20 Apr 2017, 10:26 AM
Hello Scott,

We would recommend using stronger selectors in your custom CSS. Here is an article that you might find helpful on the topic: Specifics on CSS Specificity

Removing the RadInput class might result in not only incorrect appearance but also unexpected behavior. If you really need to remove the classes from the wrapper element, you can subscribe to the ClientEvents-OnLoad event as demonstrated below:
<telerik:RadMaskedTextBox  ClientEvents-OnLoad="onLoad" ... ></telerik:RadMaskedTextBox>
<script>   
    function onLoad(sender, args) {
        var wrapper = sender.get_wrapperElement();
        wrapper.classList.remove('RadInput');
        wrapper.classList.remove('RadInput_Default');
    }
</script>

Regards,
Peter Milchev
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Scott
Top achievements
Rank 1
answered on 22 Apr 2017, 05:03 PM
[quote]Peter Milchev said:Hello Scott,

We would recommend using stronger selectors in your custom CSS. Here is an article that you might find helpful on the topic: Specifics on CSS Specificity

Removing the RadInput class might result in not only incorrect appearance but also unexpected behavior. If you really need to remove the classes from the wrapper element, you can subscribe to the ClientEvents-OnLoad event as demonstrated below:
<telerik:RadMaskedTextBox  ClientEvents-OnLoad="onLoad" ... ></telerik:RadMaskedTextBox>
<script>   
    function onLoad(sender, args) {
        var wrapper = sender.get_wrapperElement();
        wrapper.classList.remove('RadInput');
        wrapper.classList.remove('RadInput_Default');
    }
</script>

Regards,
Peter Milchev
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.

[/quote]

 

Perfect! That's exactly what I needed. Thanks!

Tags
MaskedTextBox
Asked by
Scott
Top achievements
Rank 1
Answers by
Peter Milchev
Telerik team
Scott
Top achievements
Rank 1
Share this question
or