Yii2 - ActiveForm ax 제출

Yii2 - ActiveForm ax 제출

다음과 같은 요구 사항과 함께 ActiveForm을 사용하려면 어떻게 해야 합니까?

• ajax와 함께 양식을 제출합니다.

• ajax를 사용하여 제출하기 전에:오류가 종료되는지 확인합니다.

• 제출 후:서버 응답이 저장 결과에 실패할 경우 필드의 입력 아래에 필드 오류를 표시합니다.

이것이 당신이 볼 수 있는 양식입니다.저는 검증 및 저장을 위해 다른 작업을 사용하는 것을 선호합니다.이들을 단일 방법으로 결합할 수 있습니다.

<?php $form = \yii\widgets\ActiveForm::begin([
    'id' => 'my-form-id',
    'action' => 'save-url',
    'enableAjaxValidation' => true,
    'validationUrl' => 'validation-rul',
]); ?>

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

<?= Html::submitButton('Submit'); ?>
<?php $form->end(); ?>

유효성 확인 작업에서 작성해야 합니다.양식의 유효성을 검사하고 오류 목록을 클라이언트에 반환합니다. :

public function actionValidate()
{
    $model = new MyModel();
    $request = \Yii::$app->getRequest();
    if ($request->isPost && $model->load($request->post())) {
        \Yii::$app->response->format = Response::FORMAT_JSON;
        return ActiveForm::validate($model);
    }
}

그리고 이것이 세이브 액션입니다.보안을 위해 입력 데이터의 유효성을 검사하지 않음:

public function actionSave()
{
    $model = new MyModel();
    $request = \Yii::$app->getRequest();
    if ($request->isPost && $model->load($request->post())) {
        \Yii::$app->response->format = Response::FORMAT_JSON;
        return ['success' => $model->save()];
    }
    return $this->renderAjax('registration', [
        'model' => $model,
    ]);
}

이 코드는 Validate() 및 작업에서 양식의 유효성을 검사합니다.제출 이벤트 전에 AJAX를 통해 양식을 제출하는 경우.javascript 파일에 다음과 같이 적습니다.

$(document).on("beforeSubmit", "#my-form-id", function () {
    // send data to actionSave by ajax request.
    return false; // Cancel form submitting.
});

그게 전부입니다.

ajax와 함께 양식을 제출합니다.ajax를 사용하여 제출하기 전에:오류가 종료되는지 확인합니다.yii 기본적으로 오류가 있는 경우 표시...... :)

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\widgets\Pjax;

/* @var $this yii\web\View */
/* @var $model backend\models\search\JobSearch */
/* @var $form yii\bootstrap\ActiveForm */
?>

<div class="job-search">

    <?php $form = ActiveForm::begin([
        'action' => ['index'],
        //'method' => 'get',
        'options' => ['id' => 'dynamic-form111']
    ]); ?>

    <?php echo $form->field($searchModel, 'id') ?>

    <?php echo $form->field($searchModel, 'user_id') ?>

    <?php echo $form->field($searchModel, 'com_id') ?>

    <?php echo $form->field($searchModel, 'job_no') ?>

    <?php echo $form->field($searchModel, 'court_id') ?>

    <?php // echo $form->field($model, 'case_no') ?>

    <?php // echo $form->field($model, 'plainttiff') ?>

    <?php // echo $form->field($model, 'defendant') ?>

    <?php // echo $form->field($model, 'date_fill') ?>

    <?php // echo $form->field($model, 'court_date') ?>

    <?php // echo $form->field($model, 'status_id') ?>

    <?php // echo $form->field($model, 'created_at') ?>

    <?php // echo $form->field($model, 'updated_at') ?>

    <div class="form-group">
        <?php echo Html::submitButton('Search', ['class' => 'btn btn-primary','id'=>'submit_id']) ?>
        <?php echo Html::resetButton('Reset', ['class' => 'btn btn-default']) ?>
    </div>

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

</div>  
<script type="text/javascript">
    $(document).ready(function () {
        $('body').on('beforeSubmit', 'form#dynamic-form111', function () {
            var form = $(this);
            // return false if form still have some validation errors
            if (form.find('.has-error').length) 
            {
                return false;
            }
            // submit form
            $.ajax({
            url    : form.attr('action'),
            type   : 'get',
            data   : form.serialize(),
            success: function (response) 
            {
                var getupdatedata = $(response).find('#filter_id_test');
                // $.pjax.reload('#note_update_id'); for pjax update
                $('#yiiikap').html(getupdatedata);
                //console.log(getupdatedata);
            },
            error  : function () 
            {
                console.log('internal server error');
            }
            });
            return false;
         });
    });
</script>

언급URL : https://stackoverflow.com/questions/28394918/yii2-activeform-ajax-submit