sage-html-forms icon indicating copy to clipboard operation
sage-html-forms copied to clipboard

Form validation is broken

Open tombroucke opened this issue 3 years ago • 1 comments

HTML Forms' validation is based on the form's post meta. When a form is saved in the WP backend, the required & e-mail fields are serialized & saved to _hf_settings. The required fields are extracted with JS from the #hf-form-editor field, which is populated by the post content.

A possible solution would be to ask the HTML forms plugin creator to add a filter to functions.php:100 return $form;, so we can inject our form code (everything inside the

tag). A small tweak to our sage-html-forms/resources/views/components/html-forms.blade.php is needed, so it is similar the original output:
<form {!! $attributes->merge($form->attributes) !!}>
  <input type="hidden" name="_hf_form_id" value="{{ $form->ID }}" />
  <div style="display: none;">
    <input type="text" name="_hf_h{{ $form->ID }}" value="" />
    {!! $hidden !!}
  </div>
  <div class="hf-fields-wrap">
    {!! $slot !!}
    <noscript>Please enable JavaScript for this form to work.</noscript>
  </div>
</form>

tombroucke avatar Jun 30 '22 06:06 tombroucke

I don't have a solution for this inside of the package but take a look at https://gist.github.com/Log1x/35f3f1f20e430d6a36a0c2e8e8f13ffc if you want to manually add form validation. It also includes an example for implementing Google reCAPTCHA.

Log1x avatar Nov 29 '22 20:11 Log1x