Pricing Blog

Creating a generic form

  • _.__._.__.__._-1405944889262473287

    Ethan

    13 days ago

    What is the best way to achieve the following:

    I'm creating a generic form component that takes in a JSON schema and builds the form from that. I've successfully managed to build the form using repeated <input> elements, but I am struggling with collecting the form data on submission.

    I have a form-values variable, which is submitted with my component's submit trigger (triggered by the submit button's click trigger), but the issue is getting the values from each input field and storing them nicely as JSON in the form-values variable. Initially I was just appending the data sent by each input field's change event, but that gets messy if the user enters each field more than once. A workaround would be to store form-values as a dictionary, and search through the dictionary when getting the value from the change event. But that seems messy.

    I'm very new to NordCraft so I'm wondering if there is something obvious I have missed. I can't see any way to cleanly expose a child component's variable to its parent, so I'm a bit stuck.

    Any suggestions? Thanks in advance!
    1
  • Tod-1405944891556495543

    Tod

    13 days ago

    Great job @Ethan! Your contribution to the Nordcraft Community just made you advance to Community Level 1! 🌲
  • lucasg-1405946048769163275

    Lucas G

    13 days ago

    Use Set
  • lucasg-1405946770646761534

    Lucas G

    13 days ago

    For example if your form JSON looks something like this:
    [
    {"label": "First name",
    "placeholder": "Ethan",
    "type": "text",
    "value": null
    },
    {"label": "Last name",
    "placeholder": "Nordcraft",
    "type": "text",
    "value": null
    }
    ]

    Then you can use the Set node to set your form-values variable
  • _.__._.__.__._-1405946963475566732

    Ethan

    13 days ago

    Yes that is what I need. Thank you!
    👍1
  • (I definitely haven't spent 2 hours on this)
  • lucasg-1405947397342888136

    Lucas G

    13 days ago

    1405947396541644982-image.png
  • Something like that
  • _.__._.__.__._-1405950753616564234

    Ethan

    13 days ago

    Thats perfect, Thank you