I am building a multi-step application form with React. Having first built it with pure internal state I am now in the process of refactoring to Redux using redux-form.
Having used the example here as a basis: http://redux-form.com/5.2.5/#/examples/wizard?_k=oftw7a we have come a good way.
However the problem appears when i have two forms which are supposed to have the same value. During one of the pages i have a name field, that is supposed to be duplicated on the name field of the next page. The opposite should happen if you go back from the last page. Any tips to how this could be achieved?
Using the wizard, you are basically working with the exact same form that's split into multiple pieces. Ultimately it's the same form, because redux-form tracks them by name. It is how the library identifies the pieces of the same form - using the name.
form: 'wizard',
Here you can see that the exact same instance of the form will be shared throughout the pieces. fields work in a similar manner. Each field is defined as part of a form.
As long as you use the same field constants inside the fields object that you pass into the reduxForm function and as long as the value for form is the same, so that they use the same underlying form object, it should work for you just fine.
On one page you should pass in
export default reduxForm({
form: 'wizard',
fields : {
'fieldIWantOnBothPartsOfTheForm',
'someOtherFieldThatShouldOnlyBeHere',
},
...
And then on the other page:
export default reduxForm({
form: 'wizard',
fields : {
'fieldIWantOnBothPartsOfTheForm',
'thirdFieldHere',
},
...
Also, make sure you keep destroyOnUnmount equal to false if you want to navigate back-and-forth.
Hope that helps.
Related
I have a simple form that's in a dialog fragment used to submitting two fields for log-in auth.
For simplicity I was hoping to not have to use data binding, but rather use some method to gather all data inside my sap.ui.layout.form.SimpleForm.
I added a name property to each input element which says in the docs it is " Defines the name of the control for the purposes of form submission."
https://openui5.hana.ondemand.com/#/api/sap.m.InputBase/controlProperties#name
However hard as I try to find there doesn't seem to be any getFormData methods.
All SO questions and guides either use data binding to a model, or hard-code references to the individual input controls with .getValue() methods.
And looking further into the form API, there doesn't seem to be a Submit event either.
Given an arbitrary form, what would be the best way to gather all submission values without hard-coded references or data-binding?
Would a method that walks though all the children elements of a form looking for all submission values work? I think it might, but there are more submission input types then just the input component.
You can get the value of the fields by directly using;
var oField = sap.ui.getCore().byId('IdOfTheFieldAtTheDialog');
var sValue = oField.getValue();
But it's always better and convenient to use data binding which keep things neat.
And If I assume that you have the id of parent form container, you can iterate over the items and get the sap.m.Input elements in it without knowing the IDs of the individual inputs, and you may check the name property of the fields if you want. Check this snippet;
https://jsfiddle.net/hdereli/9e92osfk/3/
I've built a Zend_Form_Decorator_Input class which extends Zend_Form_Decorator_Abstract, so that I could customize my form inputs -- works great. I ran into a problem in the decorate class, in trying to get the form name of the element, so as to built a unique id for each field (in case there are multiple forms with identical field names).
There is no method like this: Zend_Form_Element::getForm(); It seems Zend_Form_Decorator_Abstract doesn't have this ability either. Any ideas?
I don't think changing the id from the decorator is the right approach. At the time the decorator is called the element already has been rendered. Thus changing the id would have no effect to the source code. Additionally, as you already have pointed out, the relation between a form and its elements is unidirectional, i.e. (to my best knowledge) there is no direct way to access the form from the element.
So far the bad news.
The good news is, that there actually is a pretty easy solution to your problem: The Zend_Form option elementsBelongTo. It prevents that the same ID is assigned to two form elements that have the same name but belong to different forms:
$form1 = new Zend_Form(array('elementsBelongTo' => 'form1'));
$form1->addElement('Text', 'text1');
$form2 = new Zend_Form(array('elementsBelongTo' => 'form2'));
$form2->addElement('Text', 'text1');
Although both forms have a text field named 'text1', they have different ids: 'form1-text1' and 'form2-text1'. However, there is a major drawback to this: This also changes the name elements in such a way that they are in the format formname[elementname]. Therefore $this->getRequest()->getParam('formname') will return an associative array containing the form elements.
I'm working with Symfony2 to set up a form, where a Shelf-Entity can be edited.
A shelf contains a collection of Readable-Entities (e.g. Book, Magazine, etc. - all inherit from Readable).
The user has the possibility to add more Readable-Entities (the form is extended via JavaScript) and from a dropdown he can select the type of Readable he wants to add. Depending on the selected dropdown-value, different form fields are rendered. So far so good.
Now, when the form is submitted to the server, depending on the Readable-Type the user selected in the form, a different entity-type should be instantiated.
If I don't do anything, Symfony just instantiates the base class Readable (and not Book, Magazine, etc.).
How can I tell Symfony to instantiate the correct type of Readable depending on the selected value from the dropdown?
I tried with FormEvent-Listeners, but:
in PRE_SUBMIT I only get an array containing the "raw" form data with $event->getData(), i.e. no entities have been instatiated so far. However, at this stage, I still have access to value of the dropdown.
in SUBMIT the form data was already assigned to the appropriate entities. Also the new Readable was already instatiated with the base Readable-Class. But now, I cannot access anymore the value from the dropdown.
What is the correct way to do this?
EDIT
Added a minimal Code-Example for the Shelf FormType:
https://gist.github.com/anonymous/401495b701982adafb96
Code for infinite_form_polycollection:
https://gist.github.com/anonymous/b5f0ed10ca9c52177f01
Have you tried looking at this part of the doc? As "embedding a form" seems to fit your needs.
It seems that there was something wrong with the PHP-Files of the PolyCollection in the vendor-directory, because after removing everything related to the Infinite Form Bundle from the vendor-dir and reinstalling it with composer, everything is working now. But thanks for your efforts YoannCh
I have a form with collection of subforms - student with different studies - relation manyToOne. I have corrent database schema and entities and form builder works well. I don't know how to append new "study" object. I need to get html tags from somewhere in either cases - when there is at least one "study: object (clone him) or there is no such a one.
Let's assume that study object has 2 fields: name and year. If for a student there is such a record (object) it's first input in generated form has name "student[study][0][name]". And is surrounded by . When I click "Add new study" button I want to duplicate this surrounding div and change id's and name's of html form elements respectively. Is there ready library or method to use?
But there may happen there is no study records so far. So I need to get form from server through ajax call. Unfortunately returned form has inputs with names like "study[name]". Is it possible to render this form similar to first case - I mean "student[study][0][name]". But i'd like to avoid manually generate twig template for form - I prefer
{{ form_widget(form) }}
You should be dealing with data-prototype rather than issuing separate AJAX request. The whole concept of adding/removing subform items is described here:
http://symfony.com/doc/current/reference/forms/types/collection.html#adding-and-removing-items
Obviously, you will need to some JS (jQuery is highly recommended) in order to replicate subform fields.
You should note, however, that data-prototype behaves differently when you initially have empty or non-empty collection. At least I have encountered this weird behavior. As far as I remember, in first your when you say {{ form_rest(form) }} additional DIV is appended with data-prototype attribute consisting of form's HTML. In second case actual HTML (not as an attribute) is appended with ID attribute "form_name_$$name$$" where you need to replace $$name$$ with proper index.
Now, you really should take a look - maybe all this has been fixed in some recent versions but I can't be sure...
Hope this helps a bit...
I have a form here in which there is a textfield which contains a number. In another part of the form there are rows, which coresponds with the number entered. For example 2 = 2 rows etc.
So my idea is to create one row which is duplicated by a javascript. So i must create a input element which name is in a array like name="input[]" how can i do this in Zend Framework?
The only approach i found for this kind of problem is to use subforms. But every Subform has a explicite name which is not in a array.
To make a rendered Zend_Form respond to client-side changes - as in your example, to allow the user to enter the number of rows he wants - you need both client-side and server-handling.
The best example demonstrating the general idea is from Jeremy Kendall:
jeremykendall.net » Blog Archive » Dynamically Adding Elements to Zend_Form
The upshot is that you have client-side code that adds tracks the number of fields and then a preValidation() method that injects the right number of fields into the $form instance before isValid() gets called.
[As noted in the comments there, this preValidation() processing could just be bundled into isValid() so that the controller remains unchanged.]