PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Form losing styles on submit / error state

  1. Hi,

    I recently implemented gravity forms on our website (which works really well for us). I did notice that if we submit a form incorrectly and the form highlights all the errors they also lose some styling (drop downs and submit button).

    I've tried to fix this but it looks as if the html changes and it loses the span? Can anyone help me with this?

    <div class="gform_footer top_label">
    <input type="submit" tabindex="9" value="Download The Intranet Report" class="button gform_button" id="gform_submit_button_15">
    
    <div class="gform_footer top_label">
    <div class="button" id="uniform-gform_submit_button_15" style="-moz-user-select: none;">
    <span>Download The Intranet Report<input type="submit" tabindex="9" value="Download The Intranet Report" class="button gform_button" id="Submit1" style="opacity: 0;"></span>
      </div>

    Thanks guys

    Posted 12 years ago on Tuesday July 12, 2011 | Permalink
  2. Can you post a URL to your form? I'm not going to be able to debug it with just the information above.

    Also, can you confirm that your form works/validates properly in the preview page?

    Posted 12 years ago on Tuesday July 12, 2011 | Permalink
  3. Thanks for the quick response...

    http://www.interact-intranet.com/contact-us/ (example form).

    The forms work properly and validates.

    The form preview itself does not have the correct styling at all (I've not used that yet).

    Does this help?

    Posted 12 years ago on Tuesday July 12, 2011 | Permalink
  4. So, this isn't a default form styling issue apparently, it's related to a third party js script you're using for styling the form.. http://uniformjs.com/

    I'm sure this is related to the script and the ajax implementation on the form. The script replaces content, images, styles, etc. on the document load and when the form is submitted via ajax the document does not reload and therefore the new form elements don't get the shiny new styles. If you turn off the ajax submission method, you'll probably see that it works just fine.

    You'll have to either ditch the ajax submission if you want that to work, or use something like this to reload the script for validation errors.

    http://www.gravityhelp.com/forums/topic/call-javascript-function-upon-validation-error

    Posted 12 years ago on Tuesday July 12, 2011 | Permalink
  5. Thanks for your help with this Kevin muchos appriciated

    Posted 12 years ago on Tuesday July 12, 2011 | Permalink

This topic has been resolved and has been closed to new replies.