YII2 Adding whenClient to a dynamic form

Question

I have used dynamic form widget. The form fields are shown in the image below. As you can see there is a check box named cancel. What I want is if the cancel check box is clicked, It will only requires the check number and will allow the rest to be empty. Without using dynamic form I can easily implement this using when and whenClient validators since I can get exactly the name of the checkbox.

The problem here is that the dynamic form generates this kind of name series for the checkboxes...

TblDvBub[0][is_cancelled][]
TblDvBub[1][is_cancelled][]
TblDvBub[2][is_cancelled][]

Answer 1

I think you could extract the name of is_cancelled checkbox using 'attribute.name' from 'whenClient' => 'function(attribute, value){}' argument. console.log that 'attribute' - there must be an object with 'name' property - there you may get the number (use regex) of current TblDvBub. By the way why do you use multiple is_cancelled[] field - doesn't it already belong to particular TblDvBub subarray?

Answer 2

1) In the form, you must override fieldClass

<?php $form = ActiveForm::begin([
  'fieldClass' => 'backend\widgets\ActiveField'
]); ?>

2) To override the method

<?php
class ActiveField extends \yii\widgets\ActiveField
{
    protected function getClientOptions()
    {
        $attribute = Html::getAttributeName($this->attribute);
        if (!in_array($attribute, $this->model->activeAttributes(), true)) {
            return [];
        }
        $enableClientValidation = $this->enableClientValidation || $this->enableClientValidation === null && $this->form->enableClientValidation;
        $enableAjaxValidation = $this->enableAjaxValidation || $this->enableAjaxValidation === null && $this->form->enableAjaxValidation;
        if ($enableClientValidation) {
            $validators = [];
            foreach ($this->model->getActiveValidators($attribute) as $validator) {
                /* @var $validator \yii\validators\Validator */
                $js = $validator->clientValidateAttribute($this->model, $attribute, $this->form->getView());
                if ($validator->enableClientValidation && $js != '') {
                    if ($validator->whenClient !== null) {
                        $js = "if (({$validator->whenClient})(attribute, value, '{$this->form->id}')) { $js }";
                    }
                    $validators[] = $js;
                }
            }
        }
        if (!$enableAjaxValidation && (!$enableClientValidation || empty($validators))) {
            return [];
        }
        $options = [];
        $inputID = $this->getInputId();
        $options['id'] = $inputID;
        $options['name'] = $this->attribute;
        $options['container'] = isset($this->selectors['container']) ? $this->selectors['container'] : ".field-$inputID";
        $options['input'] = isset($this->selectors['input']) ? $this->selectors['input'] : "#$inputID";
        if (isset($this->selectors['error'])) {
            $options['error'] = $this->selectors['error'];
        } elseif (isset($this->errorOptions['class'])) {
            $options['error'] = '.' . implode('.', preg_split('/\s+/', $this->errorOptions['class'], -1, PREG_SPLIT_NO_EMPTY));
        } else {
            $options['error'] = isset($this->errorOptions['tag']) ? $this->errorOptions['tag'] : 'span';
        }
        $options['encodeError'] = !isset($this->errorOptions['encode']) || $this->errorOptions['encode'];
        if ($enableAjaxValidation) {
            $options['enableAjaxValidation'] = true;
        }
        foreach (['validateOnChange', 'validateOnBlur', 'validateOnType', 'validationDelay'] as $name) {
            $options[$name] = $this->$name === null ? $this->form->$name : $this->$name;
        }
        if (!empty($validators)) {
            $options['validate'] = new JsExpression("function (attribute, value, messages, deferred, \$form) {" . implode('', $validators) . '}');
        }
        // only get the options that are different from the default ones (set in yii.activeForm.js)
        return array_diff_assoc($options, [
            'validateOnChange' => true,
            'validateOnBlur' => true,
            'validateOnType' => false,
            'validationDelay' => 500,
            'encodeError' => true,
            'error' => '.help-block',
        ]);
    }
}
?>

3) Validation can be used

<?php
'whenClient' => "function(attribute, value, form) {
                    $("form# " + form + " > attribute")
                }"
?>