Hi. I've built my own webform on a page within partials and am looking to either clear the form after it has successfully sent or hide the form. I'd rather hide it but clearing it would be good.

Heres these code for the page and partial::

url = "/contact"
layout = "default"
title = "Bookings and Contact"
meta_title = ""

==
<?php

    function onStart()
    {
        $this['showForm'] = true;
    }

    function onSend()
    {

        $rules = ['full_name' => 'required', 'email' => 'required|email', 'spam' => 'required'];
        $validator =  Validator::make(Input::all(), $rules);

        if ($validator->fails()) {

            $this['result'] = 'Please make sure you have filled in the form correctly';

        } else {
            if(Input::get('spam') == 8) {

                Mail::send('contact::form', Input::all(), function($message) {
                    $message->to('email@email.com', 'Something cool');
                    $message->from('email@email.com', 'Something cool');
                    $message->subject('Web-form submission!');
                    $message->replyTo(Input::get('email'), Input::get('full_name'));
                });

                $this['result_success'] = 'Your enquiry has been sent! We will get in touch with you shortly...';

            } else {
                $this['result'] = 'Anti spam is incorrect!!! ';
            }
        }

    }

?>

==
<div class="w-full bg-no-repeat bg-cover bg-fixed sm:bg-cover md:bg-contain lg:bg-contain  bg-center"
     style="background-image: url('{{ url('storage/app/media/header.svg') }}')">

    <div class="py-10">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-3xl mx-auto bg-white bg-opacity-75">

                <h2 class="text-3xl sm:text-3xl md:text-4xl lg:text-5xl font-subtitle font-semibold text-grade-blue tracking-wide text-center">
                    Parent/Student General Enquiries
                </h2>

                {% if showForm %}
                    {% partial "contact-form" %}
                {% endif %}
            </div>
        </div>

    </div>
</div>

<form data-request="onSend"
      data-request-update="result: '#result'"
      data-request-flash
      class=" mx-0 px-0 sm:mx-0 sm:px-0 md:mx-10 md:px-10 lg:mx-10 lg:px-10 mt-5">

    <p class="mb-5">
        <span class="text-red-600 text-sm">* required fields</span>
    </p>

    {% partial "result" %}

    {{ form_token() }}

    <div id="form">

        <div>
            <label for="subjects" class="block text-sm font-medium text-gray-700">
                Subjects
            </label>
            <select id="subjects"
                    name="subjects"
                    class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-grade-pink
                                focus:border-grade-pink sm:text-sm rounded-md">
                <option value="not selected" selected>
                    Please Select
                </option>
                <option value="Biology">
                    Biology
                </option>
                <option value="Chemistry">
                    Chemistry
                </option>
                <option value="Physics">
                    Physics
                </option>
                <option value="Combined Science">
                    Combined Science
                </option>
            </select>
        </div>

        <div class="mt-5">
            <label for="options" class="block text-sm font-medium text-gray-700">
                Options
            </label>
            <select id="options"
                    name="options"
                    class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-grade-pink
                                focus:border-grade-pink sm:text-sm rounded-md">
                <option value="not selected" selected>
                    Please Select
                </option>
                <option value="Online Tuition">
                    Online Tuition
                </option>
                <option value="In-person Tuition">
                    In-person Tuition
                </option>
                <option value="Home Schooling">
                    Home Schooling
                </option>
            </select>
        </div>

        <div class="mt-5">
            <label for="levels" class="block text-sm font-medium text-gray-700">
                Levels
            </label>
            <select id="levels"
                    name="levels"
                    class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-grade-pink
                                focus:border-grade-pink sm:text-sm rounded-md">
                <option value="not selected" selected>
                    Please Select
                </option>
                <option value="KS3">
                    KS3
                </option>
                <option value="KS4 (GCSE)">
                    KS4 (GCSE)
                </option>
                <option value="Higher / Foundation">
                    Higher / Foundation
                </option>
                <option value="Year 11 Study Leave  ">
                    Year 11 Study Leave
                </option>
            </select>
        </div>

        <div class="mt-5">
            <label for="full_name" class="block text-sm font-medium text-gray-700">
                Full Name <span class="text-red-600 text-sm">*</span>
            </label>
            <div class="mt-1">
                <input type="text" name="full_name" id="full_name" class="mt-1 pl-3 pr-10 py-2 shadow-sm border focus:ring-grade-pink
                            focus:border-grade-pink block w-full sm:text-sm border-gray-300 rounded-md"
                       placeholder="Joe Bloggs">
            </div>
        </div>

        <div class="mt-5">
            <label for="email" class="block text-sm font-medium text-gray-700">
                Email <span class="text-red-600 text-sm">*</span>
            </label>
            <div class="mt-1">
                <input type="email" name="email" id="email"
                       class="mt-1 pl-3 pr-10 py-2 shadow-sm border focus:ring-grade-pink focus:border-grade-pink block w-full sm:text-sm border-gray-300 rounded-md"
                       placeholder="you@example.com">
            </div>
        </div>

        <div class="mt-5">
            <label for="enquiry" class="block text-sm font-medium text-gray-700">Your Enquiry</label>
            <div class="mt-1">
            <textarea rows="5" name="enquiry" id="enquiry"
                      class="mt-1 pl-3 pr-10 py-2 shadow-sm border focus:ring-grade-pink focus:border-grade-pink block w-full sm:text-sm border-gray-300 rounded-md"></textarea>
            </div>
        </div>

        <div class="mt-5">
            <label for="hear_about_us" class="block text-sm font-medium text-gray-700">
                Where did you hear about us
            </label>
            <select id="hear_about_us"
                    name="hear_about_us"
                    class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-grade-pink
                                focus:border-grade-pink sm:text-sm rounded-md">
                <option value="not selected" selected>
                    Please Select
                </option>
                <option value="Google">
                    Google
                </option>
                <option value="Linkedin">
                    Linkedin
                </option>
                <option value="Instagram">
                    Instagram
                </option>
                <option value="Twitter">
                    Twitter
                </option>
                <option value="Facebook">
                    Facebook
                </option>
                <option value="Recommendation">
                    Recommendation
                </option>
                <option value="Other">
                    Other
                </option>
            </select>
        </div>

        <div class="mt-5">
            <label for="spam" class="block text-sm font-medium text-gray-700">
                What is 5+3? <span class="text-red-600 text-sm">*</span>
            </label>
            <div class="mt-1">
                <input type="text" name="spam" id="spam"
                       class="mt-1 pl-3 pr-10 py-2 shadow-sm border focus:ring-grade-pink focus:border-grade-pink block w-full sm:text-sm border-gray-300 rounded-md"
                       placeholder="">
            </div>
        </div>

        <button type="submit"
                data-attach-loading
                class="mt-5 flex justify-between items-center border border-transparent rounded-lg text-white bg-grade-blue px-4
                            py-2 hover:text-grade-blue hover:bg-white hover:border-grade-blue">
            Send Enquiry
        </button>
    </div>

</form>

Any help or direction would be grateful...

Cheers

Hello, here is a working example.

pages/test.htm

url = "/test"
layout = "default"
==
<?php
    function onStart()
    {
        $this['success'] = null;
    }

    function onSend()
    {
        // Validation pass
        if (Input::get('spam') == 8) {
            $this['success'] = true;
            $this['message'] = 'Successful post';
        }
        // Validation failed
        else {
            $this['success'] = false;
            $this['message'] = 'Anti spam wrong';
        }
    }
?>
==
<h2>
    Parent/Student General Enquiries
</h2>
<div id="contactForm">
    {% partial "contact-form" %}
</div>

partials/contact-form.htm

{% if message %}
    <div style="color: {{ success ? 'green' : 'red' }}">
        {{ message }}
    </div>
{% endif %}

{% if not success %}
    <form data-request="onSend"
        data-request-update="'contact-form': '#contactForm'"
        data-request-flash>

        {{ form_token() }}

        <div id="form">
            <label for="spam">
                What is 5+3?
            </label>

            <input type="text" name="spam" id="spam" placeholder="">

            <button type="submit">
                Send Enquiry
            </button>
        </div>

    </form>
{% endif %}