Load dynamic data from excel using PHPExcel

Question

I hope I can explain this clearly.

I display 12 characters represent in time

A = 23-1:59 to L = 21-22:59

Everyday have lucky time for example today lucky time are C, D, E and F those need to be bold.

If today time is lucky time the character needs to blink.

We personally specify lucky time each day and we store it in excel.

I used PHPExcel to extract and send it to luckyTime() function

window.setInterval(function(){
    luckyTime(<?php echo json_encode($lucky_data); ?>);
}, 1000);

Here's my code

<span class="cn-time"  id="cn-time-1">A</span>
<span class="cn-time"  id="cn-time-2">B</span>
<span class="cn-time"  id="cn-time-3">C</span>
<span class="cn-time"  id="cn-time-4">D</span>
<span class="cn-time"  id="cn-time-5">E</span>
<span class="cn-time"  id="cn-time-6">F</span>

<span class="cn-time"  id="cn-time-7">G</span>
<span class="cn-time"  id="cn-time-8">H</span>
<span class="cn-time"  id="cn-time-9">I</span>
<span class="cn-time"  id="cn-time-10">J</span>
<span class="cn-time"  id="cn-time-11">K</span>
<span class="cn-time"  id="cn-time-12">L</span>

/* JAVASCRIPT */

function luckyTime(t)

var jArray = t;
var hr = new Date().getHours();
var min = new Date().getMinutes();

$('.cn-time').removeClass("blink");
$('.cn-time').removeClass("lucky-time");

if(jArray[1] == "CHECK") {
    $('#cn-time-1').addClass("lucky-time");
    if(hr == 23 || hr == 0 || hr == 0 && min < 60) {
        $('#cn-time-1').addClass("blink");
    }
} 

if(jArray[2] == "CHECK") {
    $('#cn-time-2').addClass("lucky-time");
    if(hr == 1 || hr == 2 || hr == 2 && min < 60) {
        $('#cn-time-2').addClass("blink");
    }
} 

if(jArray[3] == "CHECK") {
    $('#cn-time-3').addClass("lucky-time");
    if(hr == 3 || hr == 4 || hr == 4 && min < 60) {
        $('#cn-time-3').addClass("blink");

    }
} 

if(jArray[4] == "CHECK") {
    $('#cn-time-4').addClass("lucky-time");
    if(hr == 5 || hr == 6 || hr == 6 && min < 60) {
        $('#cn-time-4').addClass("blink");
    }
} 

if(jArray[5] == "CHECK") {
    $('#cn-time-5').addClass("lucky-time");
    if(hr == 7 || hr == 8 || hr == 8 && min < 60) {
        $('#cn-time-5').addClass("blink");
    }
} 

if(jArray[6] == "CHECK") {
    $('#cn-time-6').addClass("lucky-time");
    if(hr == 9 || hr == 10 || hr == 10 && min < 60) {
        $('#cn-time-6').addClass("blink");
    }
} 

if(jArray[7] == "CHECK") {
    $('#cn-time-7').addClass("lucky-time");
    if(hr == 11 || hr == 12 || hr == 12 && min < 60) {
        $('#cn-time-7').addClass("blink");
    }
} 

if(jArray[8] == "CHECK") {
    $('#cn-time-8').addClass("lucky-time");
    if(hr == 13 || hr == 14 || hr == 14 && min < 60) {
        $('#cn-time-8').addClass("blink");
    }
} 

if(jArray[9] == "CHECK") {
    $('#cn-time-9').addClass("lucky-time");
    if(hr == 15 || hr == 16 || hr == 16 && min < 60) {
        $('#cn-time-9').addClass("blink");
    }
} 

if(jArray[10] == "CHECK") {
    $('#cn-time-10').addClass("lucky-time");
    if(hr == 17 || hr == 18 || hr == 18 && min < 60) {
        $('#cn-time-10').addClass("blink");
    }
} 

if(jArray[11] == "CHECK") {
    $('#cn-time-11').addClass("lucky-time");
    if(hr == 19 || hr == 20 || hr == 20 && min < 60) {
        $('#cn-time-11').addClass("blink");
    }
} 

if(jArray[12] == "CHECK") {
    $('#cn-time-12').addClass("lucky-time");
    if(hr == 21 || hr == 22 || hr == 22 && min < 60) {
        $('#cn-time-12').addClass("blink");
    }
}

My problem is I cannot get the new lucky time for the day when it changed without refreshing the page.

@SylvainMARTIN at the bottom. How can I get the new lucky time when the day changed without refreshing the page? — POGI, Jan 07 '16 at 09:49

score 1 · Accepted Answer · answered Jan 07 '16 at 10:20

Please add ajax request in luckyTime function that's fetch latest data, and return a json formatted data :

window.setInterval(function(){
    luckyTime();
}, 1000);

function luckyTime(){
    $.ajax({
        url:"getLatestData.php",
        success:function(r){
            var jArray = JSON.parse(r);
            var hr = new Date().getHours();
            var min = new Date().getMinutes();

            $('.cn-time').removeClass("blink");
            $('.cn-time').removeClass("lucky-time");

            if(jArray[1] == "CHECK") {
                $('#cn-time-1').addClass("lucky-time");
                if(hr == 23 || hr == 0 || hr == 0 && min < 60) {
                    $('#cn-time-1').addClass("blink");
                }
            } 

            if(jArray[2] == "CHECK") {
                $('#cn-time-2').addClass("lucky-time");
                if(hr == 1 || hr == 2 || hr == 2 && min < 60) {
                    $('#cn-time-2').addClass("blink");
                }
            } 

            if(jArray[3] == "CHECK") {
                $('#cn-time-3').addClass("lucky-time");
                if(hr == 3 || hr == 4 || hr == 4 && min < 60) {
                    $('#cn-time-3').addClass("blink");

                }
            } 

            if(jArray[4] == "CHECK") {
                $('#cn-time-4').addClass("lucky-time");
                if(hr == 5 || hr == 6 || hr == 6 && min < 60) {
                    $('#cn-time-4').addClass("blink");
                }
            } 

            if(jArray[5] == "CHECK") {
                $('#cn-time-5').addClass("lucky-time");
                if(hr == 7 || hr == 8 || hr == 8 && min < 60) {
                    $('#cn-time-5').addClass("blink");
                }
            } 

            if(jArray[6] == "CHECK") {
                $('#cn-time-6').addClass("lucky-time");
                if(hr == 9 || hr == 10 || hr == 10 && min < 60) {
                    $('#cn-time-6').addClass("blink");
                }
            } 

            if(jArray[7] == "CHECK") {
                $('#cn-time-7').addClass("lucky-time");
                if(hr == 11 || hr == 12 || hr == 12 && min < 60) {
                    $('#cn-time-7').addClass("blink");
                }
            } 

            if(jArray[8] == "CHECK") {
                $('#cn-time-8').addClass("lucky-time");
                if(hr == 13 || hr == 14 || hr == 14 && min < 60) {
                    $('#cn-time-8').addClass("blink");
                }
            } 

            if(jArray[9] == "CHECK") {
                $('#cn-time-9').addClass("lucky-time");
                if(hr == 15 || hr == 16 || hr == 16 && min < 60) {
                    $('#cn-time-9').addClass("blink");
                }
            } 

            if(jArray[10] == "CHECK") {
                $('#cn-time-10').addClass("lucky-time");
                if(hr == 17 || hr == 18 || hr == 18 && min < 60) {
                    $('#cn-time-10').addClass("blink");
                }
            } 

            if(jArray[11] == "CHECK") {
                $('#cn-time-11').addClass("lucky-time");
                if(hr == 19 || hr == 20 || hr == 20 && min < 60) {
                    $('#cn-time-11').addClass("blink");
                }
            } 

            if(jArray[12] == "CHECK") {
                $('#cn-time-12').addClass("lucky-time");
                if(hr == 21 || hr == 22 || hr == 22 && min < 60) {
                    $('#cn-time-12').addClass("blink");
                }
            }
        }
    }); 
}

My function late to addClass("blink") it take 10secs and up to effect even I've already set my interval to 100ms — POGI, Jan 07 '16 at 13:14

Load dynamic data from excel using PHPExcel

1 Answers1