multiple forms on one page (standalone version)?

bernhard
Member | 40
+
+1
-

Hi everybody,

I'm developing a module to integrate Nette Forms into ProcessWire, my favourite CMS. Some of you might already know it, because Adrian built the wonderful TracyDebugger module for ProcessWire (thanks for that tool!). Nette Forms is also really great and I've worked with it several times, but now I'm really stuck. I can't find a way to have multiple forms on one page – is this possible?

I have this simple test-setup:

<?php
require_once(__DIR__ . '/site/modules/RockForms/vendor/autoload.php');
use Nette\Forms\Form;

$form = new Form;

$form->addText('name', 'Name:');
$form->addPassword('password', 'Password:');
$form->addSubmit('send', 'Sign up');
$form->addHidden('test', 'formA');
$form->addHidden('test1', 'formA');

echo $form; // renders the form


$form = new Form;

$form->addText('name', 'Name:');
$form->addPassword('password', 'Password:');
$form->addSubmit('send', 'Sign up');
$form->addHidden('test', 'formB');
$form->addHidden('test2', 'formB');

echo $form; // renders the form

Before I submit everything is fine (see the hidden fields with values formA and formB):
2018_07_12_17_27_46

But after I submit one form, the problems begin:
2018_07_12_17_27_29

  • The form elements of both forms have the same name and the same id. Thats not only invalid HTML but also leads to the problem that form1 is populated with values of the submitted form2. I solved that in my module by appending the formID to every input, but still the other problems persist.
  • The hidden value for field “test” is also overwritten by the submission. That's the same as mentioned in the point above. But the strange thing is the second hidden field. It has an individual name but is still somehow reset by the submission of one form.

The second problem means that if I had several forms on my page (like contact form and newsletter subscription form) a submission of one form (with failed validation) would lead to breaking all the other forms on that page.

I hope you get my point and I hope someone has a solution for me :) I thought of submitting the form via AJAX and only replacing the submitted form, but I hope there is a better way of doing it.

Thank you in advance!

David Matějka
Moderator | 6445
+
+3
-

Hi, you can pass a name to a Form constructor. nette will prepend this name to all IDs and also hidden “tracker” field to distinguish which form was submitted

bernhard
Member | 40
+
0
-

WTF??? It works! So simple… Should have asked earlier. Thank you very much for the quick response!

I think it would make sense to mention that in the docs – don't you think?

bernhard
Member | 40
+
0
-

Hey David, thanks again for your help. The form name is correctly added to the form-tag but it seems not to be added to single fields. Am I doing anything wrong?

For regular fields this does not seem to be a problem but for checkboxes with the same name it leads to this bug:

bernhard
Member | 40
+
0
-

Anyone? Should I report this issue on Github?

David Matějka
Moderator | 6445
+
+1
-

@bernhard it really looks like a bug. so yes, please report it on gh, thanks :)