Magento – Knockout js : Read parent of parent’s data

knockoutknockoutjsmagento2

I want to read the parent of parent elements data. But, I can't able to read it properly.

My Array Screenshot :

My Code :

<!-- ko foreach: { data: Object.keys($parent.optionParam()[main_id]), as: 'attribute' } -->
    <div class="product-custom-option-select">
        <p style="font-weight:bold;color:blue" data-bind="text:attribute"></p>
        <!-- ko if: Array.isArray(Object.keys($parent.optionParam()[main_id][attribute])) -->
            <p style="font-weight:bold;color:green" data-bind="text:attribute"></p>
            <!-- ko foreach: $parents[1].optionParam[$parentContext.$index()][attribute] -->
                <p class="options-label" data-bind="text:sub_id"></p>
            <!-- /ko -->
        <!-- /ko -->
        <!-- ko if: !Array.isArray($parent.optionParam()[$index][attribute]) -->
            <p style="font-weight:bold;color:red" data-bind="text:attribute"></p>
            <p class="options-label" data-bind="text:attribute[$parents[1].main_id]"></p>
        <!-- /ko -->
    </div>
<!-- /ko -->

Using $parent.optionParam()[main_id] I can able to access 0 element array. So, in first <p> tag I get Size text as attribute.

Now, I want to read there are sub-element available in Size or Color, If true then, First Array.isArray() should be true and I can able to read sub_color or sub_id field value.

<!-- ko if: Array.isArray(Object.keys($parent.optionParam()[main_id][attribute])) -->

This line always returns an error to me.

How can I read it?

Any help would be appreciated.

Best Answer

$parent is essentially an array with all the parents in the current context.

So $parent or $parent[0] refers to immediate parent, $parent[1] will refer to grandparent or parent of parent and so on.

Related Solutions

Magento – Magento 2.1 Create a filter in the product grid by new attribute

No need to add any custom code. In magento2.x available default setting under the attribute

Go admin side Stores -> Attributes -> Product and open your created attribute

After click Advanced Attribute Properties tab under the Properties tab and set Yes below two fields

Use in Filter Options: Yes (Select "Yes" to add this attribute to the list of filter options in the product grid.)
Add to Column Options: Yes (Select "Yes" to add this attribute to the list of column options in the product grid. )

After saving attribute and check product grid.

Please see the attached screenshot.

Magento 2 – Add New Field to Magento_User Admin Form

For adding image field, you can try using plugin and always try to avoid overwrite whole class.

Vendor/Module/etc/adminhtml/di.xml


<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\User\Block\User\Edit\Tab\Main">
        <plugin name="sr_stackexchange_user_form" type="Vendor\Module\Plugin\Block\Adminhtml\User\Edit\Tab\Main" sortOrder="1"/>
    </type>
</config>

Vendor/Module/Plugin/Block/Adminhtml/User/Edit/Tab/Main.php


namespace Vendor\Module\Plugin\Block\Adminhtml\User\Edit\Tab;

class Main
{
    /**
     * Get form HTML
     *
     * @return string
     */
    public function aroundGetFormHtml(
        \Magento\User\Block\User\Edit\Tab\Main $subject,
        \Closure $proceed
    )
    {
        $form = $subject->getForm();
        if (is_object($form)) {
            $fieldset = $form->addFieldset('admin_user_image', ['legend' => __('User Image')]);
            $fieldset->addField(
                'user_image',
                'image',
                [
                    'name' => 'user_image',
                    'label' => __('Image'),
                    'id' => 'user_image',
                    'title' => __('Image'),
                    'required' => false,
                    'note' => 'Allow image type: jpg, jpeg, png'
                ]
            );

            $subject->setForm($form);
        }

        return $proceed();
    }
}

Clear cache.

Related Topic