I am using the freeform and subscriber plugins for EE 2 and everything works ok except for one weird problem.
I have created this form http://www.socialiteonline.co.uk/guestlist/
And I want to move the last three fields: message, checkbox and submit button into a column on the right hand side, so that in affect the form is split in two columns.
I used two outer div’s like the example below to achieve this layout however when when I do this the form doesn’t validate and the subscriber checkbox doesn’t kick in and pass the data to campaign monitor. As soon as I remove these wrapper div’s everything works well.
Here is the code, could anyone suggest how I get this layout to work please?
<div class="grid_6">
<h3>Guestlist Sign Up Form</h3>
<p> {exp:freeform:form collection="Guestlist Form" template="guestlist_form" form:id="application-form" required="name|surname|email|phone1" return="contact/thanks-for-getting-in-touch" notify="[email protected]"}<br />
<br />
{exp:subscriber:form form_id="5"}<br />
<br />
<div class="row"><br />
<label for="contact_firstname">First Name: <span>(required)</span></label><input id="contact_firstname" type="text" name="name" tabindex="1" class="half-text text validate[required]" /><br />
</div><br />
<div class="row"><br />
<label for="contact_name">Surname: <span>(required)</span></label><input id="contact_name" type="text" name="surname" tabindex="2" class="half-text text validate[required]" /><br />
</div><br />
<div class="row"><br />
<label for="contact_email">Email Address: <span>(required)</span></label><input id="contact_email" type="text" name="email" tabindex="3" class="half-text text validate[required,custom[email]]" /><br />
</div><br />
<div class="row"><br />
<label for="contact_telephone">Telephone: <span>(required)</span></label><input id="contact_telephone" type="text" name="phone1" tabindex="4" class="half-text text" /><br />
</div><br />
<div class="row"><br />
<label for="contact_events">Event Date: <span>(required)</span></label><input id="contact_events" type="text" name="date" tabindex="5" class="mid-text text validate[required] text-input datepicker" /><br />
</div><br />
<div class="row"><br />
<label for="contact_group">Size of group: <span>(required)</span></label><br />
<input id="contact_group" type="text" name="group_size" class="tiny-text text validate[required,custom[integer]]]" maxlength="2" tabindex="7" /><br />
</div> <br />
<div class="row"><br />
<label for="guestlist_booth">Pick a booth:</label><br />
<select id="guestlist_booth" name="booth" tabindex="3"><br />
<option value=" No Booth Required" selected="selected">- No Booth Required-</option><br />
<option value="VIP Table 1">VIP Table 1</option><br />
<option value="VIP Table 2">VIP Table 2</option><br />
<option value="VIP Table 3">VIP Table 3</option><br />
<option value="VIP Table 4">VIP Table 4</option><br />
<option value="VIP Table 5">VIP Table 5</option><br />
<option value="Side Booth 1">Side Booth 1</option><br />
<option value="Side Booth 2">Side Booth 2</option><br />
<option value="Side Booth 3">Side Booth 3</option><br />
<option value="Cosy Area 1">Cosy Area 1</option><br />
<option value="Alcove 1">Alcove 1</option><br />
<option value="Alcove 2">Alcove 2</option><br />
</select><br />
</div><br />
<br />
</div><br />
<div class="grid_6"><br />
<br />
<div class="row"><br />
<label for="contact_message">Message: <span>(required)</span></label><br />
<textarea tabindex="4" id="contact_message" name="message" class="text validate[required]"></textarea><br />
</div><br />
<div class="row"><br />
<label for="subscribe-newsletter">Subscribe to mailing list</label><br />
<br />
<input type="checkbox" name="subscribe_to_newsletter" value="yes" /><br />
</div></p>
<p> <div class="row"><br />
<button type="submit" name="submit" tabindex="9"><br />
Send Guestlist Request<br />
</button><br />
</div><br />
<br />
{/exp:freeform:form} <br />
<br />
</div>Moved to Community Help forum by Moderator