Conditional field not working

ggphntms_629278 months ago

7

import { Block } from "payload/types";

export const HeroBlock: Block = {
  slug: "Hero",
  fields: [
    {
      name: "largeHero",
      type: "checkbox",
      defaultValue: false,
    },
    {
      name: "imageUrl",
      type: "text",
      required: true,
    },
    {
      name: "header",
      type: "text",
    },
    {
      name: "copy",
      type: "richText",
      admin: {
        condition: (data) => {
          return data.largeHero;
        },
      },
    },
  ],
};

• 

  tyteen4a038 months ago

  Try the second

  siblingData

  argument

  
  

  
  

  https://payloadcms.com/docs/fields/overview#conditional-logic
• 

  seanzubrickas

  8 months ago

  Hey @gg-phntms are you still having issues with this?

• 

  tylandavis

  8 months ago

  @gg-phntms Like @t4 suggested, you'll want to use

  siblingData

  here.

  data

  is going to give you the whole document, so how you would access fields within the block is going to change depending on where you use the block.

  siblingData

  will be relative to the block itself.

• 

  ggphntms_629278 months ago

  apologies, haven't had the time to test this yet - will get to it this afternoon 🙂

  
  

  
  

  @tylandavis sadly simply replacing

  data

  with

  siblingData

  hasn't done anything (tried with multiple permutations on what's shown in the docs). Is there more that I need to change?

• 

  tylandavis

  8 months ago

  make sure you are passing

  siblingData

  in as the

  second

  argument to the function:

  
  
  

  import { Block } from 'payload/types';
  
  export const HeroBlock: Block = {
    slug: 'Hero',
    fields: [
      {
        name: 'largeHero',
        type: 'checkbox',
        defaultValue: false,
      },
      {
        name: 'imageUrl',
        type: 'text',
        required: true,
      },
      {
        name: 'header',
        type: 'text',
      },
      {
        name: 'copy',
        type: 'richText',
        admin: {
          condition: (data, siblingData) => {
            return siblingData.largeHero;
          },
        },
      },
    ],
  };

• 

  ggphntms_629278 months ago

  It worked!!! Thank you so much. 😄

  
  
  

  Might see if I can update thedocs at some point - that was pretty unintuitive.

• 

  seanzubrickas

  8 months ago

  Glad to hear it @gg-phntms let us know if you needa anything else. Marking this solved.