I have a directive on a form group. I need to watch values of different inputs simultaneously. Lets say I have a zip code field, a country and a city field. I need to watch all of those values and ping a service when a valid value is typed(not yet submitted)
You just need to implement ngChange handler on your fields.
Related
I build a custom form control composed of 3 mat-select as shown on the following demo:
Stackblitz
I want to make only month and year field required and make the day field optional in this form control. The examples are generally apply the required to all the components in that user control. But instead of applying to all of 3 select lists, I just want to make required 2 fields of them.
So, how can I do this?
If it's possible, you should use angular forms in the DateSelect component as well and pass the value of the form to the onChange function. This way you have control over every input field individually. Mixing angular forms and binding can unnecesarily complicate things.
I am wanting to create an angular form dynamically from json.
This form has a variety of field types (input, date, number, select)
These field types can also be secondary conditional fields based on select values. (See formData.js)
The form needs root level objects in the FormGroup in angular, but also needs FormArrays for fields that the user can add more of (multiSelect:true in the data).
I have it working to render the top level fields, and the mutliselect fields.
The issue is when I am trying to render the conditional fields and have it work in a structure of angular Forms values collection.
I have put together a stackblitz of the form element of my application.
The form is built in a loop from the formData, with a dynamic Field Directive using factoryResolver to create the components.
The error I specifically get is control.registerOnChange is not a function. The angular form Object has all the fields where they are needed in this iteration including multiselect fields.
But the conditionals don't currently render.
Any help on this would be appreciated, and if any more information is needed let me know.
https://stackblitz.com/edit/angular-bxznoc
I am trying to pass to variable from a form select but I am running into issues.
How do I accomplish sending the catSubcat, value, and more variables. I have tried so many different things.
Update: I have created the jsfiddle below. I kinda have to be vague due to security here.
With the example html you will see category (DA, DC, etc..), multi acct code(M02 or M03 based on the amount), multi name (Bundle). For testing the clients can make up the inputs to do their testing. Once I receive the code from the other department I have to hide all the inputs except the products, but they will populate into a hidden field.
How it is supposed to work: A user goes to the account page and selects however many and whatever account. Based on their selections the category, multi code and multi name will be passed through the submit to another page and submit all the variables.
Not my code and I cannot change it due to the other departments requirements.
<https://jsfiddle.net/jm1w6ycv/2/>
I am trying to create a many to many form field modification using the following cookbook entry:
http://symfony.com/doc/current/cookbook/form/dynamic_form_modification.html#dynamic-generation-for-submitted-forms
The idea is simple that I have the entities VendorKind, Vendor & Event. So in the event creation form, I want a field to show the values of VendorKind in a select field and based on the input, it will show the vendors values in a multi-select field.
Now since there isn't only one kind of vendor in an event (VendorKind). I want to create a custom Symfony2 form field that shall consider the select and the corresponding multi-select field as one. Which I can then use as a collection and add as many as I want using prototype.
Please let me know if this is possible using custom field type?
I know with a form, I can get the $valid property to check whether the entire form is valid. Is there a way to get the validity of a form but ignore undirtied fields whose only rule is "required"?
I have a form that has a save button and a next button. This form is part of a series of forms. When the user clicks on save, I want full validation, but if the user clicks on "next", I want it to validate (and alert the user) for all fields except those who have no validation rules on them other than the "required" flag. This is so that I can save a partially completed form without having to alert the user to the missing fields until later (because they will want to save progress on their forms without having to complete them altogether).
Perhaps there's a way to get the fields with a jQuery selector/filter of some kind?
Not sure I completely understand the question and your use case, but it somewhat sounds like you may need to use custom form validation.
http://docs.angularjs.org/guide/forms#custom-validation
(you may need to scroll down a bit when first loading the link)
Basically you may need to add your own custom directive to control the validity of the inputs you have in mind.
Alternatively, and maybe not quite the "Angular" way, you can avoid using the data binding between the fields and model, effectively opting out of Angular validation. Obviously losing the data binding may be a bigger issue for you but you could get at those values with code outside of your Angular stack.