Заполнение формы AJAX

[stpu]

Подскажите как решить такую задачу на yii:

Есть форма добавления нового контрагента, мне необходимо после ввода БИК автоматом подгрузить информацию о банке в форму, либо по клику на ссылке заполнить поля формы. Все это должно быть без перезагрузки странички.

Функция которая возвращает информацию о банке написана и возвращает ассоциативный массив.

[chesar]

В чем проблема?

[stpu]

не пойму как вообще это сделать? Как сформировать запрос еще вроде бы понятно, а вот как в форму подставить результат да еще через аякс... в yii пока только учусь Ткните что почитать, а лучше ссылки на примеры

[ElisDN]

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

$('#myform-myfield').val(newVal); 

[stpu]

а более подробный пример есть где нибудь. нагуглить не смог что то

[ElisDN]

Погуглите по слову jQuery.

[stpu]

Да знаю я что такое jquery, а примера использования неужели нигде нет? Гуглил заполнение форм в yii предлагает везбаксы вкн например де Cautocomplite. Но там только с одним полем работа

[Onotole]

$.post()
$.each()
$.val()
Гуглите
За вас тут никто ничего делать не будет

[zelenin]

Да знаю я что такое jquery, а примера использования неужели нигде нет?

вам прямо написали конкретную функцию. Осталось открыть документацию по функции и насладиться так вами искомыми примерами.

[stpu]

Добавил в контролер экшин

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

public function actionUpdateAjax()
{
     $input = Yii::app()->request->getPost('Company');
     $input=$input['short_name'];
        // для примера будем приводить строку к верхнему регистру
        $output = mb_strtoupper($input, 'utf-8');
        // если запрос асинхронный, то нам нужно отдать только данные
        if(Yii::app()->request->isAjaxRequest){
            echo CHtml::encode($output);
            // Завершаем приложение
            Yii::app()->end();
        }
        else {
            // если запрос не асинхронный, отдаём форму полностью
            $this->render('_form', array(
                'short_name'=>$input,
                'output'=>$output,
            ));
        }
}

вьюха

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

<?php $form=$this->beginWidget('bootstrap.widgets.TbActiveForm',array(
    'id'=>'company-form',
    'enableAjaxValidation'=>false,
)); ?>

    <?php echo $form->errorSummary($model); ?>

    <?php echo $form->textFieldRow($model,'short_name',array('class'=>'span5','maxlength'=>255)); ?>
        <?php echo CHtml::label('Результат', 'output'); echo CHtml::textArea('output', ''); ?>
        
<?php echo CHtml::ajaxSubmitButton('Обработать', CHtml::normalizeUrl(array('company/UpdateAjax')), array(
    'type' => 'POST',
    // Результат запроса записываем в элемент, найденный
    // по CSS-селектору #output.
      'update' => '#short_name',
),
array(
    // Меняем тип элемента на submit, чтобы у пользователей
    // с отключенным JavaScript всё было хорошо.
    'type' => 'submit'
));
?>
    <div class="form-actions">
        <?php $this->widget('bootstrap.widgets.TbButton', array(
            'buttonType'=>'submit',
            'type'=>'primary',
            'label'=>$model->isNewRecord ? 'Добавить' : 'Сохранить',
        )); ?>
    </div>

<?php $this->endWidget(); ?>

По клику на кнопку Обработать , если указываю 'update' => '#output', все работает, если меняю на 'update' => '#short_name' - пустота. Ответ от сервера приходит. Я так понимаю не правильно указал имя куда вставлять, но в случае с output атрибуты name и id одинаковые, а в моей форме разные, что и как правильно указать?

И вопрос два: как этот костыль переписать в одну строчку:

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

    $input = Yii::app()->request->getPost('Company');
     $input=$input['short_name'];

[stpu]

Что никто не может сказать как правильно ссылаться на поле в которое ответ записать? Что с чем должно совпадать?

[Onotole]

Что никто не может сказать как правильно ссылаться на поле в которое ответ записать? Что с чем должно совпадать?

Посмотреть исходник браузера, как формируется вывод, скопировать id. Сложно?

[stpu]

Открыл исходник страницы

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

<label for="Company_short_name" class="required">Краткое наименование <span class="required">*</span></label><input class="span5" maxlength="255" name="Company[short_name]" id="Company_short_name" type="text" />   

Во вьюхе так и пишу

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

<?php echo CHtml::ajaxSubmitButton('Обработать', CHtml::normalizeUrl(array('company/UpdateAjax')), array(
    'type' => 'POST',
    // Результат запроса записываем в элемент, найденный
    // по CSS-селектору #output.
      'update' => '#Company_short_name',
),
array(
    // Меняем тип элемента на submit, чтобы у пользователей
    // с отключенным JavaScript всё было хорошо.
    'type' => 'submit'
));
?>

По идее все что я ввиду в поле short_name должно перезаписаться но большими буквами, но почему то ничего не происходит. Подскажите как правильно сослаться на поле

[ElisDN]

По 'update' он пробует записать результат в переданный элемент через $('#elem').html(...). У input-а же значения нужно записывать в value через $('#elem').val(...). Поэтому вместо 'update' подписываемся на 'success' и вручную заполняем поле:

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

<?php echo CHtml::ajaxSubmitButton('Обработать', CHtml::normalizeUrl(array('company/UpdateAjax')), array(
    'type' => 'POST',
    'success'=>'js:function(data) {
        $(\'#Company_short_name\').val(data);
    }',
),
array(
    'type' => 'submit'
));
?>

[stpu]

Спасибо, пока ждал ответа сам так же сделал, JS вообще не знаю, все методом тыка приходилось делать.
Теперь вот думаю как сделать чтобы при вводе в поле девятой цифры автоматом отправился ajax запрос и соответствующие поля заполнились, а не по нажатию на ajaxButton как сейчас.

Думаю надо как то привязаться к валидации поля и в случае успеха отправлять аякс запрос, но для этого надо сделать чтобы форма проверялась после каждого change, а у меня только при нажатии на submit. Пробовал во вьюхе дописать

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

<?php $form=$this->beginWidget('bootstrap.widgets.TbActiveForm',array(
    'id'=>'company-form',
    'enableAjaxValidation'=>true,
    'clientOptions' => array(
            'validateOnSubmit' => true,
            'validateOnChange' => true,
        ),
)); ?>

Но валидация только при сабмите формы так и осталась

[ElisDN]

Событие onChange срабатывает только когда с поля уходим. Для отлова каждого символа лучше вручную отдельным скриптом вместо onChange подвязаться на onKeyPress.

[stpu]

Сделал так

в форме прописал

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

<?php
$baseUrl = Yii::app()->baseUrl;
$cs = Yii::app()->getClientScript();
$cs->registerScriptFile($baseUrl.'/js/companyInfo.js');
?>

в корне создал папку js и положил туда скрипт

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

$(document).ready(function() {
    $('#Company_bank_bik').keyup(function(e) {
        jQuery.ajax(
                {
                    'type': 'POST',
                    'success': function(data) {               
                        var obj = JSON.parse(data.replace(/"/g, '"'));
                        $('#Company_bank_bik').val(obj.bik);
                        $('#Company_bank_name').val(obj.name);
                        $('#Company_bank_korschet').val(obj.ks);
                    },
                    'url': '/transdocs/index.php/company/GetInfoByBIK',
                    'cache': false,
                    'data': jQuery(this).parents("form").serialize()})
    }
    ) 
})

Таким образом все работает, но если меняю keyup на KeyPress все ломается. И куда лучше добавить проверку на количество введенных символов, чтобы посылалось не так много аякс запросов? Правильно ли я понимаю что до вызова jQuery.ajax, но не знаю как получить значение чтобы проверить его длину

[ElisDN]

Получить длину по $(this).val().length().

А адрес /transdocs/index.php/company/GetInfoByBIK сломается при переносе на хостинг. Передавайте адрес в JS через атрибут data-link у input-а.