Watch a live product demo 👀 See how Sanity powers richer commerce experiences

Define a Default Value for an Array of Items as a String with a Radio Layout

7 replies
Last updated: Apr 11, 2021
Is there a way to define a default value for an array of items as a
string
with a
radio
layout?
type: 'string',
options: {
    layout: 'radio',
    list: [
        { title: 'Left', value: 'left', default: true }, // here?
        { title: 'Right', value: 'right' }
    ],
}
Apr 11, 2021, 6:29 PM
You’ll want to set the default using the
initialValue
object, which goes outside of
fields[]
. Assuming your
string
is called list, you can set its
initialValue
to the value of the radio button you want selected:

fields: [
  {
    name: 'list',
    type: 'string',
    options: {
      layout: 'radio',
      list: [
        { title: 'Left', value: 'left' },
        { title: 'Right', value: 'right' },
      ],
    }
  },
],
initialValue: {
  list: 'left'
}
Apr 11, 2021, 7:18 PM
Hm ok, interesting!
Apr 11, 2021, 7:22 PM
I've tried it on my field but it doesn't seem to work
export default {
    name: 'project_screenshots',
    title: 'Screenshots',
    type: 'object',
    fields: [
        {
            name: 'type',
            title: 'Screenshot type',
            type: 'string',
            options: {
                list: [
                    { value: 'stack', title: 'Stacked' },
                    { value: 'two-cols', title: 'Two columns' },
                ],
                layout: 'radio',
                direction: 'horizontal',
            },
            initialValue: {
                list: 'left'
            },
            preview: {
                prepare ({ title }) {
                    return {
                        title: title.value
                    }
                }
            }
        },
Apr 11, 2021, 7:23 PM
initialValue
will need to be a sibling of
fields[]
.
Apr 11, 2021, 7:24 PM
Oh, ok. Does it work with multiple fields in an object tho?
Apr 11, 2021, 7:24 PM
I have multiple sets of "radios" fields in the same object
Apr 11, 2021, 7:24 PM
I don’t believe
initialValue
can be set on items in an object. https://github.com/sanity-io/sanity/issues/1581
It may be possible using
Initial Value Templates . I’ll have to give it a try later.
Apr 11, 2021, 8:13 PM

Sanity.io – build remarkable experiences at scale

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

Categorized in

Related answers

Get more help in the community Slack

TopicCategoriesFeaturedRepliesLast Updated
After adding the subtitle and running this code npm run graphql-deploy It does nothingSep 15, 2020
how to limit a reference to just one entry in Studio reference input side versus the default as-many-entries-as-you-fill-in-an-array...Sep 18, 2020
Is it possible to fetch more than one "_type" using GROQ?Nov 2, 2020
I want to add a view with the Structure builder (S.view.component) where I list similar documents based on the title. What...Sep 23, 2020
Is there a structure builder example where the format of each preview for the document list is modified?Feb 3, 2021
I have an array of references to a country schema type but it always just returns NULL values for meJan 30, 2021
Hi, I need help with a query for getting the url of an image asset. Here is what I've been trying, but I only get the _ref...Dec 1, 2020
Sanity UI looks brilliant :smiley: Is something like the current date picker possible at the moment? I’m not sure if anicon...Dec 21, 2020
Hey everyone. I have been coding and may have potentially accidentally deleted something. Does anyone know how to resolve...Dec 26, 2020
Hello everyone and happy new year :raised_hands::skin-tone-2:, I have a problem with outputting Portable Text :disappointed:...Jan 1, 2021

Related contributions

Clean Next.js + Sanity app
- Template

Official(made by Sanity team)

A clean example of Next.js with embedded Sanity ready for recomposition.

Cody Olsen
Go to Clean Next.js + Sanity app

Blog with Built-in Content Editing
- Template

Official(made by Sanity team)

A Sanity-powered blog with built-in content editing and instant previews.

Go to Blog with Built-in Content Editing