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.