css in javascript important not working

Question

I am trying to change the border color of any control in my page using javascript . The color change but then returns back to the original color . first i tried :

control.style.border = "solid 1px red";

then I tried :

control.attr('style', 'border : solid 1px red  ');

also :

addStyleAttribute(control, 'border : solid 1px red  !important');

finally :

 var all = document.styleSheets,
 s = all[all.length - 1],
 l = s.cssRules.length;
 if (s.insertRule) {
 s.insertRule('#' + control.id+ ' {border: solid 1px red !important }', l);
 }

all of the above didnt work

any help ?

Just checking: Does it work if you set the style in your stylesheet? — Cerbrus, Oct 16 '14 at 09:28
"but then returns back to the original color" — When does it does this? It sounds like you are reloading the page, which would wipe out any local DOM changes. — Quentin, Oct 16 '14 at 09:29
my code is on WebForm_OnSubmit() . on submitting the page the color changes for a few seconds but then 'disappear' . — kassar, Oct 16 '14 at 09:33
Then there might be something wrong with your CSS instead... What's your current HTML / CSS? — Cerbrus, Oct 16 '14 at 09:35
http://stackoverflow.com/questions/4616964/css-important-not-working — Amy, Oct 16 '14 at 09:36

score 1 · Answer 1 · answered Oct 16 '14 at 09:37

on submitting the page the color changes for a few seconds but then 'disappear'

You are changing the page, then submitting the form, then a new page loads, and the change you made to the old page is not in the new page.

You'll need to make the change in the new page too. Typically you'll want to do this by using server side code in your form handler.

css in javascript important not working

1 Answers1