e-frank/yii2-knockout

ActiveForm replacement. Automatically generates knockoutjs viewmodels from yii ActiveRecords. Allows computed fields and nested forms.

Knockout Viewmodel Generator for Yii2

This extension provides a replacement for ActiveForm. A KnockoutJS viewmodel is automatically generated (using knockout mapping lib), which serves a starting point for your customization, e.g. computed observables. Moreover you get some more input types, like "decimal", "percent", "date" and "datetime", which display the raw data in the user's locale format and store the data in ISO-format., _(*1)

Installation

The preferred way to install this extension is through composer., _(*2)

Either run, _(*3)

php composer.phar require --prefer-dist e-frank/yii2-knockout "*"

or add, _(*4)

"e-frank/yii2-knockout": "*"

to the require section of your composer.json file., _(*5)

Usage

example code for a view. note that you would place model load and validation code in your controller/action., _(*6)

title  = 'Programmatic Viewmodel Generation';
    
// init data from default or post
$post = Yii::$app->request->post();
$data = empty($post) ? [
    'title' => '', 
    'value' => 1234.56, 
    'date'  => sprintf('%s%d:00', date('Y-m-d H:'), date('i') - (date('i') % 15))
    ] : $post['DynamicModel'] ;

// create a dynamic model, for demonstration purpose
$model = new yii\base\DynamicModel($data);
$model->addRule(['title'], 'string', ['max' => 128]);
$model->addRule(['title'], 'required');
$model->addRule(['value'], 'number', ['min' => 0]);

// validate, usually done in controller
if (!empty($post)) {
    $model->validate();
}

// show what we have got
var_dump([
    'attributes' => $model->attributes,
    'errors'     => $model->getErrors(),
    'post'       => $post,
    ]);

?>

 $model->getErrors(), 'defaults' => ['decimals' => 3]]); ?>



    
= $this->title ?>
    

        = $form->field($model, 'title') ?>
        field($model, 'value')->decimal(['decimal' => ['thousandsSeparator' => ' ']]) ?>
        = $form->field($model, 'value')->decimal() ?>
        computed raw data: 
        computed user's display format: 
        

        = $form->field($model, 'date')->datetime() ?>
        

    
    

        

            
                VALIDATE
            
            
            
        
    

custom viewModel enhancements, located at the end of your view, after all other scripts are loaded:, _(*7)

the demo page should look like this:, _(*8)

, _(*9)