Ticket T1014651
Visible to All Users

Xaf Blazor Model Editor DetailView LayoutGroup CustomCSSClassName

created 4 years ago

Hi,

Xaf Blazor model editor LayoutGroup node has not CustomCSSClassName property. Could i access via ViewController and set css class name programmatically?

Show previous comments (6)

    That's what i need. Thank you.
    Problem is localization and SingleChoice dropdown button.

    DevExpress Support Team 4 years ago

      Hi Niels and Kartal,

      CSS classes that we generate for UI elements are not documented and we don't have a list of them. These classes may be also changed in the future. Until we support assigning a custom CSS class to actions, layout groups, etc., it's necessary to manually find an appropriate CSS selector to customize these elements as described at How to implement CSS-related solutions for DevExpress components.

      For example, for a SingleChoiceAction whose ItemType is ItemIsMode, you can use the following style to change the action background along with the drop-down button:

      CSS
      button[data-action-name="MyActionCaption"].btn-secondary, button[data-action-name="MyActionCaption"] + button.btn-secondary { background-color: red; }

      If the SingleChoiceAction ItemType option is ItemIsOperation, use the following CSS:

      CSS
      div[data-action-name="MyActionCaption"] input.form-control[readonly], div[data-action-name="MyActionCaption"] button.btn-secondary { background-color: red; }

      Yes, if you localize your Action captions, it will be necessary to change CSS selectors. Currently, I don't see other ways to implement this except for duplicating styles for each supported language.

        Thanks a lot.

        Answers approved by DevExpress Support

        created 3 years ago

        Hello,

        In v21.2.4 of XAF's Blazor UI, it is possible to set the IModelViewLayoutElementBlazor.CustomCSSClassName property for a layout group in the Model Editor:

        Please refer to the following example:

        Thanks,
        Ilya P

          Show previous comments (1)
          Anatol (DevExpress) 3 years ago

            Hello Kartal,

            We fixed the following issue in v21.2.4: Blazor - It is not possible to set a custom CSS class for actions in the ActionBase.CustomizeControl handler. After the update, you will be able to set a CSS class in code using the DxToolbarItemContentModel.CssClass property.

              Thank you.

              DevExpress Support Team 3 years ago

                Hello,

                In v21.2.4, the IModelActionBlazor.CustomCSSClassName property is also available. It is possible to set it for an action in the Model Editor:

                Please refer to the following example:

                Thanks,
                Ilya P

                Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

                Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.