Notification email: separate form lines with ruler

[danielsami]

Hello, I have a form that has 10 lines of 5 column groups.

I want to see the results grouped by column group, with a separator (<hr>?) in between each group.

Please see in the attached screenshot where the red lines are. Those would be the separators I’m talking about.

I researched the forum for this, found nothing, sorry if I overlooked a previous post.

Your support will be greatly appreciated.

Attachments:

You must be logged in to view attached files.

[danielsami]

Hello, for some reason this post has been overlooked, I’m looking forward to a reply.

Thank you.

[Allan]

You don't have permission to view this content. Please log in or register and then verify your purchases to gain access.

[danielsami]

Hi Allan, thank you for your response.

So far, it doesn’t seem to work. I added the class to the base.css before adding it to my custom.css file, but the email sent from the form does not have any line separating the results by group of elements.

My questions:

1-Should I add a <div class=”quform-group-style-plain.quform-group-wrap’></div> at the end of the group html?
2- What exactly to you mean by “plain” group element?

Here’s one of the 10 groups I want to separate in the resulting email, would this be what you call a “plain” group?:

<!-- Begin 5 column Group -->
<div class="quform-group-wrap quform-group-alignment-proportional">
<div class="quform-group-elements">
<div class="quform-group-title-description-wrap">
<div class="quform-group-title">Describe your request below</div>
<p class="quform-group-description">Use one line for each set of curtains</p>
</div>
<div class="quform-group-row quform-group-row-5cols">

<!-- Begin Text input element -->
<div class="quform-element quform-element-text quform-full-width">
<div class="quform-spacer">
<label for="m_width">Width</label>
<div class="quform-input">
<input id="m_width" type="text" name="m_width" />
</div>
</div>
</div>
<!-- End Text input element -->

<!-- Begin Text input element -->
<div class="quform-element quform-element-text quform-full-width">
<div class="quform-spacer">
<label for="m_height">Heigth </label>
<div class="quform-input">
<input id="m_heigth" type="text" name="m_heigth" />
</div>
</div>
</div>
<!-- End Text input element -->

<!-- Begin Single select element -->
<div class="quform-element quform-element-select">
<div class="quform-spacer">
<label for="single_select">Product line </label>
<div class="quform-input">
<select class="quform-tooltip" id="product_line" name="product_line" title="Product line">
<option selected value="">Select line</option>
<option value="Aluminum_Blinds">Aluminum Blinds</option>
<option value="Applause">Applause</option>
<option value="Duette">Duette</option>
<option value="Luminette">Luminette</option>
<option value="Nantucket">Nantucket</option>
<option value="Pirouette">Pirouette</option>
<option value="Roller_Shades">Roller Shades</option>
<option value="Roman_Shades">Roman Shades</option>
<option value="Silhouette">Silhouette</option>
<option value="Skyline">Skyline</option>
<option value="Solera">Solera</option>
<option value="Vertical">Vertical</option>
<option value="Vignette">Vignette</option>
<option value="Wood_Blinds">Wood Blinds</option>
<option value="Woodshutters">Woodshutters</option>
</select>
</div>
</div>
</div>
<!-- End Single select element -->

<!-- Begin Single select element -->
<div class="quform-element quform-element-select">
<div class="quform-spacer">
<label for="single_select">Lift type</label>
<div class="quform-input">
<select class="quform-tooltip" id="lift" name="lift" title="Lift type">
<option selected value="">Select lift </option>
<option value="Manual">Manual</option>
<option value="Motorized">Motorized</option>
</select>
</div>
</div>
</div>
<!-- Begin Single select element -->
<div class="quform-element quform-element-select">
<div class="quform-spacer">
<label for="opacity">Opacity</label>
<div class="quform-input">
<select class="quform-tooltip" id="opacity" name="opacity" title="Opacity">
<option selected value="">Select opacity</option>
<option value="semi_sheer">Sheer</option>
<option value="privacy">Semi-sheer</option>
<option value="room_darkening">Privacy</option>
<option value="block_out">Room darkening</option>
<option value="">Block out</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End 5 column Group -->

Finally, can I PM the url? How?

Thank you,

Daniel

[Ally]

You don't have permission to view this content. Please log in or register and then verify your purchases to gain access.

[danielsami]

Thank you, it worked very well, just what I needed. I just changed the style a little:

<?php if (in_array($element->getName(), array('m_width_2', 'm_width_3', 'm_width_3', 'm_width_4', 'm_width_5', 'm_width_6', 'm_width_7', 'm_width_8', 'm_width_9', 'message'))) : ?>
<tr>
<td colspan="2"><div style="height:1px; background:#717171; border-bottom:1px solid #313030;"></div></td>
</tr>
<?php endif; ?>

Cheers,

Daniel

[Author]

Posts