Como criar um campo de formulário somente leitura usando componentes de interface do usuário?


10

Eu tenho essa definição de componente de interface do usuário de um campo de formulário No meu módulo Magento 2.

    <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>

e estou tentando torná-lo somente para leitura. Não desabilitado. Apenas de leitura.
Eu tentei adicionar:

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

para a seção de configuração, mas obviamente eu falhei.
Como posso fazer o campo somente leitura? Posso fazer o campo somente leitura?


Qual a diferença entre os parâmetros "disabled" e "readonly"? Na minha opinião, ambos os parâmetros funcionam de maneira semelhante.
Siarhey Uchukhlebau 14/10

1
Pelo que sei, desativado significa que o campo não é enviado por correio e somente leitura é enviado. Meu plano é modificar o valor do campo somente leitura através de algum javascript.
Marius

Claro, mas na forma regular de magento (não na interface do usuário), o atributo "readonly" significa o atributo html "disabled". De outro modo, você deve usar um componente personalizado ou um script personalizado, pois o atributo "somente leitura" não existe para os componentes da interface do usuário.
Siarhey Uchukhlebau 14/10

Eu só vou ficar com a sua resposta agora. Só espero não precisar desativar um campo no futuro.
Marius

Deixe formElement como entrada e adicione texto elementTmpl como este <item name = "elementTmpl" xsi: type = "string"> ui / form / elemento / texto </item> Consulte magento.stackexchange.com/a/296735/14271
Magento_Newbie

Respostas:


17

Tente adicionar o disabledparâmetro ao elemento assim:

<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>

O resultado deve ser semelhante ao readonlyparâmetro para o elemento de formulário regular:

resultado


1
Estou intrigado aqui. funciona, mas parece errado para mim. Se o campo estiver desativado, como ainda é enviado via POST? Enfim, esta é uma pergunta diferente. Vou tomar isso como garantido por enquanto.
Marius

5
@ Marius Isso é mais provável porque, quando um formulário é enviado pelo back-end, não é o formulário real enviado, mas um novo formulário com campos ocultos criado quando você clica em salvar. O formulário é criado de acordo com os campos no arquivo XML de componentes da interface do usuário e os campos marcados com data-form-part. Dê uma olhada module-ui/view/base/web/js/form/form.js::initConfig(), validate()e submit(). Veja também lib/mage/utils/misc.js::submit(). Estes combinados adicionam um novo formulário no final do corpo que é realmente enviado.
Giel Berkers

@GielBerkers. Fiz algumas pesquisas depois de fazer essa pergunta e cheguei à mesma conclusão que você explicou. Você está certo. Os dados enviados não vêm de um formulário.
Marius

Eu também tenho a mesma como questão .. Eu quero permitir campo de preço para o produto configurável .. Aqui eu expliquei ligação
Gopal Kacha

@ Marius, Como criar campo disabledapenas no formulário de edição e não no novo formulário?
Vinaya Maheshwari
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.