41
Views
5
Comments
Solved
How to remove mandatory class from a list
Question

I'm making an admin page and I have a series of lists and forms.

I'm using sql to get the data for the lists.

Now, several of the fields are mandatory, which I love for the forms and is needed.

They are given the mandatory class (which makes the red tip show.

However, those same items are also in lists and I don't want the mandatory class on them.

How do I remove those classes?

Also, I feel that if I use javascript to remove each class from each item, it will become unmaintainable.

Rank: #89
Solution

Hi

@Miguel is right,

Also you can use 

.not-valid{ border:none !important}

it will remove red border from inputs.


Regards

Rahul Sahu

mvp_badge
MVP
Rank: #132

Hello David,

I don't understand your question. What classes on the list did you refer to? Is mobile, web (traditional), or reactive?

Can you show an example with a print screen?

Thanks.

BR,

Luis

Hi,

If I understand your question, if the fields are not mandatory, no message should appear, you can still search for the class, and in the container of each input of your form, change the class that puts the red, in the last case you can use the! Important, but remember that this is a last resort.


I hope that, if you have understood your question well, this can help you.

Cheers

Rank: #89
Solution

Hi

@Miguel is right,

Also you can use 

.not-valid{ border:none !important}

it will remove red border from inputs.


Regards

Rahul Sahu

Rank: #4001

This is for reactive web.

Here is my example.

I'm having the admins make models to expedite entering in new computers.

Some fields are mandatory in the form (which I want).

However, when they are in the list, I don't want them to show as mandatory, but they are still highlighted that way and I don't see how to remove that class in the list.


issue001.png

Rank: #4001

Thank you all!

I found the problem.

I just added the following classes to the labels in the lists:

SyntaxEditor Code Snippet

[data-label].mandatory-label:after {
    content: "";   
}