Comment créer un champ de formulaire en lecture seule en utilisant des composants ui?


10

J'ai cette définition ui-composant d'un champ de formulaire dans mon module 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>

et j'essaie de le faire en lecture seule. Non désactivé. En lecture seule.
J'ai essayé d'ajouter:

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

à la section config, mais évidemment j'ai échoué.
Comment rendre le champ en lecture seule? Puis-je rendre le champ en lecture seule?


Quelle différence entre les paramètres "désactivé" et "en lecture seule"? À mon avis, les deux paramètres fonctionnent de manière similaire.
Siarhey Uchukhlebau

1
D'après ce que je sais, désactivé signifie que le champ n'est pas envoyé par la poste et qu'en lecture seule est envoyé. Mon plan est de modifier la valeur du champ en lecture seule via du javascript.
Marius

Bien sûr, mais sous forme magento régulière (pas ui) l'attribut "readonly" signifie l'attribut html "désactivé". Sinon, vous devez utiliser un composant personnalisé ou un script personnalisé, car l'attribut "en lecture seule" n'existe pas pour les composants ui.
Siarhey Uchukhlebau

Je vais juste m'en tenir à votre réponse maintenant. J'espère juste que je n'aurai pas besoin de désactiver un champ à l'avenir.
Marius

Laissez formElement en entrée et ajoutez du texte elementTmpl comme ceci <item name = "elementTmpl" xsi: type = "string"> ui / form / element / text </item> Refer: magento.stackexchange.com/a/296735/14271
Magento_Newbie

Réponses:


18

Essayez d'ajouter le disabledparamètre à l'élément comme ceci:

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

Le résultat doit être similaire au readonlyparamètre de l'élément de formulaire normal:

résultat


1
Je suis perplexe ici. ça marche, mais ça me semble mal. Si le champ est désactivé, comment se fait-il qu'il soit toujours envoyé via POST? Quoi qu'il en soit, c'est une question différente. Je vais prendre cela pour acquis pour l'instant.
Marius

5
@Marius Ceci est probablement dû au fait que lorsqu'un formulaire est envoyé depuis le backend, ce n'est pas le formulaire réel qui est soumis, mais un nouveau formulaire avec des champs masqués qui est créé lorsque vous cliquez sur Enregistrer. Le formulaire est créé en fonction des champs de votre fichier XML UI Components et des champs marqués avec data-form-part. Jetez un oeil à module-ui/view/base/web/js/form/form.js::initConfig(), validate()et submit(). Regardez aussi lib/mage/utils/misc.js::submit(). Ces combinés ajoutent un nouveau formulaire à la fin du corps qui est réellement soumis.
Giel Berkers du

@GielBerkers. J'ai fait quelques recherches après avoir posé cette question et je suis arrivé à la même conclusion que vous l'avez expliqué. Tu as raison. Les données soumises ne proviennent pas d'un formulaire.
Marius

J'ai aussi le même problème .. Je veux activer le champ de prix pour le produit configurable .. Ici, j'ai expliqué le lien
Gopal Kacha

@Marius, Comment créer un champ disableduniquement sous forme d'édition et non sous une nouvelle forme?
Vinaya Maheshwari
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.