0
   <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js">
   </script>
<script type="text/javascript">
    $(document).ready(function(){
        $Text = $('td .ms-vb2:lt(50)').css('background-color', '#FF0000');
    }); 
</script>

I have used the above code to highlight negative values.

(I have written 50 since with 0 it did not work)

The lines highlighted do not necessarily have values below 50 so I am not sure that the above script is supposed to do.

My need is to highlight the cell or the whole line if a value (in this case currency so it might have Fr. or $ before) is below zero.

enter image description here

1
  • Can you attach a screenshot. May 18, 2015 at 12:27

3 Answers 3

0

This works for me, assuming the field is a single line of text:

$("td.ms-vb2:contains('-')").css('background-color', 'red');

This works as well, but I believe the above is more efficient:

$('td.ms-vb2').each(function(){if($(this).text().indexOf('-') >= 0) $(this).css('background-color', 'red')});

Office 365 assigns the ms-vb2 class to currency fields as well, so it should work regardless if its a single line of text or currency type.

As per your comment, I don't know know a single line approach, but these should work:

$(".ms-listviewtable > tbody > tr td:nth-child(9):contains('-')").css('background-color', 'red');
$(".ms-listviewtable > tbody > tr td:nth-child(10):contains('-')").css('background-color', 'red');
$(".ms-listviewtable > tbody > tr td:nth-child(11):contains('-')").css('background-color', 'red');
$(".ms-listviewtable > tbody > tr td:nth-child(12):contains('-')").css('background-color', 'red');

Double check the numbers, I may have gotten them wrong. For info on :nth-child(), see here. For :contains(), see here.

If you want the row red instead, then add .closest('tr') between the selector and .class() portion. For example:

$(".ms-listviewtable > tbody > tr td:nth-child(9):contains('-')").closest('tr').css('background-color', 'red');
4
  • spot on, as usual, I have the minor issue that everytime you use the minus symbol in another field it does color also that field, is it possible to limit the functionality of this to the 4 columns carrying the money values (see screenshot above)
    – susan
    May 19, 2015 at 14:25
  • btw I read your links of the other thread but I would not have been able to come up with this code
    – susan
    May 19, 2015 at 14:44
  • I have just noticed now your addition with the nth-child(9) scripts. I have read the documentation and what is the number representing? the columns? The columns displayed in a view? in my above example the columns would be 7, 8, 9, 10? (counting the icon 8,9,10,11?)
    – susan
    Jun 2, 2015 at 7:55
  • If you use Dev Tools (F12 should open dev tools for IE and Chrome), you can inspect the html (they both have a tool that allows you to click on the page, and it will select the code, or if you hover over the code, it'll highlight the elements on the page). This will let you know how many td's there are. nth-child(), in this usage, selects the nth td (nth- selectors are 1 based). Open the dev tools, inspect the table, and count how many columns there are. The icon should be counted, as well as the ellipses for the list item menu, if you have that in the view.
    – wjervis
    Jun 2, 2015 at 18:53
0

Try this

jQuery(document).ready(function(){
    jQuery('td .ms-vb2').each(function() {
        var val = jQuery(this).html();

        if(val != null && val != '') {
            if(val.indexOf("-") > -1) {
                jQuery(this).css("background-color","#FF0000");
            }               
        }
    });
});
2
  • it does not work
    – susan
    May 18, 2015 at 13:18
  • It highlights both lines, while only one is with a negative number
    – susan
    May 18, 2015 at 13:59
0

try applying this

    $(document).ready(function(){ 
        $("td .ms-vb2").each(function () {
           if($(this).val().indexof('-') > -1)
            {
              $(this).css("background-color", "#FF0000");
            }
        })  
    });
6
  • I have uploaded a screenshot after I added your part. Unfortunately it does not work. The line with the value -78 (Fr. -78) is not highlighted.
    – susan
    May 18, 2015 at 12:45
  • You shouldn't be saving value with symbols like $ or Fr. try keeping only values in the list is that possible? May 18, 2015 at 12:50
  • unfortunately we sort of need them, the positive thing is that they are only those 4 and not every single possible currency symbol. Are you telling me your script works provided they are simple numbers with thousand separator and decimals (example 1,000.99)
    – susan
    May 18, 2015 at 13:19
  • I have modified the code just make sure you use ' - ' minus sign ONLY if its a negative value and not for any other purpose May 19, 2015 at 4:52
  • I have applied the code above but the negative value is not highlighted. (the numbers are still like the screenshot I posted)
    – susan
    May 19, 2015 at 7:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.