Display errors at top of page?

We've discussed how to improve this behavior and will implement something in a future release to make this a little more user friendly.

I did a little tinkering with some jQuery and came up with a solution that might work for you.. nothing overly fancy, but it works pretty well.

This is actually a variation of the code referenced in the post above. It includes support for the absolutely positioned form confirmation text, as well as an absolutely positioned validation error message.

You can put this snippet into a page template or inside the < head > of your header.php file - it's up to you.

<!-- call the jQuery library if not already loaded in theme -->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<!-- the function to show the error notice or the fading confirmation notice at top of page -->

<script type="text/javascript">
  $(document).ready(function(){
   setTimeout(function(){
  $("#gforms_confirmation_message").fadeOut("slow", function () {
  $("#gforms_confirmation_message").remove();
      });

}, 3000);

  $(".validation_error").before("<div id='gforms_error_alert'>there was a problem with your submission. <a href='#myform'>Please fix the errors</a> and resubmit the form.</div>");
  $(".validation_error").after("<a name='myform'></a>");

 });
</script>

We're basically adding a new div for the error alert and an anchor just above the form to link the alert to.

Here's a copy of the page template I used for my quick test.

Also, you can watch this short video to see it in action.

Of course, you can style everything to suit your theme, but that should get you pointed in the right direction for now.

We added a filter to add an anchor to the form a couple of versions back now. You can find out how to add that at the link below.

Basically, you add the filter, then the form returns to the anchor if the validation fails.. wherever the form is in the page.

http://forum.gravityhelp.com/topic/redirect-after-failed-form-redirect-to-page-w-anchor#post-9592