We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How can I customize the float label?

Thread ID:





141229 Nov 30,2018 09:26 AM UTC Dec 4,2018 06:16 PM UTC Angular - EJ 2 1
Tags: Textbox
Paul Kocher
Asked On November 30, 2018 09:26 AM UTC


This question actually applies to all controls where a floatLabel can be used. In my form, I have some inputs which are required and need some indication like a *.

Here is an example of a textBox I'm using:

<ejs-textbox placeholder="Vorname" floatLabelType="Auto" formControlName='vorname' (created)='disableAutocompleteVorname()'></ejs-textbox>

This is the css:

.required:after {
color: #d00;
content: "*";
position: absolute;
margin-left: 3px;
top: -3px;

The first asteriks is ok - this does work because I'm using this code:

<span class="custom-label required">Geschlecht</span>
<ejs-radiobutton cssClass="custom-margin" label="männlich" name="geschlecht" [value]='"M"'
<ejs-radiobutton cssClass="custom-margin" label="weiblich" name="geschlecht" [value]='"W"'

on the other controls without "custom-label" it looks like you can see on the picture. The asteriks is supposed to be right behind "Vorname"

Christopher Issac Sunder K [Syncfusion]
Replied On December 4, 2018 06:16 PM UTC

Hi Paul, 
Thank you for contacting Syncfusion support. 
As per your requirement, we have prepared a simple sample with enable the Asterix  in float label text. For more information, please refer the below stackblitz sample, 
In the above sample, based on the enableAsterix’s  boolean value, Asterix class added to root element using ngClass directive. For more information about floatLabelType property in TextBox component, please refer the below ug documentation, 

Please let us know if you require any further assistance. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon