How to use modal pop-up window in Yii2 (basic use), yii2 use modal pop-up window _ PHP Tutorial

How to use the modal pop-up window (basically used) in Yii2, yii2 uses the modal pop-up window. In Yii2, how to use modal pop-up windows (basically used), yii2 uses modal pop-up windows Modal, that is, modal windows. In other words, it is pop-up windows. Is a js plug-in for bootstrap, and the use effect is also very good. How to use modal pop-up window (basic) in Yii2, and use modal pop-up window in yii2

Modal is also a Modal window. In general, it is a pop-up window. Is a js plug-in for bootstrap, and the use effect is also very good.

I don't need to say much about the use of modal. I don't believe it when you say that you haven't used js pop-up windows during the development of a website! A good pop-up window not only gives us a sense of beauty, but also improves our development efficiency and even improves our mood!

Let's see how modal is used in yii2.

For example, when we add data before, we usually click the button to jump to the add page, save and then jump to the list page.

Now we want to add data in the pop-up window of the current page when you click the Add button. see the specific implementation.

1. use yii \ bootstrap \ Modal; 2. create a button to call the display echo Html: a ('create ','#', ['id' => 'Create', 'data-toggle '=> 'modal', 'data-target' =>' # create-modal ', 'class' => 'btn btn-success ',]); 3. create a modal <? Php Modal: begin (['id' => 'Create-modal', 'header' => 'Create', 'footer '=> 'close',]); $ requestUrl = Url: toRoute ('create'); $ js = <
 
  
RegisterJs ($ js); Modal: end ();?> 4. modify the create operation as follows: public function actionCreate () {$ model = new Test (); if ($ model-> load (Yii :: $ app-> request-> post () & $ model-> save () {return $ this-> redirect (['index']);} else {return $ this-> renderAjax ('create', ['model' => $ model,]) ;}}
 

In this case, click [create] to see the modal pop-up window, as shown below.

Some may say that this page does not need to be asynchronously loaded. Indeed, you can also directly echo $ this-> renderAjax (); on the page, but remember to modify the action submitted by the form.

For the use of modal, there are two points to remind you:

Set the attribute data-toggle = "modal" on the control element (such as a button or link ", at the same time, set data-target = "# identifier" or href = "# identifier" to specify the specific modal box to be switched (with id = "identifier ")

Above, we have implemented the basic usage of modal in yii2.

Callback (basic), yii2 uses modal pop-up window Modal, that is, modal window, and pop-up window. Is a bootstrap js plug-in, and the use effect is also very good ....