From 579d271b5c42d58be026221241a8691a355e68ff Mon Sep 17 00:00:00 2001
From: Norman Radtke <norman.radtke@gmail.com>
Date: Tue, 20 Aug 2024 15:54:26 +0200
Subject: [PATCH] Add method to serialize turtle from shacl-form.

---
 src/views/FormDemo.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/views/FormDemo.vue b/src/views/FormDemo.vue
index 133d8fa..06c514e 100644
--- a/src/views/FormDemo.vue
+++ b/src/views/FormDemo.vue
@@ -14,7 +14,7 @@
           SHACL shapes can be defined on the attribute 'data-shapes'
           or can be loaded by setting attribute 'data-shapes-url'
         -->
-        <shacl-form v-bind:data-shapes="shapeTurtle" v-bind:data-values="dataTurtle"></shacl-form>
+        <shacl-form @change="getFormTurtle" ref="myform" data-submit-button data-generate-node-shape-reference data-show-node-ids v-bind:data-values="dataTurtle" v-bind:data-shapes="shapeTurtle"></shacl-form>
       </div>
     </pane>
     <pane size="30">
@@ -85,6 +85,13 @@ export default {
     }
   },
   methods: {
+    getFormTurtle (event) {
+      const form = this.$refs.myform
+      if (event.detail?.valid) {
+        const triples = form.serialize()
+        console.log('entered form data', triples)
+      }
+    },
     async getResource () {
       this.subject = rdf.namedNode(this.resource_iri)
       const resourceData = await this.store.getResource(this.resource_iri)