javascript - How to validate dynamic field name using react and yup

0
votes

I'm trying to have yup validation on my form.

The form has to have at least one checkbox selected.

The problem that I have multiple checkboxes with dynamic names.

For example, I have an array that looks something like that :

const data = [
 {_id: '4d3143f12a54s2', service: 'some service 1'},
 {_id: '432gtre52341dd', service: 'some service 2'},
];

inside the React component, I'm looping over him like:

 // ....

 const SomeComponent = () => {
   // ...

   return (
    <form ......>
     {data.map((i) => {
       return (
               <Checkbox 
                name={i._id} 
                label={i.service} 
                ......... 
               />
              );
     })}
   </form>
   )
 }

// ...

I'm trying to know if at least one of the checkboxes is checked. How can I do that?

/* How can I know what is my fields name like that & How can I know at least one of 
   they are selected?
*/
const someSchema = yup.object().shape({

});
javascriptreactjsvalidationyup
How are you obtaining the object that you want to validate? – Ace
The data is coming from the DB with Axios fetch request. Inside the array, each object has _id + service. I loop through the array inside the component. Each service is representing a checkbox and his name is unique _id. – Netanel Vaknin
You're not validating the data from the db though right? You're validating the form inputs. How are you getting the form data? – Ace