Jump to content

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


Juergen
 Share

Recommended Posts

Hi Juergen,

Is it possible to make that InputCheckbox won't be wrapped by label (like Select)? I have CSS problem, that now only label is visible and checkbox has 0 width.

Now:

<label class="label" for="form-check">
  <input id="form-check" name="form-check" type="checkbox" class="checkbox" checked="">Label</label>

I prefer:

<input id="form-check" name="form-check" type="checkbox" class="checkbox" checked="">
<label class="label" for="form-check">Label</label>

Also is there something like InputFileUpload because I couldn't find one? With optional label?

<input type="file" id="myFile" name="form-filename">

 

Link to comment
Share on other sites

  • 2 months later...

Hello,

 

I tried the example from https://github.com/juergenweb/FrontendForms/blob/main/Examples/complexForm.php on an empty  3.0.200 Installation with PHP 8.1.10 and I get this message 4x on my test page:
 

Complex form

All fields marked with (*) are mandatory and must be completed.


The form is not visible.

But it's visible when I add an error to the page by calling an non existing function. It's the same problem with the other examples.

Any Idea why this is happening? Thanks


 

Unbenannt.PNG

Unbenannt2.PNG

Link to comment
Share on other sites

Usually not, but in your case it seems that a loop produces the repeats, but I dont know where it is located. I have tried it o a local installation (XAMPP) and it works as expected. So the cause should be somewhere on your side. Can you tell me which of the PW profiles do you use (Uikit, blank profile, blog,...)

Do you have the installation locally on XAMPP etc too or is it public reachable, so I can take a look.

Best regards

Link to comment
Share on other sites

979185186_Screenshot2022-09-27at12-21-51ModuleFrontendFormswebseite2_at.thumb.png.e6aa300da0fd7706586a61eac8cf1d74.png

Please also check in the module configuration settings that in the blacklist of forbidden IDs is not your IP address listed. I can remember that in the old version a Javascript mistake causes that the local IP address was stored inside this field and has to be deleted manually. This was a bug. Currently I am working on an improved version without JS and it works as expected - but this version has to be tested and is not ready to use for the moment. So please check this setting too.

Link to comment
Share on other sites

22 hours ago, Juergen said:

Usually not, but in your case it seems that a loop produces the repeats, but I dont know where it is located. I have tried it o a local installation (XAMPP) and it works as expected. So the cause should be somewhere on your side. Can you tell me which of the PW profiles do you use (Uikit, blank profile, blog,...)

Do you have the installation locally on XAMPP etc too or is it public reachable, so I can take a look.

Best regards

Hello,

the installation is with a blank profile and locally with laragon.

I tried it several times: Made a new installation, installed the module, created a template and a page with the complexForm.php file and always the same problem.

I checked the settings and also disabled measure 4 just to be sure but it didn't work.

 

Link to comment
Share on other sites

I am sorry, that I cannot help you, but I am unable to reproduce the error and without any error messages I have no starting point. As written above, I am working on the improved version, which will be (hopefully) ready to use within the next days. I can inform you if it will be ready to download if you want.

Best regards Jürgen

Link to comment
Share on other sites

Hello Luigi

I found the problem: The blank profile uses markup regions and therefore you have to copy the code of  the form between a div with the id "content".

Take a look at the code afterwards:

<?php

namespace ProcessWire;

/**
 * Demonstration of a complex form
 * You can copy this code to a template to show the form
 * If you use these classes inside another namespace (fe ProcessWire) like in this case, you have to take care about the namespace in front of the class instances.
 * Fe you have to use $form = new \FrontendForms\Form('myForm'); or $form = new FrontendForms\Form('myForm'); and not only $form = new Form('myForm');
 */
echo '<div id="content">';
echo '<h1>Complex form</h1>';


$form = new \FrontendForms\Form('registration');
$form->setMinTime(8);
$form->setMaxTime(3600);
$form->setMaxAttempts(5);
$form->setErrorMsg('Ouups! There are some errors.');
$form->setSuccessMsg('Congratulation! There are no errors.');


$userdata = new \FrontendForms\FieldsetOpen();
$userdata->setLegend('User data')->append('<p>Please fill out all required fields.</p>');
$form->add($userdata);

$singleRadio = new \FrontendForms\InputRadio('single');
$singleRadio->setLabel('Single radio button');
$singleRadio->setAttribute('value', 'single');
$singleRadio->setRule('required');
$singleRadio->setNotes('This field makes no sense');
$form->add($singleRadio);

$gender = new \FrontendForms\InputRadioMultiple('gender');
$gender->setLabel('Gender')->setAttribute('class', 'myextralabelclass');
$gender->setDefaultValue('Male');
$gender->addOption('Male', 'Male')->setAttribute('class', 'male');
$gender->addOption('Female', 'Female')->setAttribute('class', 'female');
$gender->addOption('Diverse', 'Diverse')->setAttribute('class', 'diverse');
$gender->getFieldWrapper()->setAttribute('class', 'uk-width-1-1')->removeAttributeValue('class', 'uk-margin');
$form->add($gender);

$firstname = new \FrontendForms\InputText('firstname');
$firstname->setLabel('Firstname');
$firstname->setRule('required');
$firstname->getFieldWrapper()->prepend('<div class="uk-child-width-1-2" data-uk-grid>')->removeAttributeValue('class', 'uk-margin');
$form->add($firstname);

$lastname = new \FrontendForms\InputText('lastname');
$lastname->setLabel('Lastname');
$lastname->setRule('required');
$lastname->getFieldWrapper()->append('</div>')->removeAttributeValue('class', 'uk-margin');
$form->add($lastname);

$street = new \FrontendForms\InputText('street');
$street->setLabel('Street');
$street->setRule('required');
$street->getFieldWrapper()->setAttribute('class', 'uk-width-3-4')->prepend('<div data-uk-grid>')->removeAttributeValue('class', 'uk-margin');
$form->add($street);

$number = new \FrontendForms\InputText('number');
$number->setLabel('Number');
$number->setRule('required');
$number->setRule('integer');
$number->getFieldWrapper()->setAttribute('class', 'uk-width-expand')->append('</div>')->removeAttributeValue('class', 'uk-margin');
$form->add($number);

$email = new \FrontendForms\InputEmail('email');
$email->setLabel('Email address');
$email->setSanitizer('email');
$email->setRule('required');
$email->setRule('email');
$email->setRule('emailDNS');
$email->getFieldWrapper()->prepend('<div class="uk-child-width-1-3" data-uk-grid>')->removeAttributeValue('class', 'uk-margin');
$form->add($email);

$phone = new \FrontendForms\InputTel('phone');
$phone->setLabel('Phone');
$phone->setRule('integer');
$phone->getFieldWrapper()->removeAttributeValue('class', 'uk-margin');
$form->add($phone);

$fax = new \FrontendForms\InputText('fax');
$fax->setLabel('Fax');
$fax->setRule('required')->setCustomFieldName('Fax number');
$fax->getFieldWrapper()->append('</div>')->removeAttributeValue('class', 'uk-margin');
$form->add($fax);

$birthday = new \FrontendForms\InputDate('birthday');
$birthday->setLabel('My birthday');
$birthday->setRule('required')->setCustomFieldName('The day of my birth');
$birthday->setRule('date');
$form->add($birthday);

$children = new \FrontendForms\InputNumber('children');
$children->setLabel('Number of children');
$children->setAttribute('min', '0');
$children->setAttribute('max', '15');
$children->setRule('required')->setCustomMessage('Please enter how much children do you have');
$form->add($children);

$userdataClose = new \FrontendForms\FieldsetClose();
$form->add($userdataClose);

$interestsOpen = new \FrontendForms\FieldsetOpen();
$interestsOpen->setLegend('My interest');
$form->add($interestsOpen);

$interests = new \FrontendForms\InputCheckboxMultiple('interest');
$interests->setLabel('I am interested in');
$interests->setDefaultValue('Web-design');
$interests->addOption('Music', 'Music')->setChecked();
$interests->addOption('Web-design', 'Web-design');
$interests->addOption('Sports', 'Sports')->setChecked();
$interests->addOption('Photography', 'Photography');
$firstname->setRule('required');
$interests->alignVertical();
$form->add($interests);


$php = new \FrontendForms\Select('php');
$php->setLabel('My preferred PHP version is');
$php->setDefaultValue('PHP 8');
$php->addOption('PHP 6', 'PHP 6');
$php->addOption('PHP 7', 'PHP 7');
$php->addOption('PHP 8', 'PHP 8');
$form->add($php);

$css = new \FrontendForms\SelectMultiple('css');
$css->setLabel('I have knowledge in');
$css->setDefaultValue('Less', 'CSS 1');
$css->addOption('CSS 1', 'CSS 1');
$css->addOption('CSS 2', 'CSS 2');
$css->addOption('CSS 3', 'CSS 3');
$css->addOption('Less', 'Less');
$css->addOption('Sass', 'Sass');
$form->add($css);

$interestsClose = new \FrontendForms\FieldsetClose();
$form->add($interestsClose);

$accept = new \FrontendForms\InputCheckbox('accept');
$accept->setLabel('I accept the data privacy');
$accept->setRule('accepted')->setCustomMessage('You have to accept the data privacy');
$form->add($accept);

$newsletter = new \FrontendForms\InputCheckbox('newsletter');
$newsletter->setLabel('I want to register to the newsletter');
$newsletter->setChecked();
$form->add($newsletter);

$button = new \FrontendForms\Button('submit');
$button->setAttribute('value', 'Send');
$form->add($button);


if ($form->isValid()) {

    print_r($form->getValues());
    // or do what you want

}

// render the form
echo $form->render();

echo '</div>';

As you can see the form code is between the opening and closing tags of the content container.

BTW I have sent you a PM with the new version.

Best regards Jürgen

Link to comment
Share on other sites

  • 5 weeks later...
  • 2 weeks later...

Thanks @flydev

I thought that this is called type declaration.  I have used this for a while, but I did not knew, that this was called union type. Now I have learnt something new today.🙂

The problem is solved for flashmaster82, we have discussed the issue via PM. The module itself should check if version 8.1 is installed.

'requires' => ['PHP>=8.1.0', 'ProcessWire>=3.0.181']

So it should give you a warning message before the installation process starts.

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

  • 2 months later...
1 minute ago, Juergen said:

Hi @pmichaelis,

it is indeed a little bit hidden, but you will find an example of a single and a multiple file upload field inside the example of the contact form at

https://github.com/juergenweb/FrontendForms/blob/main/Examples/contactform.php

Best regards

Ahh! There it is. Thank you!
Maybe you should also integrate it here:
https://github.com/juergenweb/FrontendForms/blob/main/Examples/inputfieldexamples.php

Link to comment
Share on other sites

Ok, in this case you should point the upload folder to be the folder with the id of your page inside the files directory

// add this to your form object
$form->setUploadPath($page->id, true); 

I have not tested it, but it should create a folder with the id of your page under the site/assets/ directory and store the file, that you have uploaded inside.

Link to comment
Share on other sites

 hm, there seems to be an error in the latest main branch with PW 3.0.18

ProcessWire\FrontendForms::cleanUpPasswordList(): Argument #1 ($data) must be of type array|string, null given, called in /var/www/html/site/modules/FrontendForms/FrontendForms.module on line 699 search►
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...