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.
|
In EJ Textboxes components the floating label functionality can achievable in application level. We can form the below element structure and add the corresponding class (“e-float-container, e-float-text”) to achieve the floating label functionality to get the Material theme like floating appearance.
The following code demonstrates How to achieve floating labels functionalities in EJ Textboxes controls.
HTML: <div class=" e-float-container"> <input id="numeric" type="text" /> <label class=" e-float-text">Enter numeric value</label> </div> <div class=" e-float-container"> <input id="percent" type="text" /> <label class=" e-float-text">Enter percentage value</label> </div> <div class=" e-float-container"> <input id="currency" type="text" /> <label class=" e-float-text">Enter currency value</label> </div>
JAVASCRIPT:
<script type="text/javascript">
$(function () {
$("#numeric").ejNumericTextbox(
{
name: "numeric",
width:"100%",
watermarkText: "",
});
$("#percent").ejPercentageTextbox(
{
name: "percentage",
width:"100%",
watermarkText: "",
});
$("#currency").ejCurrencyTextbox(
{
name: "currency",
width:"100%",
watermarkText: "",
});
});
</script>
The below screenshots displays the output of above code.
Figure 1: Output
Figure 2: Output
A sample is available in the following location: Sample location
Note: This support only applicable for after the Vol 2,2017(15.2.0.40) release
|
This page will automatically be redirected to the sign-in page in 10 seconds.
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.
