Read More
Read More
Menu Close

    Symfony form in PrestaShop 1.7.8.0

    In this blog we discuss about using Symfony form, in PrestaShop 1.7.8.0 and above. Here we are going to demonstrate form built using Symfony form builder and save form data in configuration table.

    Symfony form example
    Symfony form example

    This example shows demo page where all possible form types are being used. You can use this page as examples of how to integrate inputs in a PrestaShop Symfony module compatible with and PrestaShop 1.7.8.0 and above versions.

    Follow the given folder structure :

    Symfony Form Module Structure
    Symfony Form Module Structure

    Step 1 :

    Firstly add below code for module main file demoforms.php

    declare(strict_types=1);
    use PrestaShop\PrestaShop\Adapter\SymfonyContainer;
    class DemoForms extends Module
    {
        public function __construct()
        {
            $this->name = 'demoforms';
            $this->author = 'Author';
            $this->version = '1.0.0';
            $this->need_instance = 0;
            $this->bootstrap = true;
            parent::__construct();
            $this->displayName = $this->trans('Form by author', [], 'Modules.DemoForms.Admin');
            $this->description = $this->trans('Form types within PrestaShop', [], Modules.DemoForms.Admin');
            $this->ps_versions_compliancy = ['min' => '1.7.8.0', 'max' => _PS_VERSION_];
        }
    
        public function getTabs()
        {
            return array((
                    'class_name' => 'AdminDemoForms',
                    'visible' => true,
                    'name' => 'Symfony Forms',
                    'parent_class_name' => 'CONFIGURE',
            ));
        }
    
        public function getContent()
        {
            $route = SymfonyContainer::getInstance()->get('router')->generate('demo_first_forms');
            Tools::redirectAdmin($route);
        }
    }

    Step 2 :

    Secondly add below code in routes.yml

    Searching for an experienced
    Prestashop Company ?
    Read More
    demo_first_forms:
      path: /demoforms/first
      methods: [GET, POST]
      defaults:
        _controller: 'PrestaShop\Module\DemoForms\Controller\DemoFirstController::index'
        # Needed to work with tab system
        _legacy_controller: AdminDemoForms
        _legacy_link: AdminDemoForms

    Step 3 :

    Thirdly add below code in DemoFirstController.php

    declare(strict_types=1);
    namespace PrestaShop\Module\DemoForms\Controller;
    use PrestaShopBundle\Controller\Admin\FrameworkBundleAdminController;
    use Symfony\Component\HttpFoundation\Request;
    use Symfony\Component\HttpFoundation\Response;
    
    class DemoFirstController extends FrameworkBundleAdminController
    {
      public function index(Request $request): Response
      {
        $textFormDataHandler = $this->get('prestashop.module.demoforms.form.demo_first_text_form_data_handler');
    
        $textForm = $textFormDataHandler->getForm();
        return $this->render('@Modules/demoforms/views/templates/admin/form.html.twig', [
               'demoForms' => $textForm->createView(),
         ]);
      }
    }

    Step 4 :

    After that add below lines in composer.json

    {
      "name": "author/demoforms",
      "description": "Symfony forms",
      "license": "AFL-3.0",
      "authors": [{
          "name": "Author team"
        }],
      "autoload": {"psr-4": {
          "PrestaShop\\Module\\DemoForms\\": "src/"
      }},
      "require": {
        "php": ">=7.1.0"
      },
      "config": {
        "preferred-install": "dist",
        "prepend-autoloader": false
      },
      "type": "prestashop-module"
    }

    After that, run the below command in the module folder which loads namespace(Namespace).

    $ composer dumpautoload

    Step 5 :

    After that add below code in modules/demoforms/src/Form/DemoFirstTextType.php

    declare(strict_types=1);
    namespace PrestaShop\Module\DemoForms\Form;
    use PrestaShop\PrestaShop\Core\ConstraintValidator\Constraints\TypedRegex;
    use PrestaShopBundle\Form\Admin\Type\FormattedTextareaType;
    use PrestaShopBundle\Form\Admin\Type\TranslatableType;
    use PrestaShopBundle\Form\Admin\Type\TranslatorAwareType;
    use Symfony\Component\Form\Extension\Core\Type\TextareaType;
    use Symfony\Component\Form\FormBuilderInterface;
    use Symfony\Component\Validator\Constraints\Length;
    
    class DemoFirstTextType extends TranslatorAwareType
    {
        public function buildForm(FormBuilderInterface $builder, array $options): void
        {
            $builder
                ->add('formatted_text_area_type', FormattedTextareaType::class, [
                    'label' => $this->trans('Formatted text area type', 'Modules.DemoForms.Admin'),
                ])
                ->add('translatable_formatted_text_area_type', TranslatableType::class, [
                    'label' => $this->trans('Translatable formatted text area type', 'Modules.DemoForms.Admin'),
                    'help' => $this->trans('Throws error if length is > 30', 'Modules.DemoForms.Admin'),
                    'type' => FormattedTextareaType::class,
                    'required' => false,
                    'options' => [
                        'constraints' => [
                            new Length([
                                'max' => 130,
                            ]),
                        ],
                    ],
                ]);
        }
    }

    Step 6 :

    At last add below line in modules/demoforms/views/templates/admin/form.html.twig

    {% extends '@PrestaShop/Admin/layout.html.twig' %}
    {% form_theme demoForms 'PrestaShopBundle:Admin/TwigTemplateForm:prestashop_ui_kit.html.twig' %}
    
    {% block content %}
      {{ form_start(demoForms) }}
      <div class="card">
        <h3 class="card-header">
          <i class="material-icons">settings</i> {{ 'Types'|trans({}, 'Modules.DemoForms.Admin') }}
        </h3>
        <div class="card-block row">
          <div class="card-text">
            {{ form_widget(demoForms) }}
          </div>
        </div>
        <div class="card-footer">
          <div class="d-flex justify-content-end">
            <button class="btn btn-primary float-right" id="save-button">
              {{ 'Save'|trans({}, 'Admin.Actions') }}
            </button>
          </div>
        </div>
      </div>
      {{ form_end(demoForms) }}
    {% endblock %}

    This is the first part of creating Symfony form and saving form data. In second part we will discuss about services, form data provider and handler to save submitted data using Symfony form in PrestaShop 1.7.8.0.

    That’s all.

    If you are facing any issues or doubts in the above process, please feel free to contact us through the comment section.

    I would be happy to help.

    Also, you can explore our PrestaShop Development Services and a large range of quality PrestaShop Modules.

    For any doubt contact us at [email protected].

    . . .
    Discuss on Helpdesk

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top