FrontendForms - A module for creating and validating forms on the frontend

[Juergen]

Hello @Stefanowitsch

Thanks for reporting these issues. I have fixed them (point 1 and 2).

Instead of adding the class "uk-form-label" I have added the class "uk-margin-small-right" to the label tag because I find it looks like better.

I have updated the version of FrontendForms, so please update and test it. I hope it works fine, because it is very late here in Austria, but on my local installation everything looks good.

I find your idea of showing the files for the upload very good, so I guess I will try to find a nice JavaScript solution to realize this. The best option would be that I will find a ready-to-use JavaScript which offers this feature, so I can include it in the next update.

Thanks for giving FrontendForms a try and to make it better by reporting issues and sharing ideas to improve it with us.

Best regards Jürgen 

  

[Juergen]

Version 2.2.44 includes a new feature besides some bug fixes (Thanks to @Stefanowitsch for reporting, testing and providing some fixes for the issues).

New feature: File list below a file upload field

Previous versions of FrontendForms have the "clear the file upload field" feature, which was a link below the input field to remove all files for upload from this file upload field. This was a nice feature to remove files from the file upload field, but @Stefanowitsch requested a better feature to remove not all, but only specific files from the field.

The new feature is not just a link. Instead it provides a complete list of all added files below the file upload field and by clicking on the "X" you can remove a specific file from the field. The second advantage is that you can see all files that have been added to this field. 

Demo:

 

As always, please report any issues you discover here in the forum or on GitHub.

[Stefanowitsch]

I find this is a really good addition, thank you for including it in your module!

[da²]

Hello,

On a page with an url segment, the form is never valid. It's a simple form with an InputNumber. If I remove the segment it works, if I add it isValid() is always false.

Another minor issue, even if an InputFile has setMultiple(false), I can drag and drop several files on it, I don't know if you can do something for this.

[da²]

3 minutes ago, da² said:

On a page with an url segment, the form is never valid. It's a simple form with an InputNumber. If I remove the segment it works, if I add it isValid() is always false.

Reason is the option in PW admin: I always check to end segments with a slash, if I check "no" the form works.

[da²]

And another issue.

1. First time I submit the form, after isValid() I call showForm(true), so the form shows with the last value entered.
   I see the notice "Thank you for your message", and the URL segment is still there.
2. I hit submit a second time and get a 404 page (from my code) because the URL segment is removed.

Edited October 3 by da²

[Juergen]

Thanks @da² for reporting these issues. I'll look into it as soon as possible. I have to work on the weekend, so I am afraid that probably won't get around to it until next week. 

[Juergen]

Hello @da²

I have fixed the 2 bugs with the URL segments (fixes will be in the next update), but I have a question concerning the file upload issue in single upload fields. I have tested it with Firefox without any problems. Take a look at the video.

 

In my case it works as expected. If I drag and drop more than 1 file only the last file will be taken and only 1 file will be submitted. What browser do you use? Maybe it could be a browser related issue.

Best regards Jürgen

[Juergen]

OK, I guess what you mean:

I will try to find out, what will be the cause and to fix this problem

[Juergen]

I have found the issue: This only happens if the ID and name attribute are exactly the same on a single upload field. If there is a difference, everything works as expected, so I have added an additional suffix to the ID attribute of a file upload field to prevent this behavior.

 

Now everything should work fine! Module version is updated, so please test if everything works now as expected.

[Jan S.]

Hello @Juergen,

I have an issue installing FrontendForms on my processwire instance. After installing the module, the following error appears on the very top of the admin page:

Deprecated: FrontendForms\Inputfields::removeSanitizers(): Implicitly marking parameter $sanitizer as nullable is deprecated, the explicit nullable type must be used instead in /home/web/_dev/site/modules/FrontendForms/Formelements/Inputelements/Inputfields.php on line 183

The module seems to work... but I also need to put more efforts in the forms I want to ceate and will see, if it is working as expected despite the error message.

I use FrontendForms 2.2.54 together with processwire 3.0.246 stable and PHP 8.4 on Apache webserver.

Thanks in advance for investigating.

EDIT:
it seems to work, but the frontend also displays errors in debug mode:

Deprecated: FrontendForms\Form::getLangValueOfConfigField(): Implicitly marking parameter $modulConfig as nullable is deprecated, the explicit nullable type must be used instead in /home/web/_dev/site/modules/FrontendForms/Formelements/Form.php on line 1278

Deprecated: FrontendForms\Form::newLineToArray(): Implicitly marking parameter $textarea as nullable is deprecated, the explicit nullable type must be used instead in /home/web/_dev/site/modules/FrontendForms/Formelements/Form.php on line 1448

Deprecated: FrontendForms\Inputfields::removeSanitizers(): Implicitly marking parameter $sanitizer as nullable is deprecated, the explicit nullable type must be used instead in /home/web/_dev/site/modules/FrontendForms/Formelements/Inputelements/Inputfields.php on line 183

 

Edited October 6 by Jan S.

[Juergen]

Good morning @Jan S.

Thanks for reporting these issues. I have fixed them and updated the module version to 2.2.55.

Alternatively you can replace the following files, which contain the changes:

https://github.com/juergenweb/FrontendForms/blob/main/Formelements/Form.php

https://github.com/juergenweb/FrontendForms/blob/main/Formelements/Inputelements/Inputfields.php

 

PHP 8.4. is more strict than the previous version and in addition I use

declare(strict_types=1);

on all PHP files in FrontendForms.

As a result, any warning will be treated as an error.

So please test if it works now and let me know if you discover some issues again. Thanks!!

[Jan S.]

Hello @Juergen, thank you very much for your quick fix. I updated the module and the error messages are now all gone. Many thanks!

[Jan S.]

Hello @Juergen, me again and sorry for bothering you in this regards...

Adding the privacy checkbox including a standard text phrase referencing the gdpr website link works in English, but how can I display a German version of this? It is there in the translation, but I didn't figure out to get this working. I can partly achieve this by adding a custom field name holding the German text, but then the link to the referenced gdpr-page disappears.
As a workaround I just overwrote the original english text phase in /Formelements/Inputelements/Inputs/defaults/Privacy.php to get the job done. But I think there must be a more handy way to achieve this?

Another upcoming challenge would be to implement a multi-page form, where the user should shall enter form data in consecutive steps/pages, being able to go back and forth. On the last page I'd like to output all entered data to be confirmed as correct before submitting the form. Could this use case also be done using FrontendForms?

Many thanks in advance!

[Juergen]

Good morning Jan!

9 hours ago, Jan S. said:

Adding the privacy checkbox including a standard text phrase referencing the gdpr website link works in English, but how can I display a German version of this?

I guess you have installed the language support module first?? If not, here is a little screen cast how to do it. You will need it to translate strings.

You are German speaking too , so you could install the language files for German translations from the module itself as shown in the clip. 

Now every English phrase should be translated into German, but if you are not satisfied with the translation text, you can overwrite it with your own text (but be aware that every time you install the translation files again, every changes will be overwritten).

You will find the file containing the text for the privacy checkbox here:

By clicking the "Edit" link you will be redirected to the editable page:

There you can make your changes if you want.

9 hours ago, Jan S. said:

Another upcoming challenge would be to implement a multi-page form, where the user should shall enter form data in consecutive steps/pages, being able to go back and forth. On the last page I'd like to output all entered data to be confirmed as correct before submitting the form. Could this use case also be done using FrontendForms?

Not out of the box. Maybe you can use URL segments and put each form on a segment page.

Example if form 1 is valid, then you will be redirected to the URL segment 2 which contains form 2 and so on. You will need to store the form values inside a session variable. At the end (last URL segment) you can take all the values stored in the session variable and output it to the user (as a kind of list of entered values)

Every value output to the user should have an edit link next to it and if the user clicks on the link, he will be redirected to the appropriate form, where he can change the value. I would add a query string at the end of the link to determine that the user wants to change something.

If the user have changed the value, everything is valid and the query string is present in the URL then the user will be redirected directly to the last page again, where he can check his entered data once more. If there is a need for changing another value, then he clicks on the next edit link and so on.

That was my idea, but you could also write a question in the general forum about this issue. I guess there are some people who have written a multi-page form and can give you a hint how to solve it.

FrontendForms only creates single forms, but it is not impossible to combine the values of multiple single forms by using sessions.

Good luck! 

[Jan S.]

Hello @Juergen,

once more thank you very much for your superb support 🙂

In the meantime I found the "Multi-language" section in the documentation as well - sorry I have overlooked this. But the infos you provided above are much appreciated, I will dive into this later on today.

Regarding the multi-page form - I need to reconsider this as implementing forms seems to be a challenge for me as a citizen web developer on its own.Maybe the Form Builder plugin can help to achieve this...

[Juergen]

Hello Jan,

I did not find any infos about the possibility of creating multi-step forms inside the form builder docs, but maybe I have overlooked it too.😉

I will take your request as an idea about a new feature for the future and maybe I will integrate the possibility of creating a multi-step form out of the box in an easy way. I have some ideas but I guess this will take a lot of time, so it cannot be realized in the next days.

[da²]

Thank you @Juergen for the fixes. Sorry not to reply before but I have few free time. ^^

I found more issues:

• File upload is limited to 500 MB: $zipUpload->setRule('allowedFileSize', '524288000');
  But I can add a file larger, the form is valid and the upload starts, but then the server is not happy:

  Quote

  Request Entity Too Large

  The requested resource does not allow request data with POST requests, or the amount of data provided in the request exceeds the capacity limit.

  ---

  Apache/2.4.58 (Win64) OpenSSL/3.1.3 PHP/8.2.0 Server at xxx.local.fr Port 80

• With module FrontendLoginRegister, in Account Settings I add Language field. I have 2 languages, french and english, french is default.
  The form displays the 2 languages only if user is actually using french, when using english, only english is listed in the Select field.
  If user selects english and save, it works.
  If user selects french it is not saved.
  I try to investigate the code quickly, only to find that in Select::___renderSelect(), when user is using english, $option->render() returns an empty string for french.

[Juergen]

Hello @da²

Thanks for reporting these issues, I will check this next week. For now I have tried the max file size validator and it has worked in my case, but I guess I must dig a little deeper. Maybe there is a problem especially with zip files and file size calculation. 

[Juergen]

Hello @da²

I have tried to test the file size restriction with various files, but in my case I could not find any issues. It has worked every time.

Do you see the red badge warning under the file input field too as in my screen shot below before you submit the form (if you have selected a file larger than allowed)?

If you see this red badge, the form could not be valid after the form submission. Please also check the file size in the badge (in this case it is 12.81 MB). Maybe you could provide a screen shot before the form submission?

Please check if you have the latest version too!

Best regards

[Juergen]

Language change in account settings:

 I have tried it with 3 languages and the language select shows all 3 languages in all languages. 

I do not know why the option is an empty string in your case. Do you have translated the names of your languages under setup languages too?

[da²]

On 10/18/2025 at 7:58 PM, Juergen said:

Do you see the red badge warning under the file input field too as in my screen shot below before you submit the form (if you have selected a file larger than allowed)?

It works only if I set multiple to true, but this is a single file upload: 

$zipUpload = new InputFile("zipFile");
$zipUpload->setMultiple(false); // Rule 'allowedFileSize' not working with "false"
$zipUpload->showClearLink(true); // No link displayed too
$zipUpload->setLabel("label");
$zipUpload->setRule('allowedFileSize', '524288000'); // Not taken into account except with multiple files
$zipUpload->setRule('allowedFileExt', ['zip']);
$zipUpload->setRule('required');

 

On 10/18/2025 at 8:19 PM, Juergen said:

Do you have translated the names of your languages under setup languages too?

Oh, this works if I fill the english title of french language! Is it expected? Usually in ProcessWire the field first language value is used as default if second one is empty, like here:

In my language selector for example, it works like this, all languages are found and usable.

But at least I know how to fix this on my side. 😉

Edited Monday at 04:41 PM by da²

[Juergen]

Good morning @da²

12 hours ago, da² said:

$zipUpload->showClearLink(true); // No link displayed too

Remove this line to show the badge, but anyway: it works properly on my side on single and multi file upload fields.

You are right, I will check this!!

BTW: You do not have to write the filesize like "524288000" -> you can write "500 MB" instead and it will be converted to "524288000" automatically.

I have never tried it with such a high upload max size - please try it with a lower size (fe. set it to 50 MB) and take a look what happens).

Another aspect could be that there are 2 different max size config settings:

1.  Max upload file size (the max size for an individual file)
2. Max post size (the max size for all uploaded data via a POST request

The validator only checks for the max file size, not the max post size.

So for testing purposes please set the max file size to 50 MB, remove the showClearLink() and take a look what happens.

 

[Juergen]

I have fixed the JS bug for displaying the badges on single upload fields:

Please replace the JS code with this one: https://github.com/juergenweb/FrontendForms/blob/main/frontendforms.js

12 hours ago, da² said:

$zipUpload->showClearLink(true); // No link displayed too

You can remove this line too, because it is true by default, you only have to use this method if you want to prevent the badges from being displayed. In this case you have to set the parameter to false.

You can also try to set the max filesize to 50MB and see what happens. Let me know.