Help needed for a simple form

Question

I am trying to learn Craft and since I don't know how to create a form with one text area and a button. On the button press, I want to redirect to another html found in the template directory, I am messing around with Craft's contact form to get the desired functionality. I had this code which was working fine:

{% macro errorList(errors) %}
    {% if errors %}
        <ul class="errors">
            {% for error in errors %}
                <li>{{ error }}</li>
            {% endfor %}
        </ul>
    {% endif %}
{% endmacro %}

{% from _self import errorList %}

<form method="post" action="" accept-charset="UTF-8">
    {{ csrfInput() }}
    <input type="hidden" name="action" value="contact-form/send">
    {{ redirectInput('contact/thanks.html?from={fromName}') }}

    <h3><label for="from-name">Your Name</label></h3>
    <input id="from-name" type="text" name="fromName" value="{{ message.fromName ?? '' }}">
    {{ message is defined and message ? errorList(message.getErrors('fromName')) }}

    <h3><label for="from-email">Your Email</label></h3>
    <input id="from-email" type="email" name="fromEmail" value="{{ message.fromEmail ?? '' }}">
    {{ message is defined and message ? errorList(message.getErrors('fromEmail')) }}

    <h3><label for="subject">Subject</label></h3>
    <input id="subject" type="text" name="subject" value="{{ message.subject ?? '' }}">
    {{ message is defined and message ? errorList(message.getErrors('subject')) }}

    <h3><label for="message">Message</label></h3>
    <textarea rows="10" cols="40" id="message" name="message">{{ message.message ?? '' }}</textarea>
    {{ message is defined and message ? errorList(message.getErrors('message')) }}

    <input type="submit" value="Send">
</form>

What I did to only have one textbox and a button, I removed a lot of code:

<form method="post" action="" accept-charset="UTF-8">
    {{ csrfInput() }}
    <input type="hidden" name="action" value="contact-form/send">
    {{ redirectInput('contact/thanks.html?from={fromName}') }}


    <h3><label for="from-email">From</label></h3>
    <input id="from-name" type="text" name="fromName" value="{{ message.fromName ?? '' }}">
    <input type="submit" value="Send">
</form>

My thanks.html has the following code:

<p>Thank you {{ craft.app.request.getQueryParam('from') }} will contact you soon</p>

Before changing the code, the redirect worked fine and I was getting the 'from' replaced after the 'Thank you'. After I changed the code, on pressing the button the page refreshes but nothing happens and it doesn't get redirected to the thanks.html page. Please help.

Also, kindly direct me to the documentation which tells in detail about front end development in Craft as the official documentation is very vague (or seems vague to me :( )

Answer 1

I recommend the tutorial https://craftquest.io/courses/how-to-create-craft-plugin Now, It is free after registration. After 1/2h you have your own plugin with settings and form with controller. Simple, straightforward, with craft form component. Your code is quite messy, try tutorial.