0

I want to styling validation message in webform for marketers. But I can't find where I can define CSS class or CSS for validation message.

1

There are few ways you can handle this as below -

  1. Update form .cshtml file - You can go and update the FormViewModel.cshtml file on Website\Views\Form\EditorTemplates\FormViewModel.cshtml location and find

    <div class="has-error has-feedback">
        @Html.BootstrapValidationSammary(false)
    </div>
    

    Code and add your custom class to div and add your style to that class whatever you want to add. But in this case, you need to document if someone is going to upgrade this then need to be more careful about this file and override after an upgrade.

  2. Add a custom class by jquery to this section of the form (Add a class on your form and then on the child element for that form add a custom class) and now style as you want on that custom class.

I think these are the ways you can easily manage your validation messages.

6
  • Hi, thank for your answer. I have another question. Is there have any way to custom css validation message for specific field? Example: My form have - Single-line text field - Multil-line text field. These field have different validation messages, can I custom each messages with different style? – Nguyễn Tuyền Nov 20 '19 at 7:38
  • 1
    @NguyễnTuyền - I don't have WFFM set up right now can you please send me screenshot of your HTML by firebug (Inspect element)? of your HTML I can suggest something. – Yogesh Sharma Nov 20 '19 at 8:03
  • Hi, here is the screenshot. This case I have two type of validation.Ex: I want to styling the first one's background-color: blue, the second one is red. imgur.com/5eSRkXe – Nguyễn Tuyền Nov 20 '19 at 8:11
  • @NguyễnTuyền - Can;t you add css class on parent div of your text box? – Yogesh Sharma Nov 20 '19 at 8:29
  • Maybe I got the concept. I could add css class on parent div of the text box, then I define the styling using css selector in custom css file. – Nguyễn Tuyền Nov 20 '19 at 9:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.