search

felixarntz / bootstrap-for-contact-form-7

This plugin modifies the output of the popular Contact Form 7 plugin to be styled in compliance with themes using the Bootstrap CSS framework.
https://wordpress.org/plugins/bootstrap-for-contact-form-7/
GNU General Public License v2.0
24 stars 18 forks source link

Multi-column form with mandatory fields #45

Closed javornikolov closed 6 years ago

javornikolov commented 7 years ago

I'm trying to adapt an example given at https://wordpress.org/plugins/bootstrap-for-contact-form-7/other_notes/ about multi-column forms. The only change I have is that I'm trying to declare the fields as mandatory by adding * to the short-codes:

<div class="form-group row">
    <div class="col-md-6"><label for="user-first-name">First Name</label>[text* user_first_name id:user-first-name layout:none][/text*]</div>
    <div class="col-md-6"><label for="user-last-name">Last Name</label>[text* user_last_name id:user-last-name layout:none][/text*]</div>
</div>

The issue I have is that the fields are displayed as non-mandatory ones. And when not filled in - the error messages are not displayed, nor fields are marked as failed.

gidomanders commented 6 years ago

The additional settings, such as layout, should be defined in the Additional Settings tab of the form, not on the fields. Also when you want a label to show up correctly, you have to put the label in between the shortcodes. So your form should look like this:

<div class="form-group row">
    <div class="col-md-6">[text* user_first_name id:user-first-name]First Name[/text*]</div>
    <div class="col-md-6">[text* user_last_name id:user-last-name]Last Name[/text*]</div>
</div>