1. Go to this page and download the library: Download loveorigami/yii2-modal-ajax library. Choose the download type require.
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
loveorigami / yii2-modal-ajax example snippets
public function actionCreate()
{
$model = new Company();
if ($model->load(Yii::$app->request->post())) {
if ($model->save()) {
return $this->redirect(['view', 'id' => $model->id]);
}
}
return $this->render('create', [
'model' => $model,
]);
}
public function actionCreate()
{
$model = new Company();
if ($model->load(Yii::$app->request->post())) {
if ($model->save()) {
if (Yii::$app->request->isAjax) {
// JSON response is expected in case of successful save
Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
return ['success' => true];
}
return $this->redirect(['view', 'id' => $model->id]);
}
}
if (Yii::$app->request->isAjax) {
return $this->renderAjax('create', [
'model' => $model,
]);
} else {
return $this->render('create', [
'model' => $model,
]);
}
}
use lo\widgets\modal\ModalAjax;
echo ModalAjax::widget([
'id' => 'createCompany',
'header' => 'Create Company',
'toggleButton' => [
'label' => 'New Company',
'class' => 'btn btn-primary pull-right'
],
'url' => Url::to(['/partner/default/create']), // Ajax view with form to load
'ajaxSubmit' => true, // Submit the contained form as ajax, true by default
// ... any other yii2 bootstrap modal option you need
]);
use lo\widgets\modal\ModalAjax;
echo ModalAjax::widget([
'id' => 'createCompany',
'header' => 'Create Company',
'toggleButton' => [
'label' => 'New Company',
'class' => 'btn btn-primary pull-right'
],
'url' => Url::to(['/partner/default/create']), // Ajax view with form to load
'ajaxSubmit' => true, // Submit the contained form as ajax, true by default
'size' => ModalAjax::SIZE_LARGE,
'options' => ['class' => 'header-primary'],
'autoClose' => true,
'pjaxContainer' => '#grid-company-pjax',
]);
use lo\widgets\modal\ModalAjax;
echo ModalAjax::widget([
'id' => 'updateCompany',
'selector' => 'a.btn', // all buttons in grid view with href attribute
'options' => ['class' => 'header-primary'],
'pjaxContainer' => '#grid-company-pjax',
'events'=>[
ModalAjax::EVENT_MODAL_SHOW => new \yii\web\JsExpression("
function(event, data, status, xhr, selector) {
selector.addClass('warning');
}
"),
ModalAjax::EVENT_MODAL_SUBMIT => new \yii\web\JsExpression("
function(event, data, status, xhr, selector) {
if(status){
if(selector.data('scenario') == 'hello'){
alert('hello');
} else {
alert('goodbye');
}
$(this).modal('toggle');
}
}
"),
ModalAjax::EVENT_MODAL_SHOW_COMPLETE => new \yii\web\JsExpression("
function(event, xhr, textStatus) {
if (xhr.status == 403) {
$(this).modal('toggle');
alert('You do not have permission to execute this action');
}
}
"),
ModalAjax::EVENT_MODAL_SUBMIT_COMPLETE => new \yii\web\JsExpression("
function(event, xhr, textStatus) {
if (xhr.status == 403) {
$(this).modal('toggle');
alert('You do not have permission to execute this action');
}
}
")
]
]);
//Grid example with data-scenario
Pjax::begin([
'id' => 'grid-company-pjax',
'timeout' => 5000,
]);
echo GridView::widget([
'dataProvider' => $dataProvider,
'columns' => [
......................
// Action buttons
// <a class="btn" href="/site/update?id=10" title="Edit ID-10" data-scenario="hello">Hello</a>
// <a class="btn" href="/site/update?id=20" title="Edit ID-20" data-scenario="goodbye">Goodbye</a>
......................
],
]);
Pjax::end();
Loading please wait ...
Before you can download the PHP files, the dependencies should be resolved. This can take some minutes. Please be patient.