I have Polymer application and I want to check if given inputs are NOT EMPTY on form submission. I have some inputs set to required but I don't have any way to check if those fields are NOT EMPTY. I can only check if given pattern is matched by checking invalid attribute but even for required fields pattern is .*.
Is there any wait to do it? Or is it in beta and this feature has not been implemented yet?
Polymer.dart <= 0.16.x
You can set a pattern yourself
<paper-input floatinglabel
label="Some label"
value='{{someValue}}'
pattern="^.+$"
error="Input required">
</paper-input>
Or see
Taking total control of PaperInput validation
for complete control of validation.
Related
I'm using Angular 6.0.9 and Angular Material 6.5.4. In my form I have an ngFor loop for the inputs with an errorStateMatcher to validate the input.
The problem is that if the content of an input field is invalid, all other fields will also be marked as invalid (even if they are not dirty). I want to make sure that only the current field that is actually invalid is marked as red.
See a self-explanatory example on stackblitz:
https://stackblitz.com/edit/angular-s1jyhw?file=app%2Finput-error-state-matcher-example.html
Your inputs all share the same form control emailFormControl. You need a separate form control for each input. It is okay to use the same ErrorStateMatcher but not FormControl
For fun/practice I write a test for Google advanced search and I am looking for a locator that will allow to find the form submit on https://www.google.com/advanced_search:
<input class="jfk-button jfk-button-action dUBGpe"
style="-webkit-user-select:none;user-select:none;line-height:100%;height:30px;min-width:120px"
value="Wyszukiwanie zaawansowane" type="submit">
As you can see this submit does not have id nor name defined so by.id() or by.name() cannot be used.
by.css locates elements using a CSS selector. It allows you to simply use attribute selectors for locating elements in the DOM.
element(by.css('input[type="submit"]'))
To find the form submit the by.xpath locator can be used:
element(by.xpath("//input[#type='submit']"));
What locator will suite You depends of the whole page, but here are few locators you can try:
element(by.xpath("//input[#class='jfk-button jfk-button-action dUBGpe']"));
element(by.css("jfk-button.jfk-button-action.dUBGpe"));
A lot of folks on Stack Overflow are probably trying to fix forms that don't submit, but I'm actually hoping to do the opposite!
What I'd like to do for an art project is make a form with a "joke" field -- say, your SSN, your bank account number, your fingerprints or retina scans or DNA code, or something super personal like that. But I don't want the number in our server logs, and I don't want it to be transmitted over the internet at all. I don't want any legal liability!
Basically the idea is just to ask for something audacious, but not to handle the data that may or may not come from users who actually put it in.
So, is there a way to make a field that acts as a normal form field, but where nonetheless we would feel "safe" that users who actually do put their sensitive info in the field will be protected?
What's the "safest" approach to something like this?
Form fields require a name to be submitted:
If any of the following conditions are met, then skip these substeps for this element:
[…]
The field element is not an input element whose type attribute is in the Image Button state, and either the field element does not have a name attribute specified, or its name attribute's value is the empty string.
[…]
So you could simply use an input without name attribute:
<input type="text">
Be careful with your "jokes", if you want that the information of the field is not submitted, then, you can simply leave it out of the form element like this:
<form action="... >
<input type="... >
</form>
<input type="... > <!-- This field won't be submitted-->
From w3c schools we have these definitions:
novalidate:
When present, it specifies that the form-data (input) should not be
validated when submitted.
formnovalidate:
When present, it specifies that the element should not be
validated when submitted.
Does it make any difference using formnovalidate in the submit button insted of using novalidate in the form?
(I really don't get the difference)
novalidate is applied to the form, and prevents it from being validated; formnovalidate is applied to a submit button, and overrides the novalidate option, if present; it means 'submit this form without validating, regardless of the general form setting'.
The example given in the spec is when a user is saving data rather than publishing it; the data might be incomplete and invalid, but doesn't require validation to be saved.
Html5 has new attributes like the novalidation attribute for the form element and the required element for an input element.
When using both of this type of attributes, what sort of attribute have a higher priority, the form attributes or the input attributes?
The novalidate attribute specifies that the form should not be validated when submitted. If this attribute is present the form will not validate form input. (source: http://www.w3schools.com/html5/att_form_novalidate.asp)
This means it won't validate required input items, the format of email and url input types and so on. It essentially means "allow any input".
novalidate turns off HTML5 form validation for a form, that is, a required input field in that form won't be validated on submission.
Judging by the information from w3schools here and the working example here I would say that the novalidate attribute always overrules form-elements, even when they have the required attribute.