Изменение метки набора полей в форме компонентов пользовательского интерфейса


У меня есть форма, построенная с помощью компонентов пользовательского интерфейса.
И при изменении поля я пытаюсь изменить метку набора полей, который содержит это поле.
Вот что у меня есть (значительная часть)

Определение набора полей:

             <fieldset name="steps">
                <settings>
                    <label translate="true">Step config</label>
                    <collapsible>true</collapsible>
                </settings>
                <field name="title" formElement="input" component="[Namespace_Module]/js/fieldset-title">
                    <argument name="data" xsi:type="array">
                        <item name="config" xsi:type="array">
                            <item name="fit" xsi:type="boolean">false</item>
                        </item>
                    </argument>
                    <settings>
                        <validation>
                            <rule name="required-entry" xsi:type="boolean">true</rule>
                        </validation>
                        <dataType>text</dataType>
                        <label>Title</label>
                        <dataScope>title</dataScope>
                    </settings>
                </field>
            </fieldset>

И fieldset-title js-файл, который обрабатывает мое поле заголовка, выглядит так:

define([
    'Magento_Ui/js/form/element/abstract',
    'uiRegistry'
], function (Abstract, uiRegistry) {
    'use strict';

    return Abstract.extend({
        onUpdate: function (value) {
            var fieldset = uiRegistry.get({'name': this.parentName});
            fieldset.label(value);
        }
    });
});

Вот что я хочу сказать... "когда значение моих входных данных изменится, установите то же значение, что и метка набора полей".

Дополнительные информация:
Внутри js набор полей извлекается правильно. Я получаю экземпляр набора полей, который мне нужен.
Переменная value - это то, чего я ожидаю.

Кроме fieldset.label(value); Я пытался fieldset.label = value; fieldset.setLabel(value);, fieldset.getLabel(value);

Author: Marius, 2018-05-08

2 answers

Я сделал это очень уродливым способом (да... jquery). Если у кого-то есть более чистый метод, пожалуйста, поделитесь.

Мой пользовательский компонент теперь выглядит так.

define([
    'Magento_Ui/js/form/element/abstract',
    'jquery'
], function (Text, $) {
    'use strict';

    return Text.extend({
        onUpdate: function (value) {
            $('#' + this.uid).closest('.fieldset-wrapper').find('.fieldset-wrapper-title span:first').html(value);
            return this._super();
        }
    });
});

Не очень горжусь if, но он работает с автономным набором полей.
Но если этот набор полей является частью записи компонента динамических записей, заголовок сбрасывается после добавления или удаления новой записи.

 2
Author: Marius, 2018-05-10 07:33:46

Я немного обновил код, сделав его более чистым и качественным. Это может быть полезно другим:)

define([
    'Magento_Ui/js/form/element/abstract',
    'jquery'
], function (Text, $) {
    'use strict';

    return Text.extend({
        onUpdate: function (value) {
            $("label[for=" + this.uid + "]").text(value);
            return this._super();
        }
    });
});
 0
Author: Anush Starlit, 2019-10-22 07:34:54