0

Hi i have a snippet of javascript/JQuery that is reading from a and putting the values in to corresponding div's what i want to know is with what i currently have would it be possible to detect when the value has changed and flash the text or background or something along those lines, here is my code.

       $(document).ready(
    function () {
        setInterval(function () {
            $.getJSON("../../../UpdatedData/MachineCounts/MachineCounts.json", function (data) {
                $(".Midbox").empty().removeClass("YellowBackground").removeClass("redBackground");

                $.each(data, function (key, val) {
                    var DID = "#" + val.controllerID + "D";
                    var NID = "#" + val.controllerID + "N";
                    var DSID = "#" + val.controllerID + "DS";
                    var NSID = "#" + val.controllerID + "NS";


                    var DayScrapPercent = val.ScrapCountDay / val.GoodCountDay * 100;
                    var NightScrapPercent = val.ScrapCountNight / val.GoodCountNight * 100;

                    if (isNaN(DayScrapPercent) == true) {
                        DayScrapPercent = 0;
                    }

                    if (isNaN(NightScrapPercent) == true) {
                        NightScrapPercent = 0;
                    }

                    var DayClass = "";
                    var NightClass = "";


                    if (DayScrapPercent > 3) {
                        DayClass = "yellowBackground";
                    } else if (DayScrapPercent > 5) {
                        DayClass = "redBackground";
                    }

                    if (NightScrapPercent > 3) {
                        NightClass = "yellowBackground";
                    } else if (NightScrapPercent > 5) {
                        NightClass = "redBackground";
                    }

                    $(DID).empty();
                    $(DID).append(Math.abs(val.GoodCountDay)).addClass(DayClass);
                    $(NID).empty();
                    $(NID).append(Math.abs(val.GoodCountNight)).addClass(NightClass);

                    $(DSID).empty();
                    $(DSID).append(Math.abs(DayScrapPercent) + "%");
                    $(NSID).empty();
                    $(NSID).append(Math.abs(NightScrapPercent) + "%");

                });
            });
        }, 5000);
    });

when this looks wit puts data in to divs the data is just numbers, what i need to do is detect when those numbers change and if they have changed flash when they change.

6
  • 1
    This has nothing to do with the duplicate... Commented Apr 8, 2015 at 14:37
  • before emptying the element you must take its content and compare it against the new values.. if they are different then you can do what you want with that element.. Commented Apr 8, 2015 at 14:37
  • @Grimbode Then you and I read the question differently. In which case I would suggest the OP explains the desired output a little better. Commented Apr 8, 2015 at 14:38
  • @RGraham I agree that the title is ambiguous, but he is asking how to "detect when the value has change to then flash a color". Commented Apr 8, 2015 at 14:40
  • @Grimbode Detect the change of the value in the div* i will clarify in my question Commented Apr 8, 2015 at 14:41

0

Browse other questions tagged or ask your own question.