How to Require a Field Conditionally with Custom Validation

3 replies
Last updated: Aug 26, 2021
Hey folks, is it possible to require a field conditionally? In my case I am using the Conditional Fields feature to hide/show a reference field and I would like the reference field to be a required field but only if isSubDepartment is truthy.

export default {
  title: 'Department Type',
  name: 'deptType',
  type: 'object',

  fields: [
    {
      name: 'isSubDepartment',
      title: 'Sub-Department',
      type: 'boolean',
      initialValue: true,
      description:
        'If this option selected, you will be asked to designate the "parent" department',
    },

    {
      name: 'parentDepartment',
      title: 'Parent Department',
      type: 'reference',
      to: [{ type: 'departments' }],
      options: {
        filter: 'isSubDepartment == $isSubDepartment',
        filterParams: { isSubDepartment: false },
      },
      hidden: ({ parent }) => !parent?.isSubDepartment,
      // HOW CAN I MAKE THIS VALIDATION RULE CONDITIONAL (i.e. required only if isSubDepartment is truthy?)     
      validation: (Rule) => Rule.required(),
    },
  ],
}
Aug 26, 2021, 4:11 PM
I haven’t really caught up with the excitement around conditional fields yet, but… I think you could do it with a custom validation something like this:
(Rule) => Rule.custom((parentDepartment, context) => context.document.isSubDepartment && parentDepartment === undefined ? "Parent department required for sub-departments" : true)

Check out durationInMinutes example on
https://www.sanity.io/docs/validation#1d8eb8fbb695
Aug 26, 2021, 4:27 PM
user F
That solution works brilliantly. Thank you so much!!
Aug 26, 2021, 4:44 PM
Great 🎉
Aug 26, 2021, 4:49 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?