Question

我通过尝试使用它来学习Yii2。

我有一张带有一些清单的表格。我想在移动中实现添加新列表选项的功能。

目前点击＆＃34;添加新选项＆＃34;按钮调用弹出窗体。提交后，Yii带我到这个新选项的页面。这就是原因：

public function actionCreate()
{
    $model = new Request();

    if ($model->load(Yii::$app->request->post()) && $model->save()) {
        return $this->redirect(['view', 'id' => $model->id]);
    } else {
        return $this->render('create', [
            'model' => $model,
            'manager' => Stuff::find()->all(),
            'movercompany' => MoverCompany::find()->all(),
            'worktype' => Worktype::find()->all(),
            'customer' => Customer::find()->all(),
        ]);
    }
}

在submittimg之后我想要的只是刷新更新列表并选择新选项。

我该怎么做？

_form.php这个：

<?php

use yii\helpers\Html;
use yii\helpers\ArrayHelper;
use yii\helpers\Url;
use yii\widgets\ActiveForm;
use kartik\select2\Select2;
use yii\bootstrap\Modal;

/* @var $this yii\web\View */
/* @var $model app\models\Request */
/* @var $form yii\widgets\ActiveForm */
?>

<div class="request-form">

    <?php 
        $form = ActiveForm::begin();
        date_default_timezone_set("Europe/Moscow");
        $model->request_date = date('Y-m-d');
        $model->request_time = date('H:i');
    ?>

    <?= $form->field($model, 'request_date')->widget(\yii\jui\DatePicker::classname(), [
        'language' => 'ru',
        'dateFormat' => 'yyyy-MM-dd',
    ]) ?>

    <?= $form->field($model, 'request_time')->textInput(['style' => 'width: 70px;']) ?> 

    <?= $form->field($model, 'customer_id')->widget(Select2::classname(), [
        'data' => ArrayHelper::map($customer, 'id', 'fullInfo'),
        'language' => 'ru',
        'options' => ['placeholder' => 'Выбрать клиента...'],
        'pluginOptions' => [
            'allowClear' => true
        ],
    ]);?>

    <?= $form->field($model, 'KP_id')->textInput() ?>


    <?= $form->field($model, 'quantity')->input('number', ['style' => 'width: 75px;']) ?>
    <div>

        <?= $form->field($model, 'request_type')->dropDownList(
            ArrayHelper::map($worktype, 'id', 'title'),
            array('prompt' => 'Выберите вид работ:', 'style' => 'width: 200px;')
        ) ?>

        <?= Html::button('+', ['value' => Url::to('index.php?r=worktype/create'), 'class' => 'btn btn-success', 'id' => 'modalButton']) ?>

    </div>
    <?php
        Modal::begin([
                'header' => '<h4>Виды работ</h4>',
                'id' => 'modal',
                'size' => 'modal-lg',
            ]);
        echo "<div id='modalContent'></div>";
        Modal::end();
    ?>

    <?= $form->field($model, 'payment_type')->dropDownList(
        [
            '0' => 'Нал',
            '1' => 'Безнал'
        ], 
        ['style' => 'width: 80px;']) 
    ?>

    <?= $form->field($model, 'address')->textarea(['rows' => 2]) ?>

    <?= $form->field($model, 'minimal_payment')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'mover_company_id')->dropDownList(
        ArrayHelper::map($movercompany, 'id', 'name'),
        array('prompt' => 'Выберите компанию:', 'style' => 'width: 200px;')
    ) ?>

    <?= $form->field($model, 'manager_id')->dropDownList(
        ArrayHelper::map($manager, 'id', 'name'),
        array('prompt' => 'Выберите менеджера:', 'style' => 'width: 200px;')
    ) ?>

    <?= $form->field($model, 'workers_number')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'workhours')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'payment_additional')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'payment_car')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'payment_sum')->input('number', ['style' => 'width: 100px;']) ?>

    <?= $form->field($model, 'status')->dropDownList(
        [
            '0' => 'Открыт',
            '1' => 'Закрыт'
        ],
        ['style' => 'width: 200px;'] 
    ) ?>

    <?= $form->field($model, 'comment')->textarea(['rows' => 2]) ?>

    <div class="form-group">
        <?= Html::submitButton($model->isNewRecord ? 'Создать' : 'Обновить', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
    </div>

    <?php ActiveForm::end(); ?>

</div>

Answer 1

我已经使用下一种技术实现了这一点。

我需要在“请求表单”页面上的“公司列表”中动态添加一个选项。

首先，我们在公司控制器中创建新的操作。它与actionCreate的不同之处在于renderAjax而不是render并返回1而不是带你到新的公司页面：

public function actionAdd（） { $ model = new Company（）;
```
if ($model->load(Yii::$app->request->post()) && $model->save()) {
    echo 1;
} else {
    return $this->renderAjax('create', [
        'model' => $model,
    ]);
};
```
}
添加按钮到包含公司列表的视图的_form.php：
Url :: to（＆＃39; index.php？r = company / add＆＃39;），＆＃39; class＆＃39; =＆GT; ＆＃39; btn btn-success＆＃39;，＆＃39; id＆＃39; =＆GT; ＆＃39; modalButton＆＃39;]）？＆gt;
添加包含用于创建新公司的表单的弹出窗口。

3.1。 _form.php中的模态窗口：

use yii\bootstrap\Modal;
use yii\widgets\Pjax;

<?php
    Modal::begin([
        'header' => '<h4>Company<h4>',
        'id' => 'modal',
        'size' => 'modal-lg',
    ]);

    echo "<div id='modalContent'></div>";

    Modal::end();
?>

3.2。将pjax应用于公司列表：

<?php Pjax::begin(['id' => 'companyList']); ?>
...
<?php Pjax::end(); ?>

3.3。编辑资产/ AppAsset.php：

public $js = [
    'js/main.js'
];

3.4。创建文件夹和js文件web / js / main.js：

$(function(){
    $('#modalButton').click(function(){
        $('#modal').modal('show')
            .find('#modalContent')
            .load($(this).attr('value'));
    });
});

3.5。将脚本添加到公司视图_form.php：

<?php

$script = <<< JS

$('form#{$model->formName()}').on('beforeSubmit', function(e)
{
    var \$form = $(this);
    $.post(
        \$form.attr("action"), // serialize yii2 form
        \$form.serialize()
    )
        .done(function(result) {
        if(result == 1)
        {
            $(document).find('#modal').modal('hide');
            $.pjax.reload({container:'#companyList'});
            $(document).on('pjax:complete', function() {
              $('#customer-company_id option:last-child').attr('selected', true);
            })
        }else
        {
            $(\$form).trigger("reset");
            $("#message").html(result.message);
        }
        }).fail(function()
        {
            console.log("server error");
        });
    return false;
});

JS;

$this->registerJs($script);

?>

以下是我们所拥有的：按“添加”按钮会弹出一个带有新选项属性的表单。提交此表单将关闭弹出窗口，刷新公司列表并选择最后一个选项。非常粗鲁，但它确实有效。

添加新列表选项，动态刷新更新列表

1 个答案: