CODEWITHSUNDEEP
razorblazor
spindi598
spindi598

Reputation: 351

change classes for element

I saw this post, the answers are from about a year ago, and am hoping that there is a better way to do this now.

The second answer by user11623871 seems to be the best way to do this that I could find, but when there are multiple different class names applied to an element, it will be hard to make sure all the right ones are applied.

Is there something in blazor like in JS where I can just simply select the element and then remove or add a class whenever needed?

What it would look like in plain js:

var element = document.getElementById("myDIV");
element.classList.add("mystyle");

Upvotes: 1

Views: 357

Answers (1)

tbdrz
tbdrz

Reputation: 2190

Something like this?

<div class="@string.Join(" ", CSSClasses)"></div>

<button type="button" @onclick="Add">ADD</button>
<button type="button" @onclick="Remove">REMOVE</button>

@code {

    private List<string> CSSClasses = new List<string>();

    void Add()
    {
        CSSClasses.Add("Class1");
        CSSClasses.Add("Class2");
    }


    void Remove()
    {
        CSSClasses.RemoveAll(x => x == "Class1");
    }
}

Upvotes: 1

Related Questions