Yii2,模态和表单提交

时间:2015-11-03 22:41:19

标签: jquery ajax modal-dialog yii2

我在Yii2中有一个表格,其中包含一个用另一种表格打开模态的按钮。

所有代码都在

之下

我遇到的问题是,如果表单验证失败,因为我在模型中有两个属性的唯一验证器,那么页面刷新但进入父级,而不是模态。我如何让renderAjax返回模态,而不是将数据显示在父页面上

很抱歉代码的数量和非常含糊的问题,但我不知道如何解释

查看第一张表格

<style>
div.required label:after {
    content: " *";
    color: red;
}
</style>
<?php
use yii\helpers\Html;
use yii\helpers\Url;
use yii\helpers\ArrayHelper;
use kartik\form\ActiveForm;
use kartik\builder\Form;
use kartik\builder\FormGrid;
use kartik\widgets\DepDrop;
use app\models\Province;
use app\models\Town;

echo '<p><span style="color:red"><strong>*</strong></span> denotes required field.</p>';

$form = ActiveForm::begin(['type'=>ActiveForm::TYPE_VERTICAL, 'options' => ['id' => 'create-workorder-form']]);
echo FormGrid::widget([
    'model'=>$model,
    'form'=>$form,
    'autoGenerateColumns'=>true,
    'rows'=>[
        [
            'contentBefore'=>'<legend class="text-info"><small>Address Info</small></legend>',
            'autoGenerateColumns'=>false,
            'columns'=>12,
            'attributes'=>[       // 2 column layout
                'actions'=>['type'=>Form::INPUT_RAW, 'columnOptions'=>['colspan'=>4], 'value'=>Html::checkbox('use_work_address', 1) . ' ' . Html::label('Use Client Address as Work Address')],
                'actions1'=>[
                    'type'=>Form::INPUT_RAW, 
                    'columnOptions'=>['colspan'=>2], 
                    'value'=>Html::button('New Work Address', [
                        'value' => Url::to(['add-address', 'type'=>'work', 'id'=>$model->id, 'clientId'=>$model->client_id]), 
                        'title' => 'Add Work Address for '.$model->client->client_name, 
                        'class' => 'showModalButton btn btn-success',
                        'form' => 'create-workorder-form',
                        //'data' => ['method' => 'post'],
                    ])
                ],
                'actions2'=>['type'=>Form::INPUT_RAW, 'columnOptions'=>['colspan'=>4], 'value'=>Html::checkbox('use_work_address', 1) . ' ' . Html::label('Use Client Address as Invoice Address')],
                'actions3'=>[
                    'type'=>Form::INPUT_RAW, 
                    'columnOptions'=>['colspan'=>2], 
                    'value'=>Html::button('New Invoice Address', [
                        'value' => Url::to(['add-address', 'type'=>'invoice', 'id'=>$model->id, 'clientId'=>$model->client_id]), 
                        'title' => 'Add Invoice Address for '.$model->client->client_name, 
                        'class' => 'showModalButton btn btn-success',
                        'form' => 'create-workorder-form',
                        //'data' => ['method' => 'post'],
                    ])
                ],
            ],
        ],     

        [
            'attributes'=>[
                'actions'=>[    // embed raw HTML content
                    'type'=>Form::INPUT_RAW, 
                    'value'=>  '<div style="text-align: right; margin-top: 20px">' . 
                        Html::resetButton('Reset', ['class'=>'btn btn-default']) . ' ' .
                        Html::submitButton('Submit', ['class'=>'btn btn-primary']) . 
                        '</div>'
                ],
            ],
        ]
    ]
]);
ActiveForm::end();

控制器:

public function actionAddAddress($id, $type, $clientId) 
{
    //Yii::info($_REQUEST, 'c');
    Yii::info(Yii::$app->request->referrer, 'c');
    $session = Yii::$app->session;
    if(isset($_REQUEST['WorkOrders']))
    {
        $session['savedData'] = $_REQUEST['WorkOrders'];
    }
    //Yii::info($session['savedData'], 'c');
    if($type == 'work')
        $model = new \app\models\WorkAddress();
    if($type == 'invoice')
        $model = new \app\models\InvoiceAddress();

    $model->client_id = $clientId;
    if ($model->load(Yii::$app->request->post()) && $model->validate()) 
    {

        return $this->redirect([Yii::$app->request->referrer]);
    }
    else //(Yii::$app->request->isAjax) 
    {
        Yii::info($model->getErrors(), 'c');
        return $this->renderAjax('_form_addAddress', [
                    'model' => $model,
        ]);
    }
} 

模态表格:

<style>
div.required label:after {
    content: " *";
    color: red;
}
</style>
<?php
use yii\helpers\Html;
use yii\helpers\Url;
use yii\helpers\ArrayHelper;
use kartik\form\ActiveForm;
use kartik\builder\Form;
use kartik\builder\FormGrid;
use yii\widgets\Pjax;

$rows = [
    [
        'contentBefore'=>'<legend class="text-info"><small>Info</small></legend>',
        'attributes'=>[       // 2 column layout
            'name'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter name...']],
            'company'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter email...']],
        ]
    ],
    [
        'attributes'=>[       // 2 column layout
            'telephone'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter telephone...']],
            'mobile'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter mobile...']],
            'email'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter ID...']],
        ]
    ],
    [
        'contentBefore'=>'<legend class="text-info"><small>Address</small></legend>',
        'attributes'=>[       // 2 column layout
            'address_1'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter telephone...']],
            'address_2'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter mobile...']],
        ]
    ],
    [
        'attributes'=>[       // 2 column layout
            'town'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter telephone...']],
            'county'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter mobile...']],
            'postcode'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter ID...']],
        ]
    ],                
];
if($model->formName()=='InvoiceAddress')
{
    $rows[] = [
        'contentBefore'=>'<legend class="text-info"><small>Company Info</small></legend>',
        'attributes'=>[       // 2 column layout
            'vat'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter name...']],
            'company_no'=>['type'=>Form::INPUT_TEXT, 'options'=>['placeholder'=>'Enter email...']],
        ]
    ];
}
$rows[] = [
    'attributes'=>[
        'actions'=>[    // embed raw HTML content
            'type'=>Form::INPUT_RAW, 
            'value'=>  '<div style="text-align: right; margin-top: 20px">' . 
                Html::resetButton('Reset', ['class'=>'btn btn-default']) . ' ' .
                Html::submitButton('Submit', ['class'=>'btn btn-primary']) . 
                '</div>'
        ],
    ],
];
echo '<p><span style="color:red"><strong>*</strong></span> denotes required field.</p>';
Pjax::begin();
$form = ActiveForm::begin(['type'=>ActiveForm::TYPE_VERTICAL, 'options' => ['id' => 'create-address-form']]);
echo FormGrid::widget([
    'model'=>$model,
    'form'=>$form,
    'autoGenerateColumns'=>true,
    'rows'=>$rows,
]);
ActiveForm::end();
Pjax::end();

的Javascript

$(function(){

    $(document).on('click', '.showModalButton', function()
    {
        if ($('#modal').data('bs.modal').isShown) 
        {
            $('#modal').find('#modalContent').load($(this).attr('value'), $("#"+$(this).attr('form')+"").serializeArray());
            document.getElementById('modalHeader').innerHTML = '<h4>' + $(this).attr('title') + '</h4>';
        } 
        else 
        {   $('#modal').modal('show').find('#modalContent').load($(this).attr('value'), $("#"+$(this).attr('form')+"").serializeArray());
            document.getElementById('modalHeader').innerHTML = '<h4>' + $(this).attr('title') + '</h4>';
        }
    });
});

模态

<?php
yii\bootstrap\Modal::begin([
    'headerOptions' => ['id' => 'modalHeader'],
    'id' => 'modal',
    'size' => 'modal-lg',
    //keeps from closing modal with esc key or by clicking out of the modal.
    // user must click cancel or X to close
    'clientOptions' => ['backdrop' => 'static', 'keyboard' => FALSE]
]);
echo "<div id='modalContent'><div style=\"text-align:center\"><img src=\"".Url::to('@web/images/loader.gif')."\"></div></div>";
yii\bootstrap\Modal::end();
?>

0 个答案:

没有答案