html5-validation

what is the proper way to dynamically mark a field as required using Angular 2 Forms?

亡梦爱人 提交于 2021-02-07 13:16:58
问题 Using Angular 2 (2.0.0), what is the recommended way to dynamically mark a field as required, using Angular Forms? In all of their examples, the required attribute is just added like: <input type="text" class="form-control" id="name" required> What if the model I'm binding to has an IsRequired property, that will be true/false? If I use something like: <input [(ngModel)]="field.Value" type="text" value="{{field.Value}}" [attr.required]="field.IsRequired"/> That renders on the page like (note

what is the proper way to dynamically mark a field as required using Angular 2 Forms?

半世苍凉 提交于 2021-02-07 13:16:43
问题 Using Angular 2 (2.0.0), what is the recommended way to dynamically mark a field as required, using Angular Forms? In all of their examples, the required attribute is just added like: <input type="text" class="form-control" id="name" required> What if the model I'm binding to has an IsRequired property, that will be true/false? If I use something like: <input [(ngModel)]="field.Value" type="text" value="{{field.Value}}" [attr.required]="field.IsRequired"/> That renders on the page like (note

Bootstrap 4 validating credit card with custom messages

帅比萌擦擦* 提交于 2020-01-14 06:40:32
问题 I am using bootstrap 4 validation. How can I validate the credit card number must be numbers and must be 16 digits and show appropriate message? I would like to show three separate messages. 1. If noting is entered, "Credit card number is required" 2. If user enters "xyz etc", then "numbers only" , 3. If user enters less than 16 numbers, then show message as ""CC must be 16 digits". How can we show multiple custom messages ? Please see the fiddle. Thanks! <html lang="en"> <head> </head> <body

HTML5 form validation with Html Service

家住魔仙堡 提交于 2020-01-05 12:11:30
问题 I'm trying to use HTML5 form validation when using Google Apps Script HTML Service. As another user asked, according to the documentation example, you must use a button input instead of a submit input. Using a submit button seems to do the validation, but the server function is called anyway. The answer given to that user didn't work for me. Also, I want to call two functions when submitting the form and this can make it more complex. This is what I'm trying to do: The user fills a form and I

input:invalid css rule is applied on page load

被刻印的时光 ゝ 提交于 2019-12-22 06:27:10
问题 Check out these two fiddles in Firefox or Chrome. In this one, I've got just a simple form with a required attribute and a submit button. Pressing "submit" when the box is empty causes it to be styled as invalid (in Firefox, it's a red outline). But it waits until you press submit to show that it's invalid. Now try this one. It's identical, except that there's some css: input:invalid{ border-color:orange } Except this time the orange border color is applied even before submit is pressed. So

Manually trigger html5 validation on button click

一世执手 提交于 2019-12-22 03:54:23
问题 I am trying to handle form validation on button click. It is validating the form but not showing error. can anyone help me in this? <form id="the-form" action="#"> <input type="text" required="required" placeholder="Required text" /> <input type="email" required="required" placeholder="email" /> <button id="btn" type="button">Submit</button> </form> javascript: $("#btn").on("click", function(){ if($("#the-form")[0].checkValidity()) { alert('validated'); } else { //show errors return false; }

How to manually show a HTML5 validation message from a JavaScript function?

半城伤御伤魂 提交于 2019-12-19 15:00:39
问题 I want to know if there is any way to programatically show a HTML5 validation error, using a JavaScript function. This is useful for scenarios where email duplication has to be checked. For example, a person enters an email, presses the Submit button, and then has to be notified that this email is already registered or something. I know there are other ways of showing such an error, but I wanted to display it in the same way as how the validation error messages are shown (e.g. invalid email,

HTML5 validation when the input type is not “submit”

蓝咒 提交于 2019-12-17 06:33:24
问题 I'm using HTML5 for validating fields. I'm submitting the form using JavaScript on a button click. But the HTML5 validation doesn't work. It works only when then input type is submit. Can we do anything other than using JavaScript validation or changing the type to submit ? This is the HTML code: <input type="text" id="example" name="example" value="" required> <button type="button" onclick="submitform()" id="save">Save</button> I'm submitting the form in the function submitform() . 回答1: The

Html5 input pattern

时光总嘲笑我的痴心妄想 提交于 2019-12-14 03:21:48
问题 I have this pattern .*?[a-z]([a-z])([a-z])([a-z]).*?(\s+)(\d+) from some online generator but it's not working. I need pattern which allow: "minimum 3 char length string, next single space, and next minimum 1 char integer" [abc 1] or the same but in different order "minimum 1 char integer, next single space, and next minimum 3 char length string" [3 gtf]. Thanks. 回答1: Try this one: \d+\s\w{3,}|\w{3,}\s\d+ It either matches: One or more digits ( \d+ ), followed by a single whitespace ( \s ),