ajax + yii2

Общие вопросы по использованию второй версии фреймворка. Если не знаете как что-то сделать и это про Yii 2, вам сюда.
Ответить
Adigezalov
Сообщения: 51
Зарегистрирован: 2017.10.14, 23:52

ajax + yii2

Сообщение Adigezalov »

Всем привет.
Такая ситуация.
Есть форма, сейчас она написана стандартным html методом. Форму заполняем, нажимаем Отправить, все уходит с помощью js (ajax) на сервер, с сервера в js приходит ответ и, в зависимости от ответа, на сайте вылазит уведомление о результате отправки.
Хочется переделать стандартный html на ActiveForm, но как тогда быть с всплывающими сообщениями? Как получить ответ от сервера, чтобы все также можно было выдавать сообщение о результате отправки?
an.viktory@gmail.com
Сообщения: 536
Зарегистрирован: 2016.09.05, 23:21

Re: ajax + yii2

Сообщение an.viktory@gmail.com »

создайте допустим

Код: Выделить всё

<div id='ajax_response'></div>
и запихните туда через Jquery результат вашего ajax ответа success
Аватара пользователя
leonenco
Сообщения: 155
Зарегистрирован: 2017.01.30, 22:42

Re: ajax + yii2

Сообщение leonenco »

Controller

Код: Выделить всё

public function actionIndex()
    {
        $model = new ContactForm();
        if(\Yii::$app->request->isAjax){
            Yii::$app->mailer->compose()
                ->setTo(Yii::$app->params['adminEmail'])
                ->setFrom(['твой-имэйл' => 'Automatic request email'])
                ->setSubject('Request a quote from ' . \Yii::$app->request->post('ContactForm')['name'])
                ->setHtmlBody($this->render('eMail', ['request' => Yii::$app->request->post('ContactForm')]))
                ->send();
            \Yii::$app->response->format = Response::FORMAT_JSON;
            return ['key' => 'success', 'value' => "Thank you for contacting me. I will respond to you as soon as possible."];
        } else {
            return $this->render('index', ['model' => $model]);
        }
    }
Форма на сайте:

Код: Выделить всё

	<?php $form = ActiveForm::begin([
            'id' => 'request-quote-form',
            'options' => ['class' => 'form', 'role' => 'form'],
        ]);
            echo $this->render('_request', [
                'model' => $model,
                'form' => $form,
            ]);
        ActiveForm::end(); ?>
Непосредственно форма которая находится в тойже папке вьюх->сайт

Код: Выделить всё

<?php
use yii\captcha\Captcha;
use yii\helpers\Html;
?> 
<?= $form->field($model, 'name', [
    'template' => "{label}{input}<div class='col-lg-12 text-center'>{hint}\n{error}</div>",
    'labelOptions' => [ 'class' => 'sr-only', 'for' => 'name'],
])->textInput()->input('text', ['placeholder' => 'Enter Your Name']) ?>
<?= $form->field($model, 'email', [
    'template' => "{label}{input}<div class='col-lg-12 text-center'>{hint}\n{error}</div>",
    'labelOptions' => [ 'class' => 'sr-only', 'for' => 'email'],
    ])->input('email', ['placeholder' => 'Enter Your Email'])->hint('Your e-mail address is necessary in order to contact you and it will not be sold to third parties.') ?>
<?= $form->field($model, 'message', [
    'template' => "{label}{input}<div class='col-lg-12 text-center'>{hint}\n{error}</div>",
    'labelOptions' => [ 'class' => 'sr-only', 'for' => 'message'],
])->textarea(['class' => 'form-control', 'rows'=>3, 'placeholder' => 'Enter Your message here']) ?>
<?= Html::button($content = 'Close', $options = ['class' => 'btn btn-default', 'data-dismiss' => 'modal']); ?>
<?= Html::submitButton($content = 'Send request', $options = ['class' => 'btn btn-primary', 'id' => 'submit']); ?>
Форматишь ее под свой стайл. А вот и Jquery code из main.js:

Код: Выделить всё

$(document).ready(function() {    
    $('.modal').on('submit', '#request-quote-form', function(e){
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data) {
                $('.modal .modal-body .messages').append('<div class="alert alert-' + data.key + ' alert-dismissible fade in" role="alert">');
                $('.modal .modal-body .messages .alert').append('<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>');
                $('.modal .modal-body .messages .alert').append(data.value);
                $('.modal .modal-body .messages').append('</div>')
                setTimeout(function(){
                    $('.modal .modal-body .messages .alert').alert('close');
                    $('.modal #request-quote-form').trigger('reset');
                    $('.modal').modal('toggle');
                }, 3000);
            }
        })
        return false;
    })
});
Опять же форматируешь куда нужно выводить
Ответить