Articles in this section
Category / Section

How to integrate EJ components with Laravel framework in PHP Button?

6 mins read

How to use EJ components with Laravel framework   

What is Laravel

 

Laravel is a PHP web framework, designed to achieve Model View Controller architectural pattern in order to have a clean separation between the application logic and its presentation.

You can get more information on installation, system requirements, folder structure from the below link.

https://laravel.com/docs/5.3

Laravel uses Web artisan, which is a command line interface used to build and run your application.

https://laravel.com/docs/5.3/artisan

 

How to manage dependencies in Laravel

 

Laravel uses composer to manage its dependencies, with which you can include the third party libraries in your project using composer.json file. It automatically downloads and installs the dependencies that are specified in composer.json file.

To get more information on installation and usage, please check

https://getcomposer.org/doc

 

How to create project in Laravel

 

After installing the composer tool, create a new Laravel project by following the steps provided below.

  1. Navigate to the target folder and open the command prompt.
  2. Type the following command.
    composer create-project laravel/laravel Getting_started 5
    

 

By executing the above command, you will see a Laravel project created in the target folder with the folder structure as given in Laravel documentation. Also, the dependencies used in your project will be updated and installed.

  1. After your project is successfully created, run the project by using Web artisan tool.
    php artisan serve
    

 

By default the project will be served to port 8000. If you want to serve your project to some other port number, you need to specify the port number as given below.

php artisan serve --port=8083

 

  1. Type localhost:8000 in your browser to see the output.

 

How to configure Laravel Project to use EJ components

 

Provided that you have created a simple project using Laravel framework, you need to add the EJ wrapper classes to the project to use Syncfusion components. Follow the steps described below to add the EJ wrapper classes.

Refer the PHP getting started documentation to get the EJ packages. Let us now see how to configure our project to use the Syncfusion components.

  1. Create a folder named assets within public folder available in the Laravel project. Move the required script and CSS dependencies from EJ package to this assets folder and refer it in your master page layout with the help of given getting started document.
  2. Now, to use EJ wrapper classes in your Laravel project, copy and paste the EJ PHP component packages to the Laravel project just created.

In this example, we have created a folder named EJ in the root directory of Laravel project and copied the EJ wrapper classes to this folder. So the folder structure will look like,

 

| - laravel Getting_started

     | -

     | - EJ

          | - Src

              | - Widget.php

              | - Serialize.php

              | - HtmlTag.php

              | - Button

                  |- Button.php -> Button wrapper class

                                | - Checkbox

                                        | - Checkbox.php

 

 

  1. Once the EJ wrapper classes are moved to the project folder, you need to configure the composer.json file. Map the EJ namespace to the path where EJ wrapper classes will be available in autoload property of composer.json file as depicted below.
         "autoload": {
               "psr-4": {
                     "App\\": "app/",
                     "EJ\\": "EJ/Src/"
                    } 
                  }
    

 

Here EJ namespace is mapped to path “EJ/Src/”. So the composer will search for the EJ namespace in “EJ/Src/” folder, where the folder live in the root directory of your project.

  1. With the above mentioned steps, the EJ namespace will be available in the Laravel project. Let us now see how to add a simple button control in Laravel project.

 

How to render a simple Button control using Laravel

 

Now that we have configured the Laravel project to access EJ namespace, let us see how to render a simple EJ Button control.

  1. Since the Control specific classes are present inside subfolders, add the path to EJ class files in classmap array of composer.json file as shown below.
         "autoload": {
     
            "classmap": [ "EJ/Src" ],
     
            "psr-4": {
                       "App\\": "app/",
                       "EJ\\": "EJ/Src/"
                     }     
          }
    

 

  1. Run the following command to re-generate the vendor/autoload.php file.
     composer dump-autoload
    

 

Now, you will be able to use the EJ wrapper classes in Laravel project.

  1. Render the button control by instantiating the Button class available under EJ namespace as given below.
         <?php 
              $btn = new EJ\Button("btn");
              echo $btn->text("Submit")->render();
         ?>
    

 

You can get more details on rendering and configuring other EJ components in User Guide documentation.


Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied