From 5144c41bf386d831a7a312c82ed97b54c6a828b4 Mon Sep 17 00:00:00 2001 From: cagataycivici Date: Thu, 23 May 2019 16:30:37 +0300 Subject: [PATCH] Two way binding support to Fieldset --- src/components/fieldset/Fieldset.vue | 1 + src/views/fieldset/FieldsetDoc.vue | 15 +++++++++++++++ 2 files changed, 16 insertions(+) diff --git a/src/components/fieldset/Fieldset.vue b/src/components/fieldset/Fieldset.vue index fc0adb45f..aa7ef01e9 100644 --- a/src/components/fieldset/Fieldset.vue +++ b/src/components/fieldset/Fieldset.vue @@ -36,6 +36,7 @@ export default { methods: { toggle(event) { this.d_collapsed = !this.d_collapsed; + this.$emit('update:collapsed', this.d_collapsed); this.$emit('toggle', { originalEvent: event, value: this.d_collapsed diff --git a/src/views/fieldset/FieldsetDoc.vue b/src/views/fieldset/FieldsetDoc.vue index dc90f9a62..783f35eb0 100644 --- a/src/views/fieldset/FieldsetDoc.vue +++ b/src/views/fieldset/FieldsetDoc.vue @@ -39,6 +39,21 @@ import Fieldset from 'primevue/fieldset'; Through Michael's life the nature of the family business becomes clear. The business of the family is just like the head of the family, kind and benevolent to those who give respect, but given to ruthless violence whenever anything stands against the good of the family. </Fieldset> + + +

To control the initial state of the toggleable panel, use the collapsed property.

+ +<Fieldset legend="Header Text" :toggleable="true" :collapsed="true"> + Content +</Fieldset> + + +

Use the sync operator to enable two-way binding.

+ +<button type="button" @click="isCollapsed = !isCollapsed">Toggle Programmatically</button> +<Fieldset legend="Header Text" :toggleable="true" :collapsed.sync="isCollapsed"> + Content +</Fieldset>

Properties