CODEWITHSUNDEEP
javascriptjquery
Marcie
Marcie

Reputation: 70

color as JQuery variable in for loop

I have a for loop that I am using to validate fields in my form where I apply or disable certain classes depending on if the validation passes or not.

See below

function inlineValidate(t, o, c) {
var i;
for (i in o) {
    $(t).parent().find(i)[o[i]]();
} 
$(t).css("border-color", c);
};

In addition I have a color variable that I am already using elsewhere in my code that I would like to apply to the "c" parameter above:

var grey = {'border-color': '#ccc'};
var red = {'border-color': '#ff999'};

Below is my each function where I am trying to use my color variable:

$(".validName").each(function() {

    if ($(this).attr('data-req')){
        var val = $(this).val();
        var minLength = defaultMinNameLength
        if (validateName(val) && validateLength(val,minLength)){
            inlineValidate(this, { '.correct': 'fadeIn', '.incorrect': 'hide' },grey);
        } else {
            errors++;
            inlineValidate(this, { '.correct': 'hide', '.incorrect': 'fadeIn' }, red);
        }
    }
});

I can see that the "border-color" is a bit repetitive so I tried removing the "border-color" from the for loop like this: 

$(t).css(c);

But it doesn't work. Does anyone have any ideas?

Thanks!

Upvotes: 0

Views: 57

Answers (1)

Jamiec
Jamiec

Reputation: 136094

using .css it's not enough to set just the border color - by default the border width is 0px.

You can do this:

var c = {'border-color':'#ff9999','border-width':'1px','border-style':'solid'};

or you can this:

var c = {'border':'1px solid #ff9999'};

Live example: http://jsfiddle.net/caoo0zgd/

Upvotes: 2

Related Questions