Label HTML class

[AlexAlbala]

Hi,

I am working in an auto-generated backoffice based on mongoose schemas using this library ( thank you ! :D). I have found these two attributes which are very helpful in order to customize the visual style: htmlClass and fieldHtmlClass.

i.e:

x-schema-form: {
htmlClass: "col-md-6",
fieldHtmlClass: "myclass"
}

My question is if it is possible to add a css class also in the label of the field (it will be very helpful in order to full customize the visibility of all the fields). My proposal is, following your specifications, something like:

x-schema-form: {
labelHtmlClass: "myclass"
}

Do you think that it will be possible ?

If you think that it is a good idea but you do not have time to develop it, I can contribute with this change in a few weeks (maybe months :P)

Thank you!

[Dervisevic]

I personally think it's a good idea, not sure if/when we have time to do it so a PR is always appreciated. The only tedious part of it is going into every decorator and every type (like this) and adding it to the templates. Additionally all addons should be updated to support it, but this is a lesser issue. So yeah, go for it!

[Knuckles9090]

Yeah, I was actually trying to figure how to show a red * sign on my forms to indicate required fields. I guess this would solve the problem.

[AlexAlbala]

I have created a pull request adding this feature :)

#327

[egshankle]

@Knuckles9090 There's info on adding a required asterisk on individual fields at https://github.com/Textalk/angular-schema-form/blob/141101ef03a28fc9787efc38cb26bf4217d5874d/docs/index.md#inline-feedback-icons.

If you want the asterisk to appear on all required fields you can add it under options / formDefaults:

 $scope.options = {
            "formDefaults":
            {
                //adds asterisk icon to indicate all required fields, keeps default success and error icons
                "feedback": "{ 'glyphicon': true, 'glyphicon-asterisk': form.required && !hasSuccess() && !hasError() ,'glyphicon-ok': hasSuccess(), 'glyphicon-remove': hasError() }"
            }
        }

To make it red:

.glyphicon-asterisk:before {
    content: "\2a";
    color: red;
}