Sanity Pioneers: Get early access to betas, extra AI credits, and a direct line to the engineering team. Apply now

Show/Hide Field Based on Boolean in Sanity - How Does It Work?

11 repliesLast updated: Nov 29, 2025

hi all !i'm new to sanity. this is so amazing to learn.

here is my question,

i need a text field to show and hide based on a boolean.
i changed a bit of code from
user A "Conditional validation of string" and i endup with the below code and it worked.but i need to understand how this work. can someone please explain this to me.
if you have a better solution for this i also like to hear them too. thnx

{
name: "flag",
title: "Show or Hide",
type: "boolean",
},
{
name: "entry",
type: "string",
title: "Entry",
hidden: ({document}) => !document.flag
},
AI Update

Great question! Your code is working perfectly, and you've actually discovered one of Sanity's most useful features - Conditional Fields. Let me break down exactly how it works:

How Your Code Works

{
  name: "flag",
  title: "Show or Hide",
  type: "boolean",
},
{
  name: "entry",
  type: "string",
  title: "Entry",
  hidden: ({document}) => !document.flag
}

The hidden property accepts a callback function that determines whether the field should be hidden. This function:

So your "entry" field appears when the checkbox is checked, and disappears when unchecked!

Other Useful Patterns

The callback function gives you access to several parameters you can use:

hidden: ({parent, document, value, currentUser}) => {
  // parent - the parent object (useful in nested fields)
  // document - the entire document
  // value - the current field's value
  // currentUser - info about who's editing
}

Example with multiple conditions:

{
  name: "specialContent",
  type: "text",
  hidden: ({document}) => document.contentType !== 'premium' || !document.isPublished
}

Example using parent (for fields inside objects):

{
  name: 'videoUrl',
  type: 'url',
  hidden: ({parent}) => parent?.mediaType !== 'video'
}

Pro Tip: Conditional Validation

If you ever need a field to be required only when visible, combine conditional fields with conditional validation:

{
  name: "entry",
  type: "string",
  hidden: ({document}) => !document.flag,
  validation: (Rule) => Rule.custom((value, context) => {
    if (context.document?.flag && !value) {
      return 'Entry is required when flag is checked'
    }
    return true
  })
}

Your solution is actually the recommended approach - clean, simple, and exactly how Sanity intended conditional fields to work. Welcome to Sanity, and happy building! 🎉

Show original thread
11 replies

Was this answer helpful?

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.

Related contributions