<p>Using the standard form plugin can you redirect for errors to a id, which works for the submission confirmation (success)?</p>

<pre><code> {{ redirectInput('#contact') }}
</code></pre>

<p>My form is half way down the page so jumps you to the top when it has errors.</p>

<p>Full code:</p>

<pre><code> &lt;div class="cta-section" id="contact"&gt;
  &lt;div id="thanks" role="alert"&gt;
{% if craft.app.session.hasFlash('notice') %}
    &lt;div class="alert-thanks"&gt;&lt;p class="message notice"&gt;&lt;strong&gt;{{ craft.app.session.g*emphasized text*etFlash('notice') }}&lt;/strong&gt;&lt;/p&gt;&lt;/div&gt;
{% elseif craft.app.session.hasFlash('error') %}
    &lt;div class="alert-error"&gt;&lt;p class="message error"&gt;&lt;strong&gt;{{ craft.app.session.getFlash('error') }}&lt;/strong&gt;&lt;/p&gt;&lt;/div&gt;
{% endif %}
&lt;/div&gt;


      {% macro errorList(errors) %}
    {% if errors %}
        &lt;ul class="errors"&gt;
            {% for error in errors %}
                &lt;li&gt;{{ error }}&lt;/li&gt;
            {% endfor %}
        &lt;/ul&gt;
    {% endif %}
{% endmacro %}

{% from _self import errorList %}

&lt;div class="text-left"&gt;
&lt;form method="post" action="" accept-charset="UTF-8" id="form"&gt;
    {{ csrfInput() }}
    &lt;input type="hidden" name="action" value="contact-form/send"&gt;
    {{ redirectInput('#contact') }}

&lt;div class="w-full md:flex "&gt;
    &lt;div class="w-full md:w-1/2 mb-4 md:mr-6"&gt;  

      &lt;h3 class="float-left w-full uppercase"&gt;&lt;label for="from-name"&gt;Name&lt;/label&gt;&lt;/h3&gt;
      &lt;input id="from-name" type="text" name="fromName" class="w-full" value="{{ message.fromName ?? '' }}"&gt;
      {{ message is defined and message ? errorList(message.getErrors('fromName')) }}

    &lt;/div&gt;

    &lt;div class="w-full mb-4 md:w-1/2"&gt;  

      &lt;h3 class="uppercase"&gt;&lt;label for="from-email"&gt;Email&lt;/label&gt;&lt;/h3&gt;
      &lt;input id="from-email" type="email" name="fromEmail" class="w-full" value="{{ message.fromEmail ?? '' }}"&gt;
      {{ message is defined and message ? errorList(message.getErrors('fromEmail')) }}
    &lt;/div&gt;

  &lt;/div&gt;


&lt;div class="w-full clearfix"&gt; 
    &lt;h3 class="uppercase"&gt;&lt;label for="message"&gt;Message&lt;/label&gt;&lt;/h3&gt;
    &lt;textarea rows="5" cols="40" id="message" name="message" class="clearfix"&gt;{{ message.message ?? '' }}&lt;/textarea&gt;
    {{ message is defined and message ? errorList(message.getErrors('message')) }}
  &lt;/div&gt;

    &lt;div class="mt-4 clear text-center"&gt;&lt;input type="submit" value="Send"&gt;&lt;/div&gt;
&lt;/form&gt;


&lt;/div&gt;
&lt;/div&gt;
</code></pre>

CC BY-SA 4.0
2020-05-29T18:00:57.187Z
Where is the HTML element whose id is "contact"?
Kota.M
CC BY-SA 4.0
2020-06-04T12:54:03.350Z
It is wrapped in a <div id="contact"> updated above.
sarah3585
<plugin-contactform>
Contact form plugin - if errors jumps to top of page
# Contact form plugin - if errors jumps to top of page

(Asked by: username_0 on 2020-05-28)

Using the standard form plugin can you redirect for errors to a id, which works for the submission confirmation (success)?
 {{ redirectInput('#contact') }}

My form is half way down the page so jumps you to the top when it has errors.
Full code:
 
  
{% if craft.app.session.hasFlash('notice') %}
    {{ craft.app.session.g*emphasized text*etFlash('notice') }}
{% elseif craft.app.session.hasFlash('error') %}
    {{ craft.app.session.getFlash('error') }}
{% endif %}



      {% macro errorList(errors) %}
    {% if errors %}
        
            {% for error in errors %}
                {{ error }}
            {% endfor %}
        
    {% endif %}
{% endmacro %}

{% from _self import errorList %}



    {{ csrfInput() }}
    
    {{ redirectInput('#contact') }}


      

      Name
      
      {{ message is defined and message ? errorList(message.getErrors('fromName')) }}

    

      

      Email
      
      {{ message is defined and message ? errorList(message.getErrors('fromEmail')) }}
    

  


 
    Message
    {{ message.message ?? '' }}
    {{ message is defined and message ? errorList(message.getErrors('message')) }}

**Tags:** plugin-contactform
> **Comments:**
> **username_1**: Where is the HTML element whose id is "contact"?  
> **username_0**: It is wrapped in a <div id="contact"> updated above.  

---

## 0 answers

