coding logic - React/Redux - grab inputs from multiple radio button menus using one submit button


#1

hello, do you think it’s a useful idea to create a generator to sequentially cycle through the four radio button groups filtering for each dimension (room size, room shape, pet?, kids?) one at a time upon clicking the single Submit button? Is this an intelligent way of thinking how to collect and filter results?

new to this forum. I’m not even sure this is the place to ask these kinds of questions. I wanted to add a screen shot of the radio button cards but couldn’t figure out how. I tried to drag and drop the image into this field but that didn’t work.

-George


#2

Do you mean generator as in iterator? Like function* myGenerator...? For what you’re describing, it doesn’t seem necessary. Hard to know without more information, but creating a generator doesn’t seem necessary for basic iteration like that.


#3

ok, thanks…maybe the ES6/JS Generator function is overkill


#4

BTW, welcome to the forum :smiley:

And this was a fine place to ask. We don’t seem too terribly strict on organization here, though I will often move things myself if they’re out of place. I wouldn’t worry about it too much. :wink:


#5

thank you! I appreciate it. My next problem is going to be a checkbox problem. It’s tricky because one of my checkboxes has 12 items and a user can check 1, or none, or all, or any combination possible…the problem is, there is over 400 million possible ways of checking 12 boxes and I will have take the user’s selection and match it to the “closest” possible match.

btw, can I post screen shots here?


#6

You should be able to copy and paste images. There is an upload image button as well, so that is definitely possible :slight_smile:


#7

testing


#8

so yeah, I’m wondering what the best coding logic for this is -> The user selects a room type from the pictures (I didn’t label the pics yet)… the left-most pic is bedrooms. The user selects bedrooms and all bedrooms load into state as an array of objects ( state = [{}, {}, {}… ]; ) from the backend (Firebase). The user fills out the radio button forms and hits submit button and I want to return images of bedrooms which match the user’s radio button selection. My original thought was to use a JS Generator function to filter each radio button card sequentially to avoid coming up with some wonky conditional logic statement like some sort of nested ternary statements. I’ve only been coding about 4 months so these types of problems are still a little challenging for me. any suggestions?


#9

Is all the data in firebase? Is there more happening than just pick an option, query firebase, get more options?

And are you intent on using generators? You seem like you’re all about generators :wink: I’m sure we can cram them into whatever you’re doing, but for someone only 4 months in, complications like generators are usually steered clear of.


#10

yeah re firebase. there’s gonna be user subscription/acct info, room-design-attribute info…etc. And yeah, there’s more problems to come. The radio boxes in this room-design “Utility” section are just straight-up filters. But there’s two more sections of user input “Functional” and “Style”… these are all checkboxes. Because a user can check boxes in so many different combinations (like millions!) I don’t look at that as a filter problem – I look at that as a matching algorithm problem. For that I was thinking of setting up a bipartite matrix which reflects the presence and absence of room attributes and using a python script and maximum bipartite matching to match the checkbox input to the “nearest” or “closest” (think Hopcroft Karp algo and Hamming distance) room designs.

haha, but I don’t know yet how to add a Python script to an app stack. I’m assuming/hoping that won’t be too hard to figure out. : /

back to the generator function -->

Also yeah, I’m a little obsessive … and l like to use cool things :slight_smile: and I do reach for things that are above my coding experience level :nerd_face:. But, all seriousness aside , I was thinking to use the JS Generators because I want one filter to resolve and return results before I filter the next group of radio buttons. I thought a JS Generator would be a nice way of “throttling” and sequencing the filtering process.

more info -->

I am working on a prototype of a interior design app for some friends of mine. I’ve taken a bunch of online learning courses and I wanted to build a React/Redux mockup of their site to get better at coding before I circle back around and deal with prototyping my own app Impending Bloom which will be a social impact investing platform. Impending Bloom is a much more complicated app … well, just because for one, it’s an investing platform but also because I want to build a quant-driven visual investing environment using D3. So I have to dig more into D3 pretty soon also.


#11

also fyi (“for yoozguys info”) I hopped into this forum rather than doing Stack Exchange and Overflow becuz I started looking at yoozguys backgrounds and I was like whooaaa…this is like a little micro-cosmos of folks that probably know wtf they are doing.


#12

here are the rest of the “Style” and “Function” radio button and checkbox cards ->

so my thought was to “wrap” this whole sequence of filtering and matching processes in a generator function(s) to have greater control over the sequence in which info is gathered, computed (I mean any computation that needs to be done … esp in the case of the checkboxes), and returned.


#13


#14

I guess what I’m thinking, or what I’m attracted to, is the concept that JavaScript Generators allow us to set up a controlled iteration over different types of data structures. I kind of feel like the generator gives me an over-arching tool with which I can parse and then re-gather up the different filters and matching algorithms in any configuration or grouping that provides the most useful result - matching room designs to users’ needs, style and tastes.


#15

I see a lot more info has been thrown at this but I’m not sure I’m understanding much more :wink: . Going back:

Here, I can see if you are revealing radio button cards individually over time as users make selections, that a generator could help provide you with what’s next. But I’m not sure I’m seeing where additional logic would be needed. Would the next card be dependent on the selections of the prior? The examples you’ve provided don’t seem to show that kind of relation. Also I’m still not sure a generator is necessarily needed here or would instead feel forced. It would come down to the specifics of the implementation.

You should be able to run your python script on the server easily enough, though how depends on your backend and assuming you have enough control in that backend and have the permissions to pull that off. In Node, for example, you can run a python script through spawn.

You’re on point here. This is what generators are good at. But often they can also complicate this task. Again, I think it comes down to the specifics. For me, I generally avoid generators because they tend to overcomplicate things. Where they become useful is value iteration for custom objects, though even then it’s often easier and more useful to simply return that data as an array.


#16

Thank you!!! I appreciate the feedback. ur rt, I am kinda obsessive but also since I’m a newb I think I tend to wanna reach for what I think are cool things. I have to admit that. Most of all I have to be honest with myself. Now, with that said, I gonna build it anyhow :man_mechanic: OR, at least I think I’m gonna build it. I hope it’s not out of my reach.

anyhow, I wanna give this a shot. I have to learn. I will post again when I have some code together and then PLEASE tell me if you think it makes sense or, if like you’ve been warning, I’m unnecessarily complicating things.

a couple additional things though - the output of one set of radio buttons/checkboxes is dependent on previous selections (buttons/boxes) …and with the checkboxes I foresee having to outsource the matching algo to another script in which case I think I’m gonna want control over the whole sequence of when outputs from those scripts are returned before moving on to the next filter/algo.


#17

Yes. Do this. :smiley: I don’t want to dissuade you from using them, though I do want to provide you with any information that you could use to tell whether or not you need them (or at least they’d be worthy of use). The more you use them the more you can see what they offer and how they work. Learn by doing :proud: