0

How do I change the color of the value displayed in a table with different colors, if urgent then text color red for an example? Its a value from the back-end.

Javascript

var priority = objs[i].priority;
switch(objs[i].priority)
{
    case '1': priority = "Urgent"; break;
    case '2': priority = "Major"; break;
}
tr.find(".td_priority").text(priority);
Zain Aftab
  • 703
  • 7
  • 21
  • You can create a class for each priority. – Cuong Le Ngoc Jul 17 '19 at 03:21
  • As your example doesn't make full sense to me, here's a general approach on how to change a text color with jQuery: `$(element).css('color', 'red');` – icecub Jul 17 '19 at 03:21
  • 2
    Possible duplicate of [How can I change the text color with jQuery?](https://stackoverflow.com/questions/2001366/how-can-i-change-the-text-color-with-jquery) – Tibrogargan Jul 17 '19 at 03:22

4 Answers4

0

You can either use css method present on jquery https://www.w3schools.com/jquery/jquery_css.asp

Or

If the text colors are pre-defined.. You can create different classes for the colors and just update the className based on switch

0

To add the color for text use .css('color', 'red').

it will be like.

$(document).ready(function(){
objs = 1;
var priority = objs;
var color ='';
switch(objs) //in your case use objs[i].priority. I used objs for example
{
  
  case 1: priority = "Urgent"; color = 'red'; break; //if it's Urgent, add color red
  case 2: priority = "Major"; color = 'green'; break; //for example if it's Major, add color green
}

$('tr').find(".td_priority").text(priority).css('color', color); //for text add css


});
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<table>
<tr>
<td class="td_priority"></td>
</tr>
</table>
Shivendra Singh
  • 2,986
  • 1
  • 11
  • 11
0
In Here The problem might be You check case as a string value.But I think 
objs[i].priority returns an integer value not string type.

In Your Answer
==============
var priority = objs[i].priority;
switch(objs[i].priority) 
{
//checks case as a string so value of priority does not changes (Does not 
//true the case)
  case '1': priority = "Urgent"; break; //checks case as a string so nothing changes
  case '2': priority = "Major"; break; //checks case as a string so nothing changes
}
tr.find(".td_priority").text(priority);

-------------------------------------------------------------------------

So try this,
============

var priority = objs[i].priority;
switch(priority)
{
  case 1: priority = "Urgent"; break; //Remove Quote Marks
  case 2: priority = "Major"; break; //Remove Quote Marks
}
tr.find(".td_priority").text(priority);
0

Try something like

var myown = objs[i].myown; 
switch(myown) 
{ 
case 1: 
myown = "Green"; 
break; 
case 2: 
myown = "Red"; 
break; 
} 

and then

tr.find(".td_pmyown").text(myown);

Hope this will help you out

Navnish Bhardwaj
  • 1,687
  • 25
  • 39