Relative Content

Tag Archive for next.jsreact-hook-formzodshadcnuinextjs14

nextjs server action to enable second form field to only display results after first input is set

I use a combination of several libraries to create a form, namely react hook form, zod, shadcn ui and the nextjs framework. My form has two fields for input that retrieve values from a database call, the first field is called it_service and the second is called technology_version . What I wish to have is to have the technology_version disabled at first, it will only be enabled after the user has selected a value for it_service. Furthermore the database call to retrieve the possible values for technology_version should be based on the input value of it_service by the user. So for example if the user selects ABC as the value of it_service then the server action should be something of that nature in SQL select distinct technology_version from table where it_service = ABC. With that the user can only select technology_version for which the it_service is ABC. Here is my code so far.