2

I have defined a constant with hexadecimal color code like this:-

var textboxModifySuccessColor = '#E7FBBD';

In my JS code, I am using this variable to set the background-color using jQuery css method like this:-

$(this).find('option:selected').css('background-color', textboxModifySuccessColor);

But, When I am trying to retrieve the same using css method I am getting it in rgb format like this:-

rgb(10, 36, 106)

I have used the function mentioned in this thread & this one too but it is returning #0A246A instead of #E7FBBD. I have also tried the CSS Hooks solution but it is returning me highlight. What I should do to get exactly the same color in hexadecimal format i.e. #E7FBBD?

P.S.- It was working fine in IE 7, but this problem started with IE 11.

Update:-

I have reviewed my code again and found that the conversion by the method given is perfect, the problem is while rendering the code itself, I have printed the hexadecimal color(as I have defined) and it's rgb equivalent (as rendered by browser) onto the console like this:-

console.log("Before-" + textboxModifySuccessColor);
$(this).find('option:selected').css('background-color', textboxModifySuccessColor);
console.log("AfterSet-" + $(this).find('option:selected').css('background-color'));

This is giving me below ouput:-

Before-#E7FBBD
AftreSet-rgb(10, 36, 106)

But, When I tried converting the E7FBBD hexadecimal code using this, the actual rgb should be : rgb(231,251,189). Is the browser rendering it wrong?

Here is my JS code:-

$(document).delegate('.myDDlClass', 'change', function () {
        var currentRow = $(this).closest('tr');
        var someText= $.trim(currentRow.find('td select.clsTest').val());
        $(this).closest('tr').find('td select.clsTest').css("background-color", textBoxOriginalBackgroundColor);
        $(this).find('option').css('background-color', textBoxOriginalBackgroundColor);
        if (someText!= SelectDefaultValue) {
            $(this).find('option:selected').css('background-color', textboxModifySuccessColor); //Problem here
        }
    });
Community
  • 1
  • 1
Rahul Singh
  • 21,585
  • 6
  • 41
  • 56
  • duplicate of http://stackoverflow.com/questions/1740700/how-to-get-hex-color-value-rather-than-rgb-value – Brijesh Bhatt Apr 27 '15 at 12:01
  • 2
    @BrijeshBhatt - Please read the question properly, I have already mentioned I have tried that but it's not working for me. – Rahul Singh Apr 27 '15 at 12:02
  • Can you post the hook code you are using? – Muggles Apr 27 '15 at 12:04
  • @Muggles - Exactly same as it is in the mentioned thread. – Rahul Singh Apr 27 '15 at 12:05
  • @RahulSingh Have a look at http://www.mindfiresolutions.com/Retrieve-Hex-Code-of-RGB-format-color-to-avoid-cross-browser-back-color-issue-1004.php – Muggles Apr 27 '15 at 12:16
  • in your console.log before statement, put `console.log("Before-" + $(this).find('option:selected').css('background-color')` instead, see if the color even changes – ddavison Apr 27 '15 at 12:50
  • @sircapsalot - Okay I have placed another console b4 and found, that it is still printing `rgb(10, 36, 106)`, then I went ahead and analyzed the code more and found that somewhere we are setting al the options like this: `$(this).find('option').css('background-color', textBoxOriginalBackgroundColor);` where textBoxOriginalBackgroundColor is `transparent`, thnx I didn't noticed it was not updating the color as well. But why it is not updating? – Rahul Singh Apr 27 '15 at 13:06
  • it's most likely the context of `this`. can you show the surrounding js? – ddavison Apr 27 '15 at 13:09
  • @sircapsalot - Please check my update with my JS. – Rahul Singh Apr 27 '15 at 13:33

0 Answers0