In this chapter, you will discover how powerful Gii is as a tool. It provides support for CRUD actions, as well as creating a controller and its respective views.
We will cover the following topics related to the user interface in this chapter:
It is now time for you to learn what Yii2 supports in order to customize the JavaScript and CSS parts of web pages. A recurrent use of JavaScript is to handle AJAX calls, that is, to manage widgets and compound controls (such as a dependent drop-down list) from jQuery and Bootstrap.
Finally, we will employ jQuery to dynamically create more models from the same class in the form, which will be passed to the controller in order to be validated and saved.
We introduced Gii in Chapter 5, Developing a Reservation System, to generate models. Now we want to use Gii to create CRUD actions with a controller and views.
Type http://hostname/basic/web/gii
in your browser to return to the Gii welcome page. Click on the Start button of the CRUD section. We have to fill out four fields:
appmodelsModelClass
.appmodelsModelClassSearch
.appcontrollerMyCustomController
.@app/views
, to indicate the base path for the views file, for example: @app/views/myCustom
to indicate the base path of the MyCustomController
views, that will be filled by default to @app/views/controller-id
.Then, we can customize BaseControllerClass
, the widget used in the index page, to enable the state of I18N and the code template, but it is okay to leave them with the default values.
In this example, we will create complete CRUD actions to manage rooms, reservations, and customers.
In the earlier chapter, we dealt with Gii CRUD actions to create a form. We must now repeat these instructions for all three models: the room, reservation, and customer model class. To distinguish files created with Gii from files created manually in the previous chapters, we will append the Gii suffix to the controller's class name.
Browse to the Gii welcome page at http://hostname/basic/web/gii
, click on the Start button in the CRUD section, and fill out the fields with the following values to create CRUD actions for the Room
model class:
appmodelsRoom
appmodelsRoomSearch
appcontrollersRoomsWithGiiController
@app/views/rooms-with-gii
Then, repeat this operation for the Reservation
model class:
appmodelsReservation
appmodelsReservationSearch
appcontrollersReservationsWithGiiController
@app/views/reservations-with-gii
Finally, repeat them for the Customer
model class:
appmodelsCustomer
appmodelsCustomerSearch
appcontrollersCustomersWithGiiController
@app/views/customers-with-gii
The following screenshot shows the fields filled out to generate CRUD actions for the Room
model class:
While navigating in the folder structure, you will see that Gii has created three new files in basic/controllers
, named RoomsWithGiiController.php
, ReservationsWithGiiController.php
, and CustomersWithGiiController.php
.
Each of these files contains five actions:
actionCreate()
: This action is used to create a new model objectactionView()
: This action is used to view the details of a model objectactionUpdate()
: This action is used to update an existing model objectactionDelete()
: This action is used to delete an existing model objectactionIndex()
: This action is used to display, using the grid layout, a list of model objectsOpen the basic/models
folder and you will find three new files: RoomSearch.php
, ReservationSearch.php
(which should already exist), and CustomerSearch.php
.
Each of these files basically contains a search()
method, which returns the ActiveDataProvider to be used to display data in GridView, passing some filter conditions.
Finally, open the basic/views
folder and you will find three new folders: roomsWithGii
, reservationsWithGii
, and customersWithGii
; each one containing six files:
_form.php
_search.php
create.php
index.php
update.php
view.php
View files that start with an underscore are considered by default in Yii2 as subviews, or rather views that are called by other views.
The first two files start with an underscore; effectively if we open create.php
and update.php
, we will notice that, at the end of these files, the render()
method is called using the _form.php
view. Both the create and update view will use the same _form
view to display the form to edit fields.
The last four files, create.php
, index.php
, update.php
, and view.php
are views that refer to the same actions in the controller. By default, they all have a breadcrumb and a title for each page.
Make some tests that browse, for example, to http://hostname/basic/web/rooms-with-gii/index
or http://hostname/basic/web/rooms-with-gii/index
, to see some excellent works made by Gii.
This is the index action result of RoomsWithGiiController
:
18.188.175.182