Comments (4)
hi @plrenaudin is the following code what you are looking for?
<div class="form-group form-group-label form-group-red">
<div class="row">
<div class="col-lg-6 col-sm-8">
<label class="floating-label" for="input-required">Required</label>
<input class="form-control" id="input-required" type="text">
<span class="form-help form-help-msg text-red">Input is required<i class="form-help-icon icon icon-warning"></i></span>
</div>
</div>
</div>
from material.
Hi @sesemaya,
Thanks for replying.
The behavior of a required field is not the same on the polymer element: once you fill it in, the warning disappear.
The best way would be to handle this the same as the required attribute on a html input : display the warning on the form submit.
from material.
Couldn't you implement this yourself with JavaScript? Incorporating
specific behaviours is a little beyond the focus of this project, which is
design and page structure.
On Wed, Apr 22, 2015 at 5:36 PM, Pierre-Louis Renaudin <
[email protected]> wrote:
Hi @sesemaya https://github.com/sesemaya,
Thanks for replying.
The behavior of a required field is not the same on the polymer element:
once you fill it in, the warning disappear.
The best way would be to handle this the same as the required attribute on
a html input : display the warning on the form submit.—
Reply to this email directly or view it on GitHub
#12 (comment).
from material.
Ok, I found a small workaround anyway which works for me without JS.
I added those lines at the end of base.css
.form-control:invalid, .form-control:invalid + .floating-label{
color:red;
border-bottom-color:red;
}
from material.
Related Issues (20)
- Has this project been abandonned? HOT 3
- Update or destroy instance of date picker HOT 1
- Update datepicker plugin HOT 3
- Datepicker is broken on the sample page. HOT 7
- Not possible to have link ont left AND right navbar HOT 3
- Material Icons variants HOT 3
- Argument `$map` of `map-get($map, $key)` must be a map HOT 2
- date pickers -> change the language HOT 4
- djibe fork HOT 5
- Make Buttons ripple effect smoother HOT 9
- How to set dark theme HOT 3
- Floating label is cut off at bottom HOT 3
- Error when loading the js file! HOT 2
- Update to latest bootstrap v5.0.1 HOT 2
- Abandoned HOT 5
- navdrawer is not a function HOT 3
- Auto close the navdrawer on navigation to other link HOT 1
- Carousel not auto sliding HOT 6
- Next/Previous buttons not working in web, angular 14. HOT 1
- Changing the default color for controls HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from material.