DotNnetNuke 6 Changes to css class "dnnFormRequired" So that is appear as red asterisk?

Question

I have developed a custom DNN Module. In doing so I have followed DotNetNuke 6 patterns for consistent user experience (For more information have a look at the following guide)

http://uxguide.dotnetnuke.com/UIPatterns/SimpleFormDemo.aspx

How ever I do not like the way DNN default skin shows the required fields. How can I change the mandatory indication to traditional Label: * Textfield

What changes to the skin (css class) should I make to achieve this?

Answer 1

This will require more than just a change to the CSS, as the overall design pattern does not involve putting any "*" in the content. So you will need to not only modify the classes, but content as well. (Unless you go with a JS or other type solution which I don't recommend.)

Answer 2

In your css do something like this to get rid of the red indicator input.dnnFormRequired{border-left: 0px;}

Then I guess you could do some Javascript to add the * after any dnnFormRequired

<script type="text/javascript"> 
$(document).ready(function(){ 
   $("input.dnnFormRequired").after('*'); 
}); 
</script>

Hopefully get you a little further along with what you are trying to achieve. Even if it does break the UI guidelines ;)