UI 구성 요소를 사용하여 양식 필드를 읽기 전용으로 만드는 방법은 무엇입니까?


10

내 Magento 2 모듈에서 양식 필드 의이 ui 구성 요소 정의가 있습니다.

    <field name="name">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="dataType" xsi:type="string">text</item>
                <item name="label" xsi:type="string" translate="true">Some Label</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="source" xsi:type="string">something_here</item>
                <item name="sortOrder" xsi:type="number">10</item>
                <item name="dataScope" xsi:type="string">name</item>
                <item name="notice" xsi:type="string" translate="true">Enter something here</item>
                <item name="validation" xsi:type="array">
                    <item name="required-entry" xsi:type="boolean">true</item>
                </item>
            </item>
        </argument>
    </field>

그리고 읽기 전용으로 만들려고합니다. 비활성화되지 않았습니다. 읽기 전용입니다.
나는 추가를 시도했다 :

<item name="readonly" xsi:type="boolean">true</item>  

구성 섹션에 있지만 분명히 실패했습니다.
필드를 읽기 전용으로 만들려면 어떻게해야합니까? 필드를 읽기 전용으로 만들 수 있습니까?


"disabled"와 "readonly"매개 변수의 차이점은 무엇입니까? 제 생각에 두 매개 변수는 비슷한 방식으로 작동합니다.
Siarhey Uchukhlebau

1
내가 아는 것에서 disabled는 게시물을 통해 필드가 전송되지 않고 읽기 전용이 전송됨을 의미합니다. 내 계획은 일부 자바 스크립트를 통해 읽기 전용 필드의 값을 수정하는 것입니다.
Marius

물론 ui가 아닌 일반 마 젠토 형식의 "readonly"속성은 html 속성 "disabled"를 의미합니다. 다른 방법으로 ui 구성 요소에 대해 "readonly"속성이 없기 때문에 사용자 정의 구성 요소 또는 사용자 정의 스크립트를 사용해야합니다.
Siarhey Uchukhlebau

나는 지금 당신의 대답을 고수하려고합니다. 미래에 실제로 필드를 비활성화 할 필요가 없기를 바랍니다.
Marius

formElement를 입력으로두고이 <item name = "elementTmpl"xsi : type = "string"> ui / form / element / text </ item>과 같은 텍스트 elementTmpl을 추가하십시오. 참조 : magento.stackexchange.com/a/296735/14271
Magento_Newbie

답변:


18

다음 disabled과 같이 요소에 매개 변수 를 추가하십시오 .

<field name="is_active">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="label" xsi:type="string">Status</item>
            <item name="dataType" xsi:type="string">number</item>
            <item name="formElement" xsi:type="string">checkbox</item>
            <item name="source" xsi:type="string">vendor_rules_rule_form.vendor_rules_rule_form_data_source.is_active</item>
            <item name="prefer" xsi:type="string">toggle</item>
            <item name="disabled" xsi:type="boolean">true</item>
            <item name="valueMap" xsi:type="array">
                <item name="true" xsi:type="string">1</item>
                <item name="false" xsi:type="string">0</item>
            </item>
            <item name="sortOrder" xsi:type="number">12</item>
        </item>
    </argument>
</field>

결과는 readonly일반 양식 요소 의 매개 변수 와 유사해야합니다 .

결과


1
나는 당황했다. 작동하지만 나에게는 잘못 보입니다. 필드가 비활성화 된 경우 POST를 통해 어떻게 오는가? 어쨌든 이것은 다른 질문입니다. 나는 이것을 당연한 것으로 받아 들일 것이다.
Marius

5
@Marius 이것은 백엔드에서 양식을 제출할 때 제출 된 실제 양식이 아니라 저장을 클릭 할 때 숨겨진 필드가있는 새 양식이기 때문에 발생합니다. 양식은 UI 구성 요소 XML 파일의 필드 및로 표시된 필드에 따라 작성됩니다 data-form-part. 한 번 봐 module-ui/view/base/web/js/form/form.js::initConfig(), validate()그리고 submit(). 또한보십시오 lib/mage/utils/misc.js::submit(). 이 조합은 실제로 제출 된 본문 끝에 새 양식을 추가합니다.
Giel Berkers

@GielBerkers. 나는이 질문을 한 후에 약간의 연구를 해 왔으며 당신이 설명한 것과 같은 결론에 도달했습니다. 네 말이 맞아 제출 된 데이터는 양식에서 제공되지 않습니다.
Marius

나는 또한 이슈를 좋아해야한다. 나는 구성 가능한 제품을위한 가격 필드를 가능하게하고 싶다. 여기에서 링크를
Gopal Kacha

@Marius, disabled새 양식이 아닌 편집 양식으로 만 필드를 만드는 방법은 무엇입니까?
Vinaya Maheshwari
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.