Need to split a single form into multiple components in Angular 2 - angular2-forms

I have 1 larger form which contains 10 sections. I am planning to split that 1 form into multiple components (Nested).
If i create nested components i need associate the FormGroup in the main component (That is tightly coupled). Instead of that is there any other possible solution we have (I am looking for a loosely coupled) in Angular 2 /4.
Thanks

Having the parent container hold the form and it's form groups and then passing the form to the children make for less code within the children, for example
<child-comp [form]="parentForm"> or
<child-comp [form]="parentForm.controls.myFormGroup">
However, if you don't want to pass the form at all, then you can just create the form group in the child. But, you will have to pass the data back up to the parent so the parent can use it or pass it to another child.
There are several ways a parent can reference a child to get its form group
#ViewChild(InfoComponent) private info: InfoComponent;
#Output() infoUpdated = new EventEmitter();
A shared service

Related

Passing a Collection from VBA to a form

I have a an MS Access database with nine tables. The main form will be driven by a query linking the two main tables. When I pull up any one record ("family within a house"), I have a lot of variable data to pull into the form (how many family members, names of each, other specific information) to retrieve from the other seven tables. I created a VBA module, linked to this form, which is triggered when a record is loaded. The code aggregates all the family member data into a Collection of "person" elements. All of that works, as evidenced by the "Immediate" window in VBA. The "person" object is defined as a Class Module with all the relevant attributes (firstname, lastname, email, is-parent/is-child, etc).
Where I'm stuck: how do I access the collection within the form, so I can start populating elements? I haven't been able to find any documentation to do this, nor any similar questions asked/answered online. Next step will be creating all the elements dynamically, but right now, being able to create a static element and setting the control source to (at least some component/value within) the collection would be a huge help.
My VBA form module has a method, "Private Sub Form_Current()", which generates the collection when the current record is changed.
Thanks in advance...
Got my answer: "you don't". Set the element values in code, rather than trying to pass the collection the form.

Nested form affecting already existing children to parent

Taking the example of spies and missions with a many to many relationship (spies can't be assigned to multiple missions and missions can have 4 or less spies assigned to it), I am able to make a nested form so I can create spies in the same form than the mission. But now, I don't want to create spies in the mission's form but instead, assign already created spies. What would be the best way to do this ?
Replace the part of the form that creates spies with one that fetches them by quoting a unique identifier, such as their name (or however they are known.)
You can create the array to search through in the controller.
#spies = Spy.all
If there are only a few of them, I'd use a select tag. If there are too many for that, let the user type it in and use ajax to confirm and autocomplete it.
<%= select(:spy, :spy_id, #spies) %>

Vaadin: How to remove item from DB container grid

How do I remove a row from a container/item/grid/db/entity/bean/class/object/ID?
Also, what's the difference between all these?
Everyone seems to say these as if they were interchangeable.
Can I get a simple explanation of how these all work together?
I've been through dozens of youtube videos and tutorials, but I still can't see the big picture.
Simple task: Delete one row from a grid.
But then it starts getting bigger and more complex with nested beanitem container property field entities and I just can't make sense of it.
Thank you for all of your help in advance!
The Grid, Table or any other Vaadin Component used to present set of data use some implementation of the Container to store your data. A Component is a part of your User Interface, the <div> in your DOM which is seen by your end user. The Vaadin Containers contains your objects. The most widely used containers are:
IndexedContainer - default container for Grid and Table. You usually add items by calling addItem method on either container or related component. The disadvantage of using this type of container is that you are usually obligated to set appropriate properties (think of columns) on both items and the container itself,
BeanContainer - is able to receive Java objects that follows JavaBean convention. Thus it is able to automatically infer properties of your component,
SQLContainer - contains data stored in database. Constructed using SQL query. Can be setup to automatically update your database based on changes made by user in UI.
Items and IDs
Adding single items to some containers may look a bit complicated. There are a few ways to do this. They are described very well on a Vaadin website. Basically the ID is an unique object that you use to access corresponding Item. The Item is represents the single row in your component. Every Item have properties. You can access and make changes to your items in container using their IDs i.e.
table.getItem("uniqueId");
Usually, you don't operate directly on containers. The components expose basic Container interface methods via their API. In example implementation of AbstractSelect.getItem() component currently (Vaadin 7.5.9):
protected Container items;
public Item getItem(Object itemId) {
return items.getItem(itemId);
}
(AbstractSelect is a super class of other Vaadin components like Table and Grid)
It gets more complicated with properties of the items. Every Item have some properties (columns). And every Property has its corresponding ID. Using property ID you can access the value of the item in the specific column. The following code presents above - it adds one item with one property and sets its value:
Table table = new Table();
table.addContainerProperty("column1", String.class, "defaultValue");
Item item = table.addItem("uniqueId");
item.getItemProperty("column1").setValue("Black Friday");
Notice that it is perfectly safe to use String literals as IDs since underneath they are compared using equals()

Dynamic linking gets cleared when inserting new records

I have one form in AX 2012 from which i am calling another child form which shows records that are related to the selected record in Parent form(Dynamic linking).
Now, when I am trying to create a new record in a child form, the dynamic linking between this form and its parent form gets cleared and child form starts showing all data according to its datasource and not any filtered records which I don't want.
I want to know that, how to get stick with that dynamic linking while creating new Record in a child form.
Check that your grids really belongs to the correct datasources. If not, strange things happen.

Setting default values across multiple children in a multi model form (Rails 2.3 )

Am trying to simplify the create / edit view for a multi-model controller.
User can dymically add / remove child input fields from the form. (Have followed Eloy's complex form example)
I want to limit the user's ability to set certain attributes across multilpe children..
Suppose I have a child attribute with and I want the user to only input the date once.. eg the date will be the same across all children..
I would like present a single date entry box and then multiple Adults | Seniors boxes depending on the number of children the user wants to submit.
using accepts_nested_attributes_for my form is showing multiple date boxes..
(Since I want to retain the ability to do this as an admin I don't want to move the date attribute to the parent.)
How should I go about adapting the form without having to extend the controller logic too much?
If you have business logic that states that all of your children models have the same date, then I see this working a couple different ways.
First of all, maybe you have your data in the wrong place. If the date is always going to be the same for all of the children models, then why not make it an attribute on your parent model instead? You can always use the delegate method in your children model to fetch the date from the parent.
Another way I see of handling this is with a virtual attribute and a callback on your parent model. Use attr_accessor to create a virtual attribute on your parent model. Then in your form, add a field for the date to the parent model with the name you used to define the attr_accessor. Finally, add in a before_save callback (or whichever callback is appropriate for your case) in the parent model that saves the date to all of the children.

Resources