Javascript 通过Pjax发送数据的模态形式不'；t工作-Yii2
我从一位高级程序员那里得到了一个设置模块，由于我是Yii2新手，所以遇到了一个问题。简而言之，有两个控制器： 1-DefaultController.php 2-SettingCatController.php 一方面，actionCreate（默认/创建）将呈现设置页面的视图，操作员可以在其中为不同的目标设置不同的设置 另一方面，SettingCatController中还有另一个actionCreateAjax（设置cat/CreateAJAX），允许操作员创建各种类别 在default/create（呈现设置页面）中，操作员可以根据pjax设置cat/create ajax，通过模式表单设置设置类别，但它不起作用，通过触发模式表单中的submit按钮将不会发送任何内容 我在不同的区域浏览了很长时间，我确信资产包设置正确，但我没有发现问题：( 提前感谢您提供的任何帮助 如果有人需要更多的信息，请告诉我我会分享更多的信息 设置CATController/actionCreateAjax:Javascript 通过Pjax发送数据的模态形式不'；t工作-Yii2,javascript,php,jquery,yii2,pjax,Javascript,Php,Jquery,Yii2,Pjax,我从一位高级程序员那里得到了一个设置模块，由于我是Yii2新手，所以遇到了一个问题。简而言之，有两个控制器： 1-DefaultController.php 2-SettingCatController.php 一方面，actionCreate（默认/创建）将呈现设置页面的视图，操作员可以在其中为不同的目标设置不同的设置 另一方面，SettingCatController中还有另一个actionCreateAjax（设置cat/CreateAJAX），允许操作员创建各种类别 在default/c
public function actionCreateAjax()
{
$model = new SettingCategory();
if ($model->load(Yii::$app->request->post()) && $model->save()) {
Yii::$app->response->format = Response::FORMAT_JSON;
return [
'status' => 'success',
'category' => ['id' => $model->id, 'title' => $model->title]
];
}
$this->performAjaxValidation($model);
return $this->renderAjax('create', [
'model' => $model,
]);
}
protected function performAjaxValidation(Model $model, $attributes = null)
{
if (\Yii::$app->request->isAjax && $model->load(\Yii::$app->request->post())) {
\Yii::$app->response->format = Response::FORMAT_JSON;
\Yii::$app->response->data = ActiveForm::validate($model, $attributes);
\Yii::$app->response->send();
\Yii::$app->end();
}
}
<div class="setting-form">
<?php $form = ActiveForm::begin([
'id' => 'dynamic-settings',
'options' => ['data' => ['action' => 'save-setting']]
]); ?>
<div class="row">
<div class="col-sm-3">
<?= $form->field($model, 'cat_id', [
'template' => "{label}\n
<div class='input-group mb-3'>
{input}
<div class='input-group-append'>
<span data-toggle='modal' data-target='#add-category-modal' data-action='add-category'
data-url=\"" . Url::to(['/moresettings/setting-cat/create-ajax']) . "\" >
<button class='btn btn-success' type='button' data-toggle='tooltip'
title=\"" . Yii::t('more-settings', 'Create new category!') . "\" >
<i class='fas fa-plus'></i>
</button>
</div>
{hint}\n{error}
</div>",
]
</div>
</div>
</div>
<?php ActiveForm::end(); ?>
<?php
Pjax::end();
?>
<?php
$loadingTag = CustomHtmlHelper::loadingTag();
$loadingText = Yii::t('app', 'Loading ...');
Modal::begin([
'id' => 'add-category-modal',
'size' => Modal::SIZE_EXTRA_LARGE,
'bodyOptions' => [
'id' => 'create-form-container',
'class' => 'bg-light',
]
]);
echo $loadingTag;
Modal::end();
$js = <<< JS
jQuery('#dynamic-settings .select-type').on('change', function(event){
resetFields(this); // lib.js
});
resetFields($('#dynamic-settings .select-type')); // lib.js
var modalAddCategory = $('#add-category-modal');
modalAddCategory.on('shown.bs.modal', function (e) {
var button = $(e.relatedTarget)
var pjaxSettings = {
timeout: 20000,
scrollTo: false,
push: false,
skipOuterContainers: true,
url: button.data('url'),
container: '#create-form-container'
};
$('#create-form-container').off('pjax:error');
$('#create-form-container').on('pjax:error', function (event, xhr, textStatus, error, options) {
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
return false;
});
$('#create-form-container').off('pjax:complete');
$('#create-form-container').on('pjax:complete', function (event, xhr, textStatus, options) {
modalAddCategory.off('submit', 'form');
modalAddCategory.on('submit', 'form', function(e) {
var submitBtn = $(this).find(':submit');
var submitBtnOldHtml = submitBtn.html();
submitBtn.attr('disabled', true).text('$loadingText');
$.post($(this).attr('action'), $(this).serialize(), function (data) {
if (data.status === 'success') {
var newOption = new Option(data.category.title, data.category.id, true, true);
$(newOption).html(data.category.title);
$("#settings-cat_id").append(newOption).trigger('change');
modalAddCategory.modal('hide');
}
// errors handling
else {
$('#setting-cat-form').yiiActiveForm('updateMessages', data, true);
}
}).fail(function (xhr, status, error) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
}).then(function (result) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
});
return false;
})
});
$.pjax(pjaxSettings);
});
modalAddCategory.on('hidden.bs.modal', function (e) {
$(this).find('.modal-body').html('$loadingTag');
});
JS;
$this->registerJs($js, yii\web\View::POS_READY);
<?php
use yii\helpers\Html;
use yii\bootstrap4\ActiveForm;
?>
<div class="setting-cat-form">
<?php $form = ActiveForm::begin([
'id' => 'setting-cat-form'
]); ?>
//the fileds
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? Yii::t('more-settings', 'Create') : Yii::t('more-settings', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
public function actionCreateAjax()
{
$model = new SettingCategory();
if ($model->load(Yii::$app->request->post()) && $model->save()) {
Yii::$app->response->format = Response::FORMAT_JSON;
return [
'status' => 'success',
'category' => ['id' => $model->id, 'title' => $model->title]
];
}
$this->performAjaxValidation($model);
return $this->renderAjax('create', [
'model' => $model,
]);
}
protected function performAjaxValidation(Model $model, $attributes = null)
{
if (\Yii::$app->request->isAjax && $model->load(\Yii::$app->request->post())) {
\Yii::$app->response->format = Response::FORMAT_JSON;
\Yii::$app->response->data = ActiveForm::validate($model, $attributes);
\Yii::$app->response->send();
\Yii::$app->end();
}
}
<div class="setting-form">
<?php $form = ActiveForm::begin([
'id' => 'dynamic-settings',
'options' => ['data' => ['action' => 'save-setting']]
]); ?>
<div class="row">
<div class="col-sm-3">
<?= $form->field($model, 'cat_id', [
'template' => "{label}\n
<div class='input-group mb-3'>
{input}
<div class='input-group-append'>
<span data-toggle='modal' data-target='#add-category-modal' data-action='add-category'
data-url=\"" . Url::to(['/moresettings/setting-cat/create-ajax']) . "\" >
<button class='btn btn-success' type='button' data-toggle='tooltip'
title=\"" . Yii::t('more-settings', 'Create new category!') . "\" >
<i class='fas fa-plus'></i>
</button>
</div>
{hint}\n{error}
</div>",
]
</div>
</div>
</div>
<?php ActiveForm::end(); ?>
<?php
Pjax::end();
?>
<?php
$loadingTag = CustomHtmlHelper::loadingTag();
$loadingText = Yii::t('app', 'Loading ...');
Modal::begin([
'id' => 'add-category-modal',
'size' => Modal::SIZE_EXTRA_LARGE,
'bodyOptions' => [
'id' => 'create-form-container',
'class' => 'bg-light',
]
]);
echo $loadingTag;
Modal::end();
$js = <<< JS
jQuery('#dynamic-settings .select-type').on('change', function(event){
resetFields(this); // lib.js
});
resetFields($('#dynamic-settings .select-type')); // lib.js
var modalAddCategory = $('#add-category-modal');
modalAddCategory.on('shown.bs.modal', function (e) {
var button = $(e.relatedTarget)
var pjaxSettings = {
timeout: 20000,
scrollTo: false,
push: false,
skipOuterContainers: true,
url: button.data('url'),
container: '#create-form-container'
};
$('#create-form-container').off('pjax:error');
$('#create-form-container').on('pjax:error', function (event, xhr, textStatus, error, options) {
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
return false;
});
$('#create-form-container').off('pjax:complete');
$('#create-form-container').on('pjax:complete', function (event, xhr, textStatus, options) {
modalAddCategory.off('submit', 'form');
modalAddCategory.on('submit', 'form', function(e) {
var submitBtn = $(this).find(':submit');
var submitBtnOldHtml = submitBtn.html();
submitBtn.attr('disabled', true).text('$loadingText');
$.post($(this).attr('action'), $(this).serialize(), function (data) {
if (data.status === 'success') {
var newOption = new Option(data.category.title, data.category.id, true, true);
$(newOption).html(data.category.title);
$("#settings-cat_id").append(newOption).trigger('change');
modalAddCategory.modal('hide');
}
// errors handling
else {
$('#setting-cat-form').yiiActiveForm('updateMessages', data, true);
}
}).fail(function (xhr, status, error) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
}).then(function (result) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
});
return false;
})
});
$.pjax(pjaxSettings);
});
modalAddCategory.on('hidden.bs.modal', function (e) {
$(this).find('.modal-body').html('$loadingTag');
});
JS;
$this->registerJs($js, yii\web\View::POS_READY);
<?php
use yii\helpers\Html;
use yii\bootstrap4\ActiveForm;
?>
<div class="setting-cat-form">
<?php $form = ActiveForm::begin([
'id' => 'setting-cat-form'
]); ?>
//the fileds
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? Yii::t('more-settings', 'Create') : Yii::t('more-settings', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
public function actionCreateAjax()
{
$model = new SettingCategory();
if ($model->load(Yii::$app->request->post()) && $model->save()) {
Yii::$app->response->format = Response::FORMAT_JSON;
return [
'status' => 'success',
'category' => ['id' => $model->id, 'title' => $model->title]
];
}
$this->performAjaxValidation($model);
return $this->renderAjax('create', [
'model' => $model,
]);
}
protected function performAjaxValidation(Model $model, $attributes = null)
{
if (\Yii::$app->request->isAjax && $model->load(\Yii::$app->request->post())) {
\Yii::$app->response->format = Response::FORMAT_JSON;
\Yii::$app->response->data = ActiveForm::validate($model, $attributes);
\Yii::$app->response->send();
\Yii::$app->end();
}
}
<div class="setting-form">
<?php $form = ActiveForm::begin([
'id' => 'dynamic-settings',
'options' => ['data' => ['action' => 'save-setting']]
]); ?>
<div class="row">
<div class="col-sm-3">
<?= $form->field($model, 'cat_id', [
'template' => "{label}\n
<div class='input-group mb-3'>
{input}
<div class='input-group-append'>
<span data-toggle='modal' data-target='#add-category-modal' data-action='add-category'
data-url=\"" . Url::to(['/moresettings/setting-cat/create-ajax']) . "\" >
<button class='btn btn-success' type='button' data-toggle='tooltip'
title=\"" . Yii::t('more-settings', 'Create new category!') . "\" >
<i class='fas fa-plus'></i>
</button>
</div>
{hint}\n{error}
</div>",
]
</div>
</div>
</div>
<?php ActiveForm::end(); ?>
<?php
Pjax::end();
?>
<?php
$loadingTag = CustomHtmlHelper::loadingTag();
$loadingText = Yii::t('app', 'Loading ...');
Modal::begin([
'id' => 'add-category-modal',
'size' => Modal::SIZE_EXTRA_LARGE,
'bodyOptions' => [
'id' => 'create-form-container',
'class' => 'bg-light',
]
]);
echo $loadingTag;
Modal::end();
$js = <<< JS
jQuery('#dynamic-settings .select-type').on('change', function(event){
resetFields(this); // lib.js
});
resetFields($('#dynamic-settings .select-type')); // lib.js
var modalAddCategory = $('#add-category-modal');
modalAddCategory.on('shown.bs.modal', function (e) {
var button = $(e.relatedTarget)
var pjaxSettings = {
timeout: 20000,
scrollTo: false,
push: false,
skipOuterContainers: true,
url: button.data('url'),
container: '#create-form-container'
};
$('#create-form-container').off('pjax:error');
$('#create-form-container').on('pjax:error', function (event, xhr, textStatus, error, options) {
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
return false;
});
$('#create-form-container').off('pjax:complete');
$('#create-form-container').on('pjax:complete', function (event, xhr, textStatus, options) {
modalAddCategory.off('submit', 'form');
modalAddCategory.on('submit', 'form', function(e) {
var submitBtn = $(this).find(':submit');
var submitBtnOldHtml = submitBtn.html();
submitBtn.attr('disabled', true).text('$loadingText');
$.post($(this).attr('action'), $(this).serialize(), function (data) {
if (data.status === 'success') {
var newOption = new Option(data.category.title, data.category.id, true, true);
$(newOption).html(data.category.title);
$("#settings-cat_id").append(newOption).trigger('change');
modalAddCategory.modal('hide');
}
// errors handling
else {
$('#setting-cat-form').yiiActiveForm('updateMessages', data, true);
}
}).fail(function (xhr, status, error) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
swal({
title: xhr.responseText,
type: "error",
confirmButtonText: '<i class="fa fa-thumbs-up font-22"></i>',
});
}).then(function (result) {
submitBtn.attr('disabled', false).text(submitBtnOldHtml);
});
return false;
})
});
$.pjax(pjaxSettings);
});
modalAddCategory.on('hidden.bs.modal', function (e) {
$(this).find('.modal-body').html('$loadingTag');
});
JS;
$this->registerJs($js, yii\web\View::POS_READY);
<?php
use yii\helpers\Html;
use yii\bootstrap4\ActiveForm;
?>
<div class="setting-cat-form">
<?php $form = ActiveForm::begin([
'id' => 'setting-cat-form'
]); ?>
//the fileds
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? Yii::t('more-settings', 'Create') : Yii::t('more-settings', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
仅供猜测。可能应该是type='submit'
而不是type='button'
@GytisTenovimas按钮将打开模式，因此type='submit'不正确：（您在浏览器控制台中得到了什么吗？您是否“使用”了？）像这样使用yii\bootstrap\Modal；？@Mike控制台中没有任何错误，并且定义了yii\bootstrap4\Modal这里有一个指向模式链接的链接，直接从我的一个表单的HTML复制而来。这是一个铅笔图标，调用了错误的模式，您不需要工具提示，因此对您来说可能是这样的