Jump to content

Create simple forms using API


Soma

Recommended Posts

I may be alone with this but I feel more productive without CSS frameworks. A small grid is OK but the rest is better to be custom. There is always something I need differently done and then the framework only hinders me.

  • Like 3
Link to comment
Share on other sites

4 minutes ago, tpr said:

I may be alone with this but I feel more productive without CSS frameworks. A small grid is OK but the rest is better to be custom. There is always something I need differently done and then the framework only hinders me.

On frameworks you can load only what you want (CSS or JS). So you can use only the grid or you use other components too  - depends on your choice. You dont need to include all features.

Link to comment
Share on other sites

  • 1 month later...

How to modify / replace the form field markup?

<div>
  <input id="box1" type="checkbox" />
  <label for="box1" data-fa-checked="<FA-UNICODE>" data-fa-unchecked="<FA-UNICODE>">Checkbox 1</label>
</div>

The markup above is used for css styled and font awesome checkbox / radio form input elements.

Link to comment
Share on other sites

  • 2 weeks later...
On 18.12.2016 at 10:58 AM, pwFoo said:

How to modify / replace the form field markup?


<div>
  <input id="box1" type="checkbox" />
  <label for="box1" data-fa-checked="<FA-UNICODE>" data-fa-unchecked="<FA-UNICODE>">Checkbox 1</label>
</div>

The markup above is used for css styled and font awesome checkbox / radio form input elements.

It's possible to replace the inputfield render() method by a hook to change the hardcoded html markup as needed. 

With my custom small css framework I was able to build css based and font awesome styled checkboxes / radios. 

 

Is it possible to set additional classes to form api elements others than the input field itself like container / li or the label element?

$field->attr('class', 'class1 class2')

is added to the input field (only).

Link to comment
Share on other sites

On 3.11.2016 at 1:33 PM, tpr said:

I may be alone with this but I feel more productive without CSS frameworks. A small grid is OK but the rest is better to be custom. There is always something I need differently done and then the framework only hinders me.

That's why I play with a simple self created flex based grid / framework at the moment. Just for fun, but maybe I'll use it in the future ;)

  • flex grid (auto row wrap)
  • nice buttons (based on button or a elements)
  • checkboxes / radios with font awesome icons or css styled boxes and a slide toggle checkbox optional
  • responsive table (html table change display mode (theader values in pseudo element ::before prefix the cell value)
  • responsive dropdown / dropline responsive menu (styled checkbox toggle for mobile)

I compare it with pure, but try to keep it more flexible and smaller. Helper classes aren't included, but I could add some in a optional file. So it's modular and small.

 

  • Like 1
Link to comment
Share on other sites

Hi everyone,

quick question: Using the form API, is there a way to render a standards compliant

<fieldset>
  <legend>Legend</legend>
  /* some input fields */
</fieldset>


construct (for use in a frontend form)?
Whenever I use
 

$fieldset = $modules->get('InputfieldFieldset');
$fieldset->label = 'About You';

[add a bunch of fields, add them to the fieldset, add the fieldset to the form]

not only does the fieldset get somehow mangled in divs, I also don't get a html legend element.

I tried using

$modules->get("InputfieldMarkup");

and construct the fieldset/legend myself, but that ends up with

<div>
  <fieldset>
    <legend>Legend</legend>
    </div>

I searched the forum, but only found some similar questions and no real answer (unless I missed it, which is entirely possible :) )

Link to comment
Share on other sites

Hi @Sebastian. Welcome to the forums.

The real answer is that these forms were never intended for use in the frontend. Their purpose and design was for backend use only where trade-offs have had to be made between complying with standards versus delivering a usable and highly efficient UI, taking into account the underlying complexities that constitute the PW Admin. Using them in the frontend is just a bonus, but it comes at a 'cost'. You are probably better off using your own forms, or investing in Form Builder or similar.

  • Like 5
Link to comment
Share on other sites

3 minutes ago, kongondo said:

Hi @Sebastian. Welcome to the forums.

The real answer is that these forms were never intended for use in the frontend.

Hi kongondo,

thanks! That didn't accour to me at all. Makes a lot of sense too, I was working aroung the <button> instead of <input> for form submission already and was wondering why these elements were used insted of the more standard ones :)

I've been working with pw for at least 3 years now (also reading the forums, registered back then etc.) but that somehow never came up.  I also appreciated your work on modx extensions in the past btw! Might have a question regarding your dynamic selects module soon ;-)

 

  • Like 1
Link to comment
Share on other sites

  • 1 month later...
  • 2 months later...
On 12/9/2012 at 4:41 PM, neildaemond said:

this version will validate the current fieldset before moving on to the next slide using jquery validation plugin. Must initiallize with:

$("#formID").formToWizard();
$("#formID").validate({
				 ignore: ".ignore"
		 });
 

PWformToWizard-validate.js

EDIT: must also include the validation plugin from http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Hello Neil,

Does this method still work? If yes, can you reupload this JS File?

Thanks

Link to comment
Share on other sites

  • 3 months later...

hey there,

i'm creating new pages via a form – which works great. to prevent the same pages names i try to validate the inputfield for duplicate entries.

in the form i ask for the users e-mail address which becomes the title for the page.

 

i modified the given example (don't allow hotmail e-mails) to this:

// here is a good point for extra/custom validation and manipulate fields
    $email = $form->get("email");

    // check if e-mail already exists
    if($pages->count("email=$email, include=all") > 0){        // attach an error to the field
        // and it will get displayed along the field
        $email->error("E-Mail is already in use.");
    }

the form still gets processed and returns a php error:

Quote

Fatal error: Exception: SQLSTATE[23000]: Integrity constraint violation: 1062 Duplicate entry '502d27e7ee88a4c82711d48751b78c00-1033' for key 'name_parent_id'

which i'm trying to avoid by checken for duplicates upfront.

when i'm using $page->count("email=$email, include=all") > 0 on a test template it returns the right value.

 

 

Link to comment
Share on other sites

  • 2 months later...

hey @tpr,

any news on your nette forms module (
https://processwire.com/talk/topic/2089-create-simple-forms-using-api/?do=findComment&comment=97399) ? i've also worked with nette forms and liked it a lot. a little pw module with some helpers would be great (like setting it to uikit markup, adding a honeypot https://github.com/wodCZ/NetteHoneypot )

i'm happy to collaborate :)

 

  • Like 2
Link to comment
Share on other sites

I'm using it on a few production site (well, everywhere almost :)) and one of my friend too tried it and kinda liked it. Even though I don't feel it's production-ready, I've made many changes during its lifetime so a code cleanup would be necessary. It's currently more admin-oriented, mainly to support multi-language in emails and messages, but everything can be overwritten by code. Adding fields are strictly available via code though.

I can add it to github and write some docs to it (currently there's none).

  • Like 3
Link to comment
Share on other sites

I'm totally fine with using it only via IDE - that's the way I've used it myself too. It's easy, fast and the most flexible solution we can get. Imho the important thing is that it makes forms secure by default and validates on front- and backend.

Looking forward to trying the module. I have no specific need right now but I'm sure it will rise up soon. Some kind of quickstart guide would be great!

Thanks :)

  • Like 1
Link to comment
Share on other sites

  • 3 weeks later...
On 24.9.2017 at 6:06 PM, pppws said:

hey there,

i'm creating new pages via a form – which works great. to prevent the same pages names i try to validate the inputfield for duplicate entries.

in the form i ask for the users e-mail address which becomes the title for the page.

 

i modified the given example (don't allow hotmail e-mails) to this:


// here is a good point for extra/custom validation and manipulate fields
    $email = $form->get("email");

    // check if e-mail already exists
    if($pages->count("email=$email, include=all") > 0){        // attach an error to the field
        // and it will get displayed along the field
        $email->error("E-Mail is already in use.");
    }

the form still gets processed and returns a php error:

which i'm trying to avoid by checken for duplicates upfront.

when i'm using $page->count("email=$email, include=all") > 0 on a test template it returns the right value.

 

 

I think the problem is that you have $email the Inputfield and not the value. You'll need to get the value like

$email = $form->get("email")->value;
Link to comment
Share on other sites

  • 3 months later...
On 28.11.2017 at 11:19 AM, bernhard said:

hey @tpr,

any news on your nette forms module (
https://processwire.com/talk/topic/2089-create-simple-forms-using-api/?do=findComment&comment=97399) ? i've also worked with nette forms and liked it a lot. a little pw module with some helpers would be great (like setting it to uikit markup, adding a honeypot https://github.com/wodCZ/NetteHoneypot )

i'm happy to collaborate :)

Finally I built a module for creating FrontendForms easily: 

 

  • Like 2
Link to comment
Share on other sites

  • 4 weeks later...
  • 2 weeks later...

Thanks for the thread @Soma. One of the most important and cited ones in the whole forum history!

In the original post there are a few points that seem to be not discussed later in the thread, but which are extremely interesting to me.

1.

Quote

If you understand a little more how PW works with forms and inputfields you can simply add you own validation, do hooks and lots of magic with very easy code to read and maintain.

Are there any good examples of those to dig into? Gists maybe?

2.

Quote

It's also worth noting that processInput() will work also with an array (key=>value) of data it doesn't have to be the one from $input->post.

Looking here it seems arrays are not allowed. I might be not understanding it right or things might change since when it was written. Is there actually a way to process input from a page or an array?

3.

Quote

You can also use the processInput($input->post) method of a form that PW uses itself to validate a form.

There was already a question about what kind of validation processInput does and @adrian's answer too. I read the code a few times but still not sure should I sanitize values after processInput before saving to page fields or not. Is it necessary?

Thanks again! Learning ProcessWire is still fun (or am I doing it too slow?!)

  • Like 2
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
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...