Uniform: Multiple Forms on one page

Kirby 3 Solved ✅
1

Hi there. I’m trying to insert two forms on one page but I keep getting error messages.

I had a single form working perfectly Using Uniform in the following way:

  use Uniform\Form;

  return function ($kirby)
  {
    $contactform = new Form([
        'name' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'email' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'company' => [],
		'tel' => [],
        'message' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ]);

    if ($kirby->request()->is('POST')) {
        $contactform->emailAction([
            'to' => 'name@email.co.uk',
            'from' => 'no-reply@email.co.uk',
			'subject' => 'Contact form submission from website.com'
        ]);
    }

    return compact('contactform');

I then read this Answer in the Uniform docs as to how to set up multiple forms. I changed my controller to:

use Uniform\Form;

return function ($kirby)
{
    $contactform = new Form([
        'name' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'email' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'company' => [],
		'tel' => [],
        'message' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'contactform');
	
	$quickquoteform = new Form([
        'qqname' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'qqemail' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'qqcompany' => [],
		'qqtel' => [],
        'qqmessage' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'quickquoteform');

    if ($kirby->request()->is('POST')) {
        $contactform->emailAction([
            'to' => 'name@email.co.uk',
            'from' => 'no-reply@email.co.uk',
			'subject' => 'Contact form submission from website.com'
        ]);
    }

    return compact('contactform');

The problem I have now is that when I try and load the page, I get an error:

Whoops \ Exception \ ErrorException (E_NOTICE)
Undefined variable: quickquoteform

This appears to be becasue my form fields follow the following structure/syntax:

<input<?php if ($quickquoteform->error('qqname')): ?> class="error"<?php endif; ?> name="qqname" id="qqname" type="text" placeholder="Your name" value="<?php echo $quickquoteform->old('qqname') ?>">

I’m struggling to understand why the variable $quickquoteform is being returned as undefined when the variable $contactform for the first form appears to work perfectly.

Because of this issue, I haven’t even got onto how I submit the correct form (the most relevant thread I can find on that goes back to Kirby 2).

2

You only return your first form tto the template, so the second variable is uundefined.

  return compact('contactform', 'quickquoteform');
1 Like
3

Perfect. Thanks @texnixe - I will almost certainly have further questions so will hold off marking this as solved just yet.

4

OK, I have that first issue fixed but now I’m getting error messages display in the wrong form.

I have checked out the answer supplied by @mzur in the Uniform Docs and adjusted my code accordingly but I’m still getting the same issue.

My code is as follows:

use Uniform\Form;

return function ($kirby)
{
    $contactform = new Form([
        'name' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'email' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'company' => [],
		'tel' => [],
        'message' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'contact-form');
	
	$quickquoteform = new Form([
        'qqname' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'qqemail' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'qqcompany' => [],
		'qqtel' => [],
        'qqmessage' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'quickquote-form');

    if ($kirby->request()->is('POST')) {
        $contactform->emailAction([
            'to' => 'name@email.co.uk',
            'from' => 'no-reply@email.co.uk',
            'subject' => 'Contact form submission from website.com'
        ]);
    }

    return compact('contactform','quickquoteform');
};

The code in my template that displays the errors is thus:

<?php if ($quickquoteform->success()): ?>
  <div class="uniform-success">
    Thank you for your message. We will get back to you soon!
  </div>
<?php else: ?>
  <?php snippet('uniform/errors', ['form' => $quickquoteform]) ?>
<?php endif; ?>

The Error Display code for the first form is the same but using $contactform instead of $quickquoteform

5

Ah, I see it’s because I have only specified the emailAction for form 1, not for form 2 as well. I guess I’d better work that out…

6

Exactly.

But then I think this code is problematic as well:

<?php if ($quickquoteform->success()): ?>
  <div class="uniform-success">
    Thank you for your message. We will get back to you soon!
  </div>
<?php else: ?>
  <?php snippet('uniform/errors', ['form' => $quickquoteform]) ?>
<?php endif; ?>

It means, that the else part is always displayed when the first condition is not true, which doesn’t make sense.

7

Ah, well I just lifted that straight from the example in the Documentation! It does check to see if there are any errors present though (in the snippet supplied as part of the plugin):

<?php if (count($form->errors()) > 0): ?>
    <div class="uniform-errors">
	Error details in here...
    </div>
<?php endif ?>
8

Yes, that makes sense if you have only one form, but you have to extend the logic for multiple forms.

9

Well, it seems to work OK! I’m no developer (you’d never have guessed, right?!) so it’ll do for me!

10

Oh, ok, then everything is fine.

11

Here is my final solution for anyone else that has the same question or issue.

My two forms are a standard contact form and a more detailed Quick Quote form. I have set them up in the template file and called the form controller that has the following code in:

use Uniform\Form;

return function ($kirby)
{
    $contactform = new Form([
        'name' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'email' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'company' => [],
		'tel' => [],
        'message' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'contact-form');
	
	$quickquoteform = new Form([
        'qqname' => [
			'rules' => ['required'],
            'message' => 'Please enter your name',
		],
		'qqemail' => [
            'rules' => ['required', 'email'],
            'message' => 'Please enter a valid email address',
        ],
		'qqcompany' => [],
		'qqtel' => [],
        'qqmessage' => [
            'rules' => ['required'],
            'message' => 'Please enter a message',
        ],
    ],'quickquote-form');

    if ($kirby->request()->is('POST')) {
		if (get('formid') === 'contact') {
			$contactform->emailAction([
				'to' => 'name@email.co.uk',
				'from' => 'no-reply@email.co.uk',
				'subject' => 'Contact form submission from website.com'
			]);
		} elseif (get('formid') === 'quickquote') {
			$quickquoteform->emailAction([
				'to' => 'name@email.co.uk',
				'from' => 'no-reply@email.co.uk',
				'subject' => 'Contact form submission from website.com'
			]);
		}
    }

    return compact('contactform','quickquoteform');
};

The final section that determines which form to submit uses a hidden field in each form (as per this thread):

<input type="hidden" name="formid" value="contact [OR] quickquote">

Many thanks to @texnixe for her help and to @mzur for making the plugin.

I’m still learning but getting there with your awesome support.