Yii2 - ActiveForm ajax soumettre

Comment puis-je utiliser ActiveForm à ces exigences?

Soumettre le formulaire avec ajax.
Avant de le soumettre avec ajax: Vérifier si l'erreur se ferme.
Après la présentation: l'erreur d'Affichage de champ en dessous du champ de saisie si le serveur réponses unsuccess économie de résultat.

En fait, c'est juste ce que Yii fournit déjà avec le ActiveForm - y compris le code JavaScript de validation automatique sur le client avant l'envoi des données au serveur.
Il n'est pas de soumettre le formulaire avec AJAX qui est ce que l'utilisateur demande.

InformationsquelleAutor Văn Thái Nguyễn | 2015-02-08

C'est votre forme dans la vue. Je préfère utiliser différentes actions pour la validation et l'enregistrement. Vous pouvez vous joindre à eux dans une seule méthode.

<?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(); ?>

En action de validation, vous devez écrire. Il valide le formulaire et retourne la liste de errrs au client. :

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);
    }
}

Et c'est économiser de l'action. En valider la saisie de données de sécurité:

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,
    ]);
}

Ce code permettra de valider votre formulaire dans actionValidate() et. Pour soumettre votre formulaire via AJAX utilisation beforeSubmit événement. Dans votre fichier javascript écrire:

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

C'est tout.

Je pense que vous devriez utiliser on("submit", ....) au lieu de on("beforeSubmit", ...)
Je dois décider si je dois retourner false ou true basé sur l'appel Ajax en réponse. Mais avant de l'ajax en réponse au retour de faux est d'obtenir exécutée. Merci de me suggérer un moyen de le faire.
Ajax est asynchrone et vous ne pouvez pas retourner le résultat de l'intervention en général. Je ne sais pas javascript bien. Mais vous pouvez regarder pour async/await. Peut-être vous aider.

InformationsquelleAutor Pikaev Viktor

Soumettre le formulaire avec ajax.
Avant de soumettre avec ajax: Vérifier si l'erreur se ferme. yii d'erreur s'affiche si par défaut....... 🙂

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>

InformationsquelleAutor Kalpesh Desai

Vous devez vous connecter pour publier un commentaire.