Jump to content

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


Juergen
 Share

Recommended Posts

  • 3 weeks later...

Version 2.1.47 is out!!

Now FrontendForms supports Ajax form submission!

Ajax form submission prevents a page reload after the form has been submitted. This could be useful in scenarios, where you do not want a reload (fe if your form is inside a modal box or inside a tab) after the form has been submitted. You can disable/enable Ajax submission by checking a checkbox inside the module configuration, or you can overwrite the global value by using the setSubmitWithAjax() method on per form base.

If you are enabling this feature, a progress bar will be displayed after you have pressed the submit button to inform the user, that the form will be validated now. Otherwise, the user will not see any action until the validated form will be loaded back into the page. If you do not want to show the progress bar, you can disable it inside the module configuration too. With the showProgressbar() method, you can overwrite this global setting on per form base.

In the case, you want to redirect the visitor to another page, after the form has been submitted successfully, you cannot do this via a PHP session redirect, because the form has been submitted via Ajax. In this case a JavaScript redirect has to be done. To force a JS redirect after the submission, you need to use the setRedirectUrlAfterAjax() method. Put the new URL inside the parenthesis, and the user will be redirected to this URL after the form has been validated successful.

You will find a more detailed information about these 3 new methods here: https://github.com/juergenweb/FrontendForms/blob/main/README.md#setsubmitwithajax---use-ajax-for-form-submission

Screenshot of the new Ajax configuration settings:

319749026_Screenshot2023-10-09at17-18-34ModuleFrontendFormswebseite2_at.thumb.png.2675fc23c850348533ecc4d7e20bd56d.png

As always, please test your forms if you are changing to Ajax support and report any bugs directly on Github. A lot of changes have been done, so keep an eye on unwanted side effects.

I have tested it with my other module FrontendContact too and it works without problems if you are using Ajax support.

Best regards!

  • Like 3
  • Thanks 1
Link to comment
Share on other sites

  • 2 weeks later...

Hi,

I'm using your module for the first time, looks really promising 🙂

It seems that password fields *always* show a password toggle, even if the showPasswordToggle() method is not called in user code.

In InputPassword.php, line 105, it unconditionally appends the checkbox:

$this->append($this->showPasswordToggle()->___render());

My solution was the following, but not sure if that won't break other things:

// InputPassword.php

// Line 26
// protected InputCheckbox $showPasswordToggle; // The password toggle checkbox object
protected bool $showPasswordToggle = false;

// Line 85
// $this->showPasswordToggle = $toggle;
$this->showPasswordToggle = true;

// Line 105
// $this->append($this->showPasswordToggle()->___render());
if($this->showPasswordToggle) {
	$this->append($this->showPasswordToggle()->___render());
}

 

  • Like 1
Link to comment
Share on other sites

Hello @dynweb

Thank you for reporting this issue and offering a solution!!

You are right, there was a logical mistake inside the InputfieldPassword class. I have corrected this wrong behavior and updated the module to 2.1.49.

You can read the complete changelog here: changelog.md

Be aware, that the checkbox will be appended by default and you have to manually disable it by using the following method including false as parameter

showPasswordToggle(false);

Best regards

  • Like 1
Link to comment
Share on other sites

New Class "PrivacyText" added on version  2.1.50

This is a new feature, that offers you to display a text only version (including a link if set) instead of a checkbox version for the "Accept our Terms and Privacy Policy". Thanks to @Chris-PW from the support forum for informing me, that a checkbox is no longer recommended, and a text would be the better option.

Please read the changelog.md for full information about the new feature.

Preview of text without link:

1588500214_Screenshot2023-10-27at12-54-53Home.png.aa48e8e0948880a0e8127acd99b9e9ed.png

Preview of text including a link to the privacy policy page if set inside the module configuration

1748178837_Screenshot2023-10-27at12-57-04Home.png.3385a84aae68da46bb522de12e9b9d25.png

Best regards

  • Like 1
Link to comment
Share on other sites

Hello Juergen,

I like the PrivacyText feature but I'm struggling to find a way to translate the text without touching the source file? 

Thanks for your great work!

  • Like 1
Link to comment
Share on other sites

Hello @xweb

It seems that you are new to ProcessWire 😉.

Every text inside the module is translatable in the backend. This feature is called "translatable strings" in ProcessWire. No need to touch the sourcefile!

All you need is to enable language support in the backend. You will find it under Modules/core:

345469761_Screenshot2023-11-01at19-52-51ModulesProcessWirewebseite1_at.thumb.png.ad2ce4ad4d0060be9f268f4e2167777b.png

After you have installed it, a new navigation item called "Languages" appear under Setup:

languages.png.619d0ddc777df96bb430a218bdac790d.png

 

After clicking this navigation point, you will be redirected to a page, that contains all installed languages. In your case it is the language "default". Click on it and you will be redirected to the translation page, where you can translate every translatable string of the whole installation.

1750849829_Screenshot2023-11-01at20-04-26Languagesdefaultwebseite6_at.thumb.png.1a5c80ce945117ac15c31cdfc21ec27a.png

The last step ist to find the file, where the text for the privacy could be translated. It is called privacytext.php.json.

189279574_Screenshot2023-11-01at20-07-09Languagesdefaultwebseite6_at.thumb.png.abb24ee24f6e47305ff0fbf2b11c1976.png

Click on edit and translate the text to your needs.

1113987094_Screenshot2023-11-01at20-09-31LanguageTranslatorProcessWirewebseite6_at.png.8d9de707543c890b502d0b071d27aae3.png

Thats all!!!!

I recommend you to study the multilanguage feature of ProcessWire and how translatable strings work.

Hope this helps! Best regards!!

 

Link to comment
Share on other sites

Just to mention: If you do not find the privacytext.php.json file, you have to add it first.

Click at the top at the "Find Files To Translate" Button.

1473777694_Screenshot2023-11-02at06-13-15Languagesdefaultwebseite6_at.thumb.png.ec7885151149599616a696c3f1cf3dfd.png

Look at the first scroll-down field "Translatable files in /site/" inside the category "No translation files exist" and look for the file there. If you have found it, click on it and click the "Submit" button on the top right corner.

766368888_Screenshot2023-11-02at06-16-32LanguageTranslatorProcessWirewebseite6_at.thumb.png.b06f29f2622f7796ecc01c72cbdd7a32.png

Now you will find the file as written in the previous post.

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...