Check if field is hidden to conditionally make it required

18 replies
Last updated: Jun 1, 2022
Is there any way of checking whether a field is
hidden
for making it required if it isn't?

document
doesn't seem to contain any value regarding the
hidden
status of a field.
AI Update

I can see you're trying to conditionally validate a field based on whether it's hidden or not. Unfortunately, there's no built-in way to check if a field is currently hidden within validation rules. The document object available in validation doesn't include the computed hidden state of fields.

However, you can work around this by replicating the same condition logic in both your hidden callback and your validation rule. Here's the pattern:

{
  name: 'myField',
  type: 'string',
  hidden: ({parent}) => parent?.linkType !== 'internal',
  validation: (Rule) =>
    Rule.custom((currentValue, {parent}) => {
      // Replicate the same condition from hidden
      const isVisible = parent?.linkType === 'internal';
      
      // Only require if visible
      if (isVisible && !currentValue) {
        return 'This field is required';
      }
      return true;
    })
}

The key insight is that both hidden and validation receive similar context objects (parent, document, value), so you can evaluate the same conditions in both places.

Alternative: Extract the condition

To keep your code DRY and maintainable, you can extract the condition into a helper function:

const isInternalLink = (parent) => parent?.linkType === 'internal';

{
  name: 'myField',
  type: 'string',
  hidden: ({parent}) => !isInternalLink(parent),
  validation: (Rule) =>
    Rule.custom((currentValue, {parent}) => {
      if (isInternalLink(parent) && !currentValue) {
        return 'This field is required';
      }
      return true;
    })
}

This approach is mentioned in the Sanity docs on conditional fields and discussed in this community answer. While it requires duplicating the logic, it ensures your validation stays in sync with your visibility rules.

Show original thread
18 replies
Considering you know the logic about the hidden field, do you need to check if it’s hidden at all? Can’t you apply the same logic for your validation?
Would a required hidden field still be required?
Pretty sure it would.
Then I would need to know if it is hidden. Or I could conditionally make it required if the other field is empty.
For context, this is basically about conditional fields for a link type: internalLink & externalLink
I could make both required if both are empty. And make the hidden one not required if the other one has content.
Ah I see. Yes that makes sense.
But that might lead to a bit of confusion as both would be shown as required if none is provided. Although that might be compensated with a custom validation message.
Seems they are staying required even if hidden.
Having a boolean exposed on children of
document
would be awesome.
I can actually see a
hidden
field there but I think it refers to something else?
Content:
ref => {
      var parent = _ref.parent;
      return (parent === null || parent === void 0 ? void 0 : parent.linkType) !== "external";
That should simply be my current hidden condition function. Hm. Could I execute this check as well in the validation function and get a boolean back?
As I would be working with
refs
, I would need to use the
sanity.client
, but this seems to be only the function, so I would still need to get access to it as well.
I think I will give the "isItEmpty" check a shot first.
Actually you are right. I can also check using the same logic for validation. I make it required depending on the selected linkType.
Thank you for the help,
user F
! 🙂
Yay! Glad you got it. 😊
The solution for future generations:

validation: (Rule) =>
        Rule.custom((currentValue, { parent }) => {
          return parent?.linkType === "internal" && !currentValue
            ? "A link value is required."
            : true
        }),

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Was this answer helpful?