JQuery validation Element error/valid css not showing

Question

I am using Jquery Validation on a user control as such:

 $("#form1").validate({
                 rules: {
                            <%=textb.UniqueID  %>: 
                            { 
                                required: true 
                            },
                        },
                messages: {
                            <%=textb.UniqueID  %>:
                                {
                                    required: "Please Enter value",
                                },
                        },
                highlight: function(element, errorClass, validClass) {
                           //$(element).css({ backgroundColor: '#0f0' });
                           $(element).addClass(errorClass).removeClass(validClass);
                        },
                unhighlight: function(element, errorClass, validClass) {
                            //$(element).css({ backgroundColor: '#fff' });
                           $(element).removeClass(errorClass).addClass(validClass);
                          }
            });

This is the CSS I am using:

.error input {
    color: #b92d23;
}
.error {
      background: #000;
}

Now I can see the error and valid classes added to the input/textbox. but the CSS won't take effect to change the background colour.

If I do $(element).css({ backgroundColor: '#fff' }); it changes the colour but want to do it from CSS file(I can see my other CSS class but not error).

In firebug it looks like this :

<input type="text" class="UC_longtextfield error" id="mypage_txbLoanAmount" name="mypage$txbLoanAmount">
<label for="mypage_txbLoanAmount" generated="true" class="error">Please Enter value</label>

Arun P Johny · Accepted Answer · 2013-07-26 09:58:12Z

2

Your css is wrong

input.error {
    color: #b92d23;
}

answered Jul 26, 2013 at 9:58

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

web2008 · Accepted Answer · 2013-07-26 10:40:47Z

1

have you checked the CSS file path? Are you able to see css file gets added to the your page?

If css file is added to ur page properly then you need to check whether error/valid classes are being added to the input element properly or not?

If css get loaded properly and classes gets added to the input element then below styles should reflect on that particular element:

input.error {
color: #b92d23;
}

answered Jul 26, 2013 at 10:40

web2008

9144 silver badges11 bronze badges

Collectives™ on Stack Overflow

JQuery validation Element error/valid css not showing

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related