Forum

Thread tagged as: Question, Problem, Error

perch_form issues

I have a perch form that will be used in 3 languages (en, es, fr). So I set the form up to include perch:content regions. I placed the form in content/Forms/en_contact_form.html. I have a lot of questions. I know, but I'm experiencing some odd behavior.

Here are the problems I'm experiencing:

  1. The form validation is not working. This means that the messages entered into the template are not showing when left blank.

  2. The telephone field is completely missing from display on the form.

  3. When I hit submit to test the validation which isn't working (see #1) the Question/Comments text area disappears completely and the validation for the 2 top fields is displayed.

  4. Filling in all required fields allows the form to submit, however the success message doesn't show on the page.

In the Admin

  1. forms app is installed

  2. the form submissions are not showing up there -- is this because I have it setup as a template rather than including the form on directly the page from the content/forms directory for this feature to work? If so, what would the work around be for the different languages? I'd really like my client do do that work since they will be adding additional languages in the future.

Finally, can I reuse the same form for each language since I am allowing the end user to type in the labels and error messages in the correct language? I want to set each form up as a shared region, but not sure it will work if I reuse the template for each language.

Here is my form code:

<perch:form id="contact" method="post" app="perch_forms" novalidate="novalidate">
                    <perch:content id="intro" type="textarea" label="Form Title" textile="true" editor="markitup" size="m" />

    <div class="form-group">
        <perch:label for="name" class="sr-only"><perch:content id="name" type="text" label="Name" /></perch:label>
        <perch:input type="text" class="form-control" id="name" required="true" label="Name" placeholder="<perch:content id="name" type="text" label="Name" />"/>
        <perch:error for="name" type="required"><perch:content id="error_name" type="text" label="Error Message for Name" help="Message to user when the Name field has been left blank"/></perch:error>
    </div>

    <div class="form-group">
        <perch:label for="email" class="sr-only"><perch:content id="email" type="text" label="Email" /></perch:label>
        <perch:input type="email" class="form-control" id="email" required="true" label="Email" placeholder="<perch:content id="email" type="text" label="Email" /> (you@company.com)" />
        <perch:error for="email" type="required"><perch:content id="error_email" type="text" label="Error Message for Email Address" help="Message to user when the Email field has been left blank"/></perch:error>
        <perch:error for="email" type="format"><perch:content id="error_email2" type="text" label="Error Message for Email Formatting" help="Message to user when the Email Address is not properly fomatted."/>/perch:error>
    </div>

    <div class="form-group">
        <perch:label for="telephone" class="sr-only"><perch:content id="telephone" type="text" label="Telephone" /></perch:label>
        <perch:input type="text" class="form-control" id="telephone" required="true" label="Telephone" placeholder="<perch:content id="telephone" type="text" label="Telephone" />"/>
        <perch:error for="telephone" type="required"><perch:content id="error_telephone" type="text" label="Error Message for Telephone" help="Message to user when the Telephone field has been left blank"/></perch:error>
    </div>

   <div class="form-group">
        <perch:label for="message" class="sr-only"><perch:content id="comments" type="text" label="Questions/Comments" /></perch:label>
        <perch:input type="textarea" class="form-control" id="message" required="true" label="Message" placeholder="<perch:content id="comments" type="text" label="Questions/Comments" />"/>
        <perch:error for="message" type="required"><perch:content id="error_message" type="text" label="Error Message for Questions/Comments" help="Message to user when the Comments field has been left blank"/></perch:error>
    </div>

    <div>
        <perch:input type="submit" class="btn btn-warning" id="submit" value="Send" />
    </div>

    <perch:success>
        <p><perch:content id="success_message" type="textarea" label="Message when form is successfully sent." /></p>
    </perch:success>
</perch:form>
Kim Mazzola

Kim Mazzola 0 points

  • 4 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

From the look of it, you have content fields with the same IDs as your form fields to use as placeholders. With forms, if there's a value set for the ID of an input field, it's automatically used as the value for the field. (This is how an edit form then works.)

So my guess is your placeholder values are being used as the field values under all circumstances, so required fields are always completed with those default values.

If you're unsure, simplify your form and then build it up once each step is working.

Drew,

Thanks for the reply. Actually, I am getting error messages. Just the default "Fill in this field" and not on all fields. I didn't want to have to create another field for the placeholder, but I'll try that and see if that helps.

  1. Removed the placeholder fields completely and still having the same issue with validation. The comments area disappears and the error messages do not show.

  2. The telephone field is still not visible on the form.

  3. Form submission still not showing in the admin.

I have gone into the admin and reserved the form to make it reload prior to trying a submission again.

Any idea why the form submissions are not showing in my admin? The submissions did show when I placed the form directly on the page using the perch_form tag. But that didn't allow for the language customizations which is necessary.

Actually, I found the error. There was an improperly closed perch:error tag on the email field. Notice the end perch:error tag is missing the opening bracket. I only found that because I was doing what you suggested and simplifying the form. Thank you for helping. You let me find that error. All the other fields work perfectly now. Nothing disappears, the form submission shows in the admin and the validation works with the exception of the formatting on the email field. That validation didn't work. I was able to submit the form with just "kim" in the email field.

As for my other questions, can you offer help?

Can I reuse the same form for each language since I am allowing the end user to type in the labels and error messages in the correct language?

I want to set each form up as a shared region, but not sure it will work if I reuse the template for each language.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Unless this form is going to be on every page, don't use a shared region. Instead use perch_content_custom() with the page option.

I don't see why you shouldn't reuse the template for whatever purpose you need.