Dynamic Forms with Redux Form

[@haidermansoor6595]

I don't know why people don't subscribe to this amazing guy. hats off to you man

[@artturilaitakari3955]

redux forms make a simple form VERY complicated.

[@Holdino_]

2018 here. You no longer need Lodash for any of the things you used it for. Also you no longer need to bind 'this' when you call your class method. Instead you can use a class property method which handles 'this' for you.

[@ApoorvMote]

Great video Stephen. The validation message for content would be "Enter a content". But it should be "Enter some content". It seems complicated to customise help text.

[@Stephen_Grider]

+Apoorv Mote Ah shoot my mistake. We could have added another piece of config to show the appropriate message.

[@moveaxebx]

Don't use lodash, but instead Array.prototype methods like .map and .forEach and pollyfill them if needed. Better readability, no library coupling and compatible with standard JS.

[@jonasstromsand2396]

Are you crazy dude?

[@petterk3962]

+1

[@ccuenca24]

Hi Stephen thanks for sharing, is this approach your boilet plate? or the aproach you show up in the udemy course en the chapter of redux-form? you know with the field component. Thanks

[@bryan333333333333333]

heeeyyy, stephen grider. recognize your voice from a react native Udemy course. good content :)

[@jamiehutber9754]

Which version of redux-form were you using :D Might help for future.

[@_JocelioLima]

Stephen Grider, my react instructor in udemy :)

[@tushant04]

can you post videos on multiple image upload with delete feature and add feature?

[@SudhanshuRamTripathi]

i am not able to set "fields" array in => reduxForm({ })(ContactForm). i am using typescript right now. Thanks

[@jmancherjeee]

Is this possible if we don't know the exact fields ahead of time. For example if we fetch a list of users and keep them in our store, and we want to create an input field for each user? I am having trouble getting redux form to recognize a more dynamic amount of inputs using this method.

[@WoutMertens]

You can create a generic configuration for each user and use the dynamic features of redux-form to use that. However, this use case is easier to do in the upcoming v6 version, redux-form.com/6.0.0-alpha.13/

[@riyakapuria331]

Can you please give me the link for full setup for this app.

[@abigwonderful]

This was a short and sweet video. Thanks and nice work! One quick q: if I wanted to pass in default values to the FIELDS object (ie userdata), how would I render them in the renderField()? I've been trying everything I can find in redux-forms documentation, but keep striking out. Any guidance would be greatly appreciated

[@WoutMertens]

You either show placeholders with the HTML5 placeholder attribute, or you pass initialValues to the redux-form-ified object and they will show normally.

[@abigwonderful]

Thanks for following up! I ended up finding the 'initialValues' object option a day after posting the question and that was exactly what I needed! Cheers.

[@__greg__]

great stuff!

[@cquezel]

What does this video have to do with Redux Form?

[@usasikh1]

Also, would you recommend using immutable Js or not. It seems redux-form might not work with immutable js

[@WoutMertens]

Unless you have a lot of data, you don't really need ImmutableJS. Instead, you could use github.com/leoasis/redux-immutable-state-invariant during development to make sure that you are not mutating in your reducers, or github.com/rtfeldman/seamless-immutable which is like a light version of Immutable.js. However, if you can afford the ImmutableJS code size in your project (and if you don't mind the API vs plain objects), and you have quite a bit of data, it will most likely be faster than using plain objects.

[@usasikh1]

thanks, I see it states this lib is only for development not production. I have been using POJOS thus far in redux.

[@WoutMertens]

Yes, seamless-immutable is basically POJOS with some helper functions and dev-env-only errors when you mutate

[@marcelhumes]

I don't know why but this.props.fields[field] in the renderField function comes up as undefined. Whereas logging this.props.fields lists [title, categories, content] I can't type it to the var fieldHelper and thus the very first 'fieldHelper.touched' throws and error. Is there some change in Redux Form syntax that went down? I've used Redux form in other ways, instructed by Stephen, that aren't as tidy. But liking the minimalism of this tut and would be nice to nail it down.

[@marcelhumes1360]

Sorted all of this out. Simply overthinking solutions and structuring things incorrectly.

[@mdpun333]

How this was sorted. I am getting the same exception.

[@hansmeiser6078]

What about the key error? How to resolve this (beginner)?

[@zachsosana3292]

how would would we go about applying validation styling logic for 'has-danger' (if form submitted without validation), 'has-warning'' (if form field has not been submitted, currently hard coded in ), and 'has-success' (as enter valid input)

[@JeanAlesiagain3]

how can I store values programmatically? e.g.: in a specific Field, when the user types foo, I want to store: { myformname: 'foo', programaticGenVal: 'some value' }

[@usasikh1]

IS there ever a good reason to store local component state? OR should All state reside in Redux Store?

[@WoutMertens]

If you have a component that is a tiny part of your app, and you store its state in Redux, that means you have its code in at least two places, which is a little more work to maintain. That is the tradeoff for all the advantages that stateless apps bring, and most of the time you will be sorry for using local state.

[@JeanAlesiagain3]

Please change the title... Dynamic forms would be if you could add/remove more forms based on user input.

[@GeoffreyHale]

Agreed. And this video hardly had anything to do with Redux Form either. It was just a basic js DRY refactor.

[@rajeevsharma2404]

is it necessary to use combine reducer.. stackoverflow.com/questions/45062928/redux-form-not-working

[@GifCoDigital]

I know this is year old but come on why on earth would you use lodash.

[@aleksandrmatyka3118]

I know that my answer published after 4 year ahah but maybe the reason is that developers dont write custom solution every time or dont waste time to find in utils, especially when team is big and use the same, like eslint for code quality but for functions standartizing

[@GeoffreyHale]

This has basically nothing to do with Redux Form. This was just a basic js DRY refactor.