Sorry i did not find simple solution. I'd like to change text color inside my cell depending on its value.
Very simple table:
<table>
<tbody>
<tr>
<td>Quantity</td>
<td>1</td>
</tr>
</tbody>
</table>
My formatting rules:
I found this code but I cannot use it inside my file, thanks
$('#mytable tr td').each(function(){
if($(this).text() > 1)$(this).css('background-color','red');
});
Can anyone suggestion a solution?
Further, and if I have my table with other numeric cells like this one:
<table>
<tbody>
<tr>
<td>price</td>
<td>20</td>
</tr>
<tr>
<td>quantity</td>
<td>2</td>
</tr>
</tbody>
</table>
Can I apply code only for a cell?
I have to make this change by editing prestashop mailaltert module that sends the order confirmation email.
In mailorder.php I should include the condition to change color in the cell where the quantity is.
The email will be generated on the basis of new_order.html file -is the mail template-, get the data generated by mailorder.php
Where should I put the script code? I can past file part if is necessary. thanks
Use parseFloat to check if the value is a number - and if so then apply the styling based on the value:
$('#mytable tr td').each(function(){
var cellValue = $(this).html();
if(!isNaN(parseFloat(cellValue))) {
if (cellValue > 1) {
$(this).css('background-color','red');
} else {
$(this).css('background-color','yellow');
}
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="mytable">
<tbody>
<tr>
<td>Quantity</td>
<td>1</td>
</tr>
<tr>
<td>Quantity</td>
<td>3</td>
</tr>
<tr>
<td>Quantity</td>
<td>2</td>
</tr>
</tbody>
</table>Try this code, and change the code and script and if conditions according to your choice.
$('#mytable tr td').each(function(){
var cellValue = $(this).html();
if(!isNaN(parseFloat(cellValue))) {
if (cellValue == 1) {
$(this).css('background-color','red');
}
if(cellValue==2){
$(this).css('background-color','green');
}
if(cellValue==3){
$(this).css('background-color','blue');
}
if(cellValue==4){
$(this).css('background-color','yellow');
}
}
});table tr td
{
padding:10px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="mytable" border="1" style="border-collapse:collapse;">
<tbody>
<tr>
<td>Quantity</td>
<td>1</td>
</tr>
<tr>
<td>Quantity</td>
<td>3</td>
</tr>
<tr>
<td>Quantity</td>
<td>2</td>
</tr>
<tr>
<td>Quantity</td>
<td>1</td>
</tr>
<tr>
<td>Quantity</td>
<td>3</td>
</tr>
<tr>
<td>Quantity</td>
<td>2</td>
</tr>
</tbody>
</table>