Storyblok Raises $80M Series C - Read News

What’s the True Total Price of Enterprise CMS? Find out here.

Skip to main content

Can I create conditional fields or logic?

hint:

Storyblok offers a built-in feature for conditional fields.

If the built-in feature is not enough you can use our custom field types allowing you to build complete custom field elements for your editors. We prepared a simple example on such a conditional field for you.

const Fieldtype = {
  mixins: [window.Storyblok.plugin],
  template: `<div>
  <div class="uk-form-label">Do you have a headset?</div>
  <label><input type="radio" v-model="model.has_headset" :value="true" /> Yes</label>
  <label><input type="radio" v-model="model.has_headset" :value="false" class="uk-margin-small-left" /> No</label>
  <div v-if="model.has_headset" class="uk-margin-small-top">
    <div class="uk-form-label">How many?</div>
    <input class="uk-width-1-1" v-model="model.number_of_headsets" type="number" />
  </div>
</div>`,
  methods: {
    initWith() {
      return {
        plugin: 'example_plugin',
        has_headset: false,
        number_of_headsets: 0
      }
    },
    pluginCreated() {
      
    }
  },
  watch: {
    'model': {
      handler: function (value) {
        this.$emit('changed-model', value);
      },
      deep: true
    }
  }
}