Child pages
  • Using the HelperForm class

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of contents

Table of Contents

Using the HelperForm class

This helper is used to generate an edition form for an object of type ObjectModel. Example: editing the client's profile.

Form declaration

Fields inside [brackets] are optional as per the HTML standard.
Values between {curly braces} list the possible values for this field.

...

Note

If you want to use the "color" type, you can add the "color mColorPickerInput" classes

Basic declaration

Removing all the optional fields, this is how to build a basic HelperForm element:

...

Code Block
<form id="_form">
  <fieldset id="fieldset_main_conf">
    <legend>
      <img alt="Edit carrier" src="../img/admin/icon_to_display.gif">Edit carrier
    </legend>
    <div class="margin-form">
      <input type="text" class="" value="" id="shipping_method" name="shipping_method">
    </div>
    <div class="clear"></div>
    <div class="margin-form">
      <input type="submit" class="button" name="" value="Save" id="_form_submit_btn">
    </div>
  </fieldset>
</form>

Generating specific elements

The 'input' variable of the form declaration takes an array containing the content of your form. Using the various offered possibilities, you can build just about any type of form, and be assured that it will comply with PrestaShop's style and form processing.

You can use as many element arrays as necessary for your form, one after the other.

Text input

Here is how to generate a basic <input> element:

Code Block
languagephp
array(
  'type'     => 'text',                             // This is a regular <input> tag.
  'label'    => $this->l('Name'),                   // The <label> for this <input> tag.
  'name'     => 'name',                             // The content of the 'id' attribute of the <input> tag.
  'size'     => 50,                                 // The content of the 'size' attribute of the <input> tag.
  'required' => true,                               // If set to true, this option must be set.
  'desc'     => $this->l('Please enter your name.') // A help text, displayed right next to the <input> tag.
),

Selector

Here is how to generate a <select> element:

...

Code Block
languagephp
$options = array();
foreach (Gender::getGenders((int)Context::getContext()->language->id) as $gender)
{
  $options[] = array(
    "id" => (int)$gender->id,
    "name" => $gender->name
  );
}

Checkbox

Here is how to generate a <input> of type "checkbox":

...

Just as for a selector input, check boxes take an array of arrays as the value of $options.

Radio button

Here is how to generate a <input> of type "radio":

...

Note that you have to use the "t" CSS class on your labels in order to have the proper styling (but you can redefine that class using the "class" variable).

Other HTML elements

The type variable of the element declaration makes it possible to generate just about any kind of <input> element: text, select, textarea, radio, checkbox, file and many others! See the list of available types here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input
You can also use some PrestaShop specific: shop, asso_shop, free, color. Try them out!