manish thakur
Reputation: 820
How to Hide / Show Image on HTML page
I am working with Dynamic HTML table in which I am showing my data as in HTML table as my data is in large amount so what I am doing is showing amount of data which will be fixed to one screen, So here i am showing 12 rows at one time then after 5 seconds page refresh hen next 12 and so on, When it reaches to the last page than what I am doing is calling the JSON object again and doing whole process again because in my code that JSON data will be dynamic
Issue I am facing
- I have done all the things to refresh page after 5 seconds and calling whole data when it reaches to last page
- Now what I am trying to do is when it is the last page than after that want to show a
imagefor 10secondsthan again call the whole process - Now the whole process on first go will be like table will show 12 rows than if there is more data it will show next 12 row of table and when it reaches the last page I want to show an Image for 10 seconds then call the JSON object again to go through whole process again
- In my code I have commented What I am doing where
var tableValue = [{
"Item Name": "MANCHOW V SOUP",
"SellingPrice": 100
}, {
"Item Name": "MANCHOW NV SOUP ",
"SellingPrice": 125
}, {
"Item Name": "CEASER SALAD V",
"SellingPrice": 175
}, {
"Item Name": "CEASER SALAD NV",
"SellingPrice": 230
}, {
"Item Name": "GAMBUS REBOZADAS",
"SellingPrice": 350
}, {
"Item Name": "PANCO FISH FINGER",
"SellingPrice": 270
}, {
"Item Name": "MUSHROOM DUPLEX",
"SellingPrice": 160
}, {
"Item Name": "FRENCH FRIES",
"SellingPrice": 99
}, {
"Item Name": "HONEY GARLIC PRAWN",
"SellingPrice": 350
}, {
"Item Name": "CHICKEN MANCHURIAN",
"SellingPrice": 180
}, {
"Item Name": "MUSHROOM CHILLY",
"SellingPrice": 120
}, {
"Item Name": "SALT N PEPPER BABY CORN",
"SellingPrice": 120
}, {
"Item Name": "SOUTHERN STYLE CHICKEN",
"SellingPrice": 210
}, {
"Item Name": "PANEER NAGGETS",
"SellingPrice": 210
}, {
"Item Name": "HARA BHARA KEBAB",
"SellingPrice": 160
}, {
"Item Name": "CHICKEN TIKKA",
"SellingPrice": 210
}, {
"Item Name": "KALMI KEBAB",
"SellingPrice": 250
}, {
"Item Name": "PIZZA MARGARITTA",
"SellingPrice": 200
}, {
"Item Name": "PIZZA VEG FARMHOUSE",
"SellingPrice": 200
}, {
"Item Name": "BBQ CHICKEN PIZZA",
"SellingPrice": 225
}, {
"Item Name": "CHICKEN TIKKA PIZZA",
"SellingPrice": 225
}, {
"Item Name": "PESTO SAUCE",
"SellingPrice": 175
}, {
"Item Name": "ARABIATA",
"SellingPrice": 160
}, {
"Item Name": "PINK SAUCE",
"SellingPrice": 160
}, {
"Item Name": "GARBANZO BEAN SALAD",
"SellingPrice": 90
}, {
"Item Name": "MASALA PAPAD",
"SellingPrice": 50
}, {
"Item Name": "PEANUT MASALA",
"SellingPrice": 60
}, {
"Item Name": "GAJAR KA HALWA",
"SellingPrice": 90
}, {
"Item Name": "WATERMELON MARTINI",
"SellingPrice": 281
}, {
"Item Name": "Kiwi martini",
"SellingPrice": 281
}, {
"Item Name": " Apple gin",
"SellingPrice": 225
}, {
"Item Name": "Cucumber cooler ",
"SellingPrice": 281
}, {
"Item Name": "Martini",
"SellingPrice": 225
}, {
"Item Name": "Pink lady",
"SellingPrice": 225
}, {
"Item Name": " Bloody marry",
"SellingPrice": 281
}, {
"Item Name": "Cosmopolitan",
"SellingPrice": 281
}, {
"Item Name": "Sex on the beach",
"SellingPrice": 281
}, {
"Item Name": "Bull frog",
"SellingPrice": 506
}, {
"Item Name": "Long island iced tea ",
"SellingPrice": 393
}, {
"Item Name": "Pinacolada",
"SellingPrice": 225
}, {
"Item Name": "Daiquiri",
"SellingPrice": 225
}, {
"Item Name": "Mojito ",
"SellingPrice": 281
}, {
"Item Name": "Whisky sour",
"SellingPrice": 281
}, {
"Item Name": "Hot toddy",
"SellingPrice": 225
}, {
"Item Name": "Margarita",
"SellingPrice": 337
}, {
"Item Name": "Tequila sunrise",
"SellingPrice": 337
}, {
"Item Name": "Red sangria",
"SellingPrice": 225
}, {
"Item Name": "White sangria",
"SellingPrice": 247
}, {
"Item Name": "Rose sangria",
"SellingPrice": 247
}, {
"Item Name": "By chance special ",
"SellingPrice": 168
}, {
"Item Name": "Made in heaven",
"SellingPrice": 168
}, {
"Item Name": "Strawberry delight",
"SellingPrice": 168
}, {
"Item Name": "DRAGON",
"SellingPrice": 168
}, {
"Item Name": "Mangochil ",
"SellingPrice": 168
}, {
"Item Name": "Cucumber cola",
"SellingPrice": 168
}, {
"Item Name": "Virgin mojito",
"SellingPrice": 168
}, {
"Item Name": "Virgin mary",
"SellingPrice": 168
}, {
"Item Name": "Virgin pinacolada",
"SellingPrice": 168
}, {
"Item Name": "CORONA",
"SellingPrice": 438
}, {
"Item Name": "CRAFT BEERS",
"SellingPrice": 337
}, {
"Item Name": "BIRA WHITE 330",
"SellingPrice": 157
}, {
"Item Name": "BIRA BLONDE 330",
"SellingPrice": 135
}, {
"Item Name": "BIRA STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "KINGFISHER PREMIUM 330",
"SellingPrice": 123
}, {
"Item Name": "KINGFISHER PREMIUM 650",
"SellingPrice": 202
}, {
"Item Name": "KINGFISHER STRONG 330",
"SellingPrice": 135
}, {
"Item Name": "KINGFISHER STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "KINGFISHER ULTRA 330",
"SellingPrice": 146
}, {
"Item Name": "KINGFISHER ULTRA 650",
"SellingPrice": 281
}, {
"Item Name": "KINGFISHER ULTRA MAX 330",
"SellingPrice": 146
}, {
"Item Name": "KINGFISHER ULTRA MAX 650",
"SellingPrice": 281
}, {
"Item Name": "BUDWIESER 330",
"SellingPrice": 146
}, {
"Item Name": "BUDWIESER 650",
"SellingPrice": 270
}, {
"Item Name": "BUDWIESER MAGNUM 330",
"SellingPrice": 168
}, {
"Item Name": "BUDWIESER MAGNUM 650",
"SellingPrice": 281
}, {
"Item Name": "TUBORG 330",
"SellingPrice": 123
}, {
"Item Name": "TUBORG 650",
"SellingPrice": 191
}, {
"Item Name": "TUBORG STRONG 330",
"SellingPrice": 123
}, {
"Item Name": "TUBORG STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "CRANBERRY ",
"SellingPrice": 157
}, {
"Item Name": "ORANGE",
"SellingPrice": 157
}, {
"Item Name": "JAMICAN",
"SellingPrice": 157
}, {
"Item Name": "BLACK BERRY",
"SellingPrice": 157
}, {
"Item Name": "BLUE BERRY",
"SellingPrice": 157
}, {
"Item Name": "MOET CHANDON",
"SellingPrice": 787
}, {
"Item Name": "SULA BRUT",
"SellingPrice": 168
}, {
"Item Name": "MATEUS ROSE",
"SellingPrice": 213
}, {
"Item Name": "HARDYS SIRAZ CABERNET 750",
"SellingPrice": 189
}, {
"Item Name": "HARDYS SIRAZ CABERNET BY GLASS",
"SellingPrice": 382
}, {
"Item Name": "JACOB CREEK SIRAZ 750",
"SellingPrice": 180
}, {
"Item Name": "JACOB CREEK SIRAZ BY GLASS",
"SellingPrice": 360
}, {
"Item Name": "BIG BANAYAN CHENNIN BLANC 750",
"SellingPrice": 990
}, {
"Item Name": "BIG BANAYAN CHENNI",
"SellingPrice": 202
}, {
"Item Name": "SULA CHENIN BLANC 750 ",
"SellingPrice": 129
}, {
"Item Name": "SULA CHENIN BLANC BY GLASS",
"SellingPrice": 258
}, {
"Item Name": "FOUR SEAZON CLASSIC",
"SellingPrice": 112
}, {
"Item Name": "FOUR SEAZON CLASSIC ",
"SellingPrice": 225
}, {
"Item Name": "BIG BANAYAN CARBINET ",
"SellingPrice": 112
}, {
"Item Name": "BIG BANAYAN CARBINE",
"SellingPrice": 225
}, {
"Item Name": "SULA SATORI MERLOT 750",
"SellingPrice": 123
}, {
"Item Name": "SULA SATORI MERLOT BY GLASS",
"SellingPrice": 247
}, {
"Item Name": "GROVERS LA RESERVE 750",
"SellingPrice": 180
}, {
"Item Name": "GROVERS LA RESERVE 100",
"SellingPrice": 360
}, {
"Item Name": "GLENFIDDICH 12 YEARS 700 ",
"SellingPrice": 922
}, {
"Item Name": "GLENFIDDICH 12 YEARS 30",
"SellingPrice": 405
}, {
"Item Name": "TALISKER 750",
"SellingPrice": 877
}, {
"Item Name": "TALISKER 30",
"SellingPrice": 360
}, {
"Item Name": "GLENNLIVET 750",
"SellingPrice": 888
}, {
"Item Name": "GLENNLIVET 30",
"SellingPrice": 360
}, {
"Item Name": "THE SINGLETON 750",
"SellingPrice": 794
}, {
"Item Name": "THE SINGLETON 30",
"SellingPrice": 326
}, {
"Item Name": "AMRUT FUSION 750",
"SellingPrice": 506
}, {
"Item Name": "AMRUT FUSION 30",
"SellingPrice": 202
}, {
"Item Name": "JACK DANIELS 750",
"SellingPrice": 731
}, {
"Item Name": "JACK DANIELS 30",
"SellingPrice": 292
}, {
"Item Name": "JIM BEAM WHITE 750",
"SellingPrice": 409
}, {
"Item Name": "JIM BEAM WHITE 30",
"SellingPrice": 168
}, {
"Item Name": "JAMESON 750",
"SellingPrice": 49
}, {
"Item Name": "JAMESON 30",
"SellingPrice": 202
}, {
"Item Name": "JW BLACK LABEL 750",
"SellingPrice": 821
}, {
"Item Name": "JW BLACK LABEL 200",
"SellingPrice": 29
}, {
"Item Name": "JW BLACK LABEL 30",
"SellingPrice": 337
}, {
"Item Name": "JW RED LABEL 200",
"SellingPrice": 115
}, {
"Item Name": "BALLENTINSE FINEST BLENDED 750",
"SellingPrice": 454
}, {
"Item Name": "BALLENTINSE FINEST BLENDED 30",
"SellingPrice": 180
}, {
"Item Name": "BLACK \u0026 WHITE 375",
"SellingPrice": 157
}, {
"Item Name": "BLACK \u0026 WHITE 180",
"SellingPrice": 787
}, {
"Item Name": "BLACK \u0026 WHITE 60",
"SellingPrice": 258
}, {
"Item Name": "BLACK \u0026 WHITE 30",
"SellingPrice": 135
}, {
"Item Name": "100 PIPERS 180",
"SellingPrice": 787
}, {
"Item Name": "100 PIPERS 60",
"SellingPrice": 258
}, {
"Item Name": "100 PIPERS 30",
"SellingPrice": 135
}, {
"Item Name": "VAT 69 180",
"SellingPrice": 675
}, {
"Item Name": "VAT 69 60",
"SellingPrice": 225
}, {
"Item Name": "VAT 69 30",
"SellingPrice": 112
}, {
"Item Name": "TEACHERS HIGHLAND 180",
"SellingPrice": 787
}, {
"Item Name": "TEACHERS HIGHLAND 60",
"SellingPrice": 258
}, {
"Item Name": "TEACHERS HIGHLAND 30",
"SellingPrice": 135
}, {
"Item Name": "TEACHERS 50 60",
"SellingPrice": 393
}, {
"Item Name": "TEACHERS 50 30",
"SellingPrice": 202
}, {
"Item Name": "BLACK DOG TRIPPLE GOLD 180",
"SellingPrice": 121
}, {
"Item Name": "BLACK DOG TRIPPLE GOLD 30",
"SellingPrice": 213
}, {
"Item Name": "BLACK DOG 8 YEARS 180",
"SellingPrice": 731
}, {
"Item Name": "BLACK DOG 8 YEARS 60",
"SellingPrice": 247
}, {
"Item Name": "BLACK DOG 8 YEARS 30",
"SellingPrice": 123
}, {
"Item Name": "BLENDERS PRIDE 750",
"SellingPrice": 228
}, {
"Item Name": "BLENDERS PRIDE 375",
"SellingPrice": 114
}, {
"Item Name": "BLENDERS PRIDE 180",
"SellingPrice": 573
}, {
"Item Name": "BLENDERS PRIDE 60",
"SellingPrice": 191
}, {
"Item Name": "BLENDERS PRIDE 30",
"SellingPrice": 90
}, {
"Item Name": "SIGNATURE 180",
"SellingPrice": 450
}, {
"Item Name": "SIGNATURE 60",
"SellingPrice": 168
}, {
"Item Name": "SIGNATURE 30",
"SellingPrice": 90
}, {
"Item Name": "GREY GOOSE 750",
"SellingPrice": 819
}, {
"Item Name": "GREY GOOSE 30",
"SellingPrice": 326
}, {
"Item Name": "BELVEDERE 700",
"SellingPrice": 812
}, {
"Item Name": "BELVEDERE 30",
"SellingPrice": 360
}, {
"Item Name": "CIROC 750",
"SellingPrice": 742
}, {
"Item Name": "CIROC 30",
"SellingPrice": 303
}, {
"Item Name": "ABSOLUT 750",
"SellingPrice": 455
}, {
"Item Name": "ABSOLUT 30",
"SellingPrice": 191
}, {
"Item Name": "SMIRNOFF RED 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF RED 60",
"SellingPrice": 202
}, {
"Item Name": "SMIRNOFF RED30",
"SellingPrice": 101
}, {
"Item Name": "SMIRNOFF ORANGE 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF ORANGE 60",
"SellingPrice": 202
}, {
"Item Name": "SMINOFF ORANGE30",
"SellingPrice": 101
}, {
"Item Name": "SMIRNOFF GREEN APPLE 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF GREEN APPLE 60",
"SellingPrice": 202
}, {
"Item Name": "SMIRNOFF GREEN APPLE30",
"SellingPrice": 101
}, {
"Item Name": "BOMBAY SAPHIRE 750",
"SellingPrice": 472
}, {
"Item Name": "BOMBAY SAPHIRE 30",
"SellingPrice": 191
}, {
"Item Name": "BLUE RIBBAND 750",
"SellingPrice": 877
}, {
"Item Name": "BLUE RIBBAND 60",
"SellingPrice": 78
}, {
"Item Name": "BACCARDI WHITE 750",
"SellingPrice": 248
}, {
"Item Name": "BACCARDI WHITE 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI WHITE 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI WHITE 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI LEMON 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI LEMON 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI LEMON 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI ORANGE 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI ORANGE 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI LEMON 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI BLACK 180",
"SellingPrice": 393
}, {
"Item Name": "BACCARDI BLACK 30",
"SellingPrice": 67
}, {
"Item Name": "BACCARDI GOLD 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI GOLD30",
"SellingPrice": 101
}, {
"Item Name": "OLD MONK 180",
"SellingPrice": 225
}, {
"Item Name": "OLD MONK 90",
"SellingPrice": 168
}, {
"Item Name": "OLD MONK 60",
"SellingPrice": 90
}, {
"Item Name": "OLD MONK 30 ",
"SellingPrice": 45
}, {
"Item Name": "DON ANGEL 750",
"SellingPrice": 466
}, {
"Item Name": "DON ANGEL 30",
"SellingPrice": 191
}, {
"Item Name": "SAUZA SILVER 700",
"SellingPrice": 615
}, {
"Item Name": "SAUZA SILVER 30",
"SellingPrice": 270
}, {
"Item Name": "JAGERBOMB",
"SellingPrice": 506
}, {
"Item Name": "KAMAKAZI",
"SellingPrice": 168
}, {
"Item Name": "JAGERMASTER",
"SellingPrice": 303
}, {
"Item Name": "COINTTRAEU",
"SellingPrice": 303
}, {
"Item Name": "SAMBUCA",
"SellingPrice": 258
}, {
"Item Name": "KHALUA",
"SellingPrice": 168
}, {
"Item Name": "MARTINI BLANCO",
"SellingPrice": 90
}, {
"Item Name": "MARTINI ROSSO",
"SellingPrice": 90
}, {
"Item Name": "HENESSY VS 700",
"SellingPrice": 787
}, {
"Item Name": "HENESSY VS 30",
"SellingPrice": 348
}, {
"Item Name": "MORPHEUS 750",
"SellingPrice": 218
}, {
"Item Name": "MORPHEUS 180",
"SellingPrice": 540
}, {
"Item Name": "MORPHEUS 60",
"SellingPrice": 191
}, {
"Item Name": "MORPHEUS 30",
"SellingPrice": 101
}, {
"Item Name": "MANSION HOUSE 180",
"SellingPrice": 292
}, {
"Item Name": "MANSION HOUSE 90",
"SellingPrice": 168
}, {
"Item Name": "MANSION HOUSE 60",
"SellingPrice": 90
}, {
"Item Name": "MC BRANDY 60",
"SellingPrice": 90
}, {
"Item Name": "RED BULL ",
"SellingPrice": 157
}, {
"Item Name": "COKE",
"SellingPrice": 45
}, {
"Item Name": "SPRITE",
"SellingPrice": 45
}, {
"Item Name": "SODA",
"SellingPrice": 33
}, {
"Item Name": "DIET COKE",
"SellingPrice": 56
}, {
"Item Name": "TONIC WATER",
"SellingPrice": 67
}, {
"Item Name": "GINGER ALE",
"SellingPrice": 67
}, {
"Item Name": "LIME SODA",
"SellingPrice": 45
}, {
"Item Name": "LIME WATER",
"SellingPrice": 45
}, {
"Item Name": "PACKEGED WATER 1L",
"SellingPrice": 39
}, {
"Item Name": "MANSION HOUSE 650",
"SellingPrice": 900
}, {
"Item Name": "Chole Kulche",
"SellingPrice": 80
}, {
"Item Name": "Butter Nan",
"SellingPrice": 65
}, {
"Item Name": "Dhai",
"SellingPrice": 20
}, {
"Item Name": "Rice",
"SellingPrice": 55
}, {
"Item Name": "Plain rice",
"SellingPrice": 30
}, {
"Item Name": "MANSION HOUSE 650",
"SellingPrice": 900
}, {
"Item Name": "Chole Kulche",
"SellingPrice": 80
}, {
"Item Name": "Butter Nan",
"SellingPrice": 65
}, {
"Item Name": "Dhai",
"SellingPrice": 20
}, {
"Item Name": "Rice",
"SellingPrice": 55
}, {
"Item Name": "Plain rice",
"SellingPrice": 30
}]
interval = '';
function initTable(tableValue) {
addTable(tableValue)
interval = window.setInterval(showRows, 3000);
}
initTable(tableValue);
function hideImage() {
// 5000 = 5 seconds
window.setInterval(doHide, 3000);
}
function doHide() {
$("#displayImage").show() //this is here I am trying to show image
}
function showRows() {
// Any TRs that are not hidden and not already shown get "already-shown" applies
if ($(".hidden:lt(12)").length > 0) { //checking is it is the last page or not
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
} else { // if it is the last row
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
hideImage();
//
clearInterval(interval); //if last then clearing time interval and calling the function again
initTable(tableValue);
}
$(".hidden:lt(12)").removeClass("hidden"); // this one is to hide previous rows and show next
}
function addTable(tableValue) {
var $tbl = $("<table />", {
"class": "table fixed"
}),
$tb = $("<tbody/>"),
$trh = $("<tr/>");
var split = Math.round(tableValue.length / 4);
for (i = 0; i < split; i++) {
$tr = $("<tr/>", {
class: "hidden "
});
for (j = 0; j < 4; j++) {
$.each(tableValue[split * j + i], function(key, value) {
if (typeof(value) === "number") {
$("<td/>", {
"class": "text-right color" + (j + 1)
}).html(value).appendTo($tr);
} else {
$("<td/>", {
"class": "text-left color" + (j + 1)
}).html(value).appendTo($tr);
}
});
}
$tr.appendTo($tb);
}
$tbl.append($tb);
$("#DisplayTable").html($tbl);
}tbody>tr>td {
white-space: normal;
border-collapse: collapse;
font-family: Verdana;
font-weight: bold;
font-size: .9em;
}
td:nth-child(2),
td:nth-child(4),
td:nth-child(6),
td:nth-child(8) {
width: 85px;
max-width: 85px;
height: 63px
}
.fixed {
table-layout: fixed;
}
.color1 {
background: #4AD184;
}
.color2 {
background: #EA69EF;
}
.color3 {
background: #E1A558;
}
.color4 {
background: #F4F065;
}
.hidden,
.already-shown {
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<div id="DisplayTable"></div>
<div id="displayImage" style="display: none">
<img src="myImage.jpg" alt="Some Image" width="460" height="345">
</div>Edit / Update
I have edit my snippet, With some code image is showing put it is showing below the table not after the last page and also it is not getting hide once it is showing up then it is showing up only
Upvotes: 3
Views: 522
Answers (3)
Soubhagya Kumar Barik
Reputation: 2615
I have updated the latest code below please check once.
explanation:
i have removed hideImage()&doHide()
in toggleImage() it will show the image and hide after 10 seconds
for me its working 100% please check and let me know
in showRows() if page reaching at last page then it will clear the interval time and set it to 7 seconds (10 seconds for image - 3 seconds delay)
function toggleImage() {
$("#displayImage").show();
setTimeout(function () {
$("#displayImage").hide();
}, 10000);
}
function showRows() {
// Any TRs that are not hidden and not already shown get "already-shown" applies
if ($(".hidden:lt(12)").length > 0) { //checking is it is the last page or not
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
} else { // if it is the last row
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
toggleImage();
//
clearInterval(interval); //if last then clearing time interval and calling the function again
interval = false;
setTimeout(function () {
initTable(tableValue);
}, 7000);
}
$(".hidden:lt(12)").removeClass("hidden"); // this one is to hide previous rows and show next
}
Upvotes: 1
Syed mohamed aladeen
Reputation: 6755
Try this code. I have updated your hide image code.
var tableValue = [{
"Item Name": "MANCHOW V SOUP",
"SellingPrice": 100
}, {
"Item Name": "MANCHOW NV SOUP ",
"SellingPrice": 125
}, {
"Item Name": "CEASER SALAD V",
"SellingPrice": 175
}, {
"Item Name": "CEASER SALAD NV",
"SellingPrice": 230
}, {
"Item Name": "GAMBUS REBOZADAS",
"SellingPrice": 350
}, {
"Item Name": "PANCO FISH FINGER",
"SellingPrice": 270
}, {
"Item Name": "MUSHROOM DUPLEX",
"SellingPrice": 160
}, {
"Item Name": "FRENCH FRIES",
"SellingPrice": 99
}, {
"Item Name": "HONEY GARLIC PRAWN",
"SellingPrice": 350
}, {
"Item Name": "CHICKEN MANCHURIAN",
"SellingPrice": 180
}, {
"Item Name": "MUSHROOM CHILLY",
"SellingPrice": 120
}, {
"Item Name": "SALT N PEPPER BABY CORN",
"SellingPrice": 120
}, {
"Item Name": "SOUTHERN STYLE CHICKEN",
"SellingPrice": 210
}, {
"Item Name": "PANEER NAGGETS",
"SellingPrice": 210
}, {
"Item Name": "HARA BHARA KEBAB",
"SellingPrice": 160
}, {
"Item Name": "CHICKEN TIKKA",
"SellingPrice": 210
}, {
"Item Name": "KALMI KEBAB",
"SellingPrice": 250
}, {
"Item Name": "PIZZA MARGARITTA",
"SellingPrice": 200
}, {
"Item Name": "PIZZA VEG FARMHOUSE",
"SellingPrice": 200
}, {
"Item Name": "BBQ CHICKEN PIZZA",
"SellingPrice": 225
}, {
"Item Name": "CHICKEN TIKKA PIZZA",
"SellingPrice": 225
}, {
"Item Name": "PESTO SAUCE",
"SellingPrice": 175
}, {
"Item Name": "ARABIATA",
"SellingPrice": 160
}, {
"Item Name": "PINK SAUCE",
"SellingPrice": 160
}, {
"Item Name": "GARBANZO BEAN SALAD",
"SellingPrice": 90
}, {
"Item Name": "MASALA PAPAD",
"SellingPrice": 50
}, {
"Item Name": "PEANUT MASALA",
"SellingPrice": 60
}, {
"Item Name": "GAJAR KA HALWA",
"SellingPrice": 90
}, {
"Item Name": "WATERMELON MARTINI",
"SellingPrice": 281
}, {
"Item Name": "Kiwi martini",
"SellingPrice": 281
}, {
"Item Name": " Apple gin",
"SellingPrice": 225
}, {
"Item Name": "Cucumber cooler ",
"SellingPrice": 281
}, {
"Item Name": "Martini",
"SellingPrice": 225
}, {
"Item Name": "Pink lady",
"SellingPrice": 225
}, {
"Item Name": " Bloody marry",
"SellingPrice": 281
}, {
"Item Name": "Cosmopolitan",
"SellingPrice": 281
}, {
"Item Name": "the beach",
"SellingPrice": 281
}, {
"Item Name": "Bull frog",
"SellingPrice": 506
}, {
"Item Name": "Long island iced tea ",
"SellingPrice": 393
}, {
"Item Name": "Pinacolada",
"SellingPrice": 225
}, {
"Item Name": "Daiquiri",
"SellingPrice": 225
}, {
"Item Name": "Mojito ",
"SellingPrice": 281
}, {
"Item Name": "Whisky sour",
"SellingPrice": 281
}, {
"Item Name": "Hot toddy",
"SellingPrice": 225
}, {
"Item Name": "Margarita",
"SellingPrice": 337
}, {
"Item Name": "Tequila sunrise",
"SellingPrice": 337
}, {
"Item Name": "Red sangria",
"SellingPrice": 225
}, {
"Item Name": "White sangria",
"SellingPrice": 247
}, {
"Item Name": "Rose sangria",
"SellingPrice": 247
}, {
"Item Name": "By chance special ",
"SellingPrice": 168
}, {
"Item Name": "Made in heaven",
"SellingPrice": 168
}, {
"Item Name": "Strawberry delight",
"SellingPrice": 168
}, {
"Item Name": "DRAGON",
"SellingPrice": 168
}, {
"Item Name": "Mangochil ",
"SellingPrice": 168
}, {
"Item Name": "Cucumber cola",
"SellingPrice": 168
}, {
"Item Name": "Virgin mojito",
"SellingPrice": 168
}, {
"Item Name": "Virgin mary",
"SellingPrice": 168
}, {
"Item Name": "Virgin pinacolada",
"SellingPrice": 168
}, {
"Item Name": "CORONA",
"SellingPrice": 438
}, {
"Item Name": "CRAFT BEERS",
"SellingPrice": 337
}, {
"Item Name": "BIRA WHITE 330",
"SellingPrice": 157
}, {
"Item Name": "BIRA BLONDE 330",
"SellingPrice": 135
}, {
"Item Name": "BIRA STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "KINGFISHER PREMIUM 330",
"SellingPrice": 123
}, {
"Item Name": "KINGFISHER PREMIUM 650",
"SellingPrice": 202
}, {
"Item Name": "KINGFISHER STRONG 330",
"SellingPrice": 135
}, {
"Item Name": "KINGFISHER STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "KINGFISHER ULTRA 330",
"SellingPrice": 146
}, {
"Item Name": "KINGFISHER ULTRA 650",
"SellingPrice": 281
}, {
"Item Name": "KINGFISHER ULTRA MAX 330",
"SellingPrice": 146
}, {
"Item Name": "KINGFISHER ULTRA MAX 650",
"SellingPrice": 281
}, {
"Item Name": "BUDWIESER 330",
"SellingPrice": 146
}, {
"Item Name": "BUDWIESER 650",
"SellingPrice": 270
}, {
"Item Name": "BUDWIESER MAGNUM 330",
"SellingPrice": 168
}, {
"Item Name": "BUDWIESER MAGNUM 650",
"SellingPrice": 281
}, {
"Item Name": "TUBORG 330",
"SellingPrice": 123
}, {
"Item Name": "TUBORG 650",
"SellingPrice": 191
}, {
"Item Name": "TUBORG STRONG 330",
"SellingPrice": 123
}, {
"Item Name": "TUBORG STRONG 650",
"SellingPrice": 213
}, {
"Item Name": "CRANBERRY ",
"SellingPrice": 157
}, {
"Item Name": "ORANGE",
"SellingPrice": 157
}, {
"Item Name": "JAMICAN",
"SellingPrice": 157
}, {
"Item Name": "BLACK BERRY",
"SellingPrice": 157
}, {
"Item Name": "BLUE BERRY",
"SellingPrice": 157
}, {
"Item Name": "MOET CHANDON",
"SellingPrice": 787
}, {
"Item Name": "SULA BRUT",
"SellingPrice": 168
}, {
"Item Name": "MATEUS ROSE",
"SellingPrice": 213
}, {
"Item Name": "HARDYS SIRAZ CABERNET 750",
"SellingPrice": 189
}, {
"Item Name": "HARDYS SIRAZ CABERNET BY GLASS",
"SellingPrice": 382
}, {
"Item Name": "JACOB CREEK SIRAZ 750",
"SellingPrice": 180
}, {
"Item Name": "JACOB CREEK SIRAZ BY GLASS",
"SellingPrice": 360
}, {
"Item Name": "BIG BANAYAN CHENNIN BLANC 750",
"SellingPrice": 990
}, {
"Item Name": "BIG BANAYAN CHENNI",
"SellingPrice": 202
}, {
"Item Name": "SULA CHENIN BLANC 750 ",
"SellingPrice": 129
}, {
"Item Name": "SULA CHENIN BLANC BY GLASS",
"SellingPrice": 258
}, {
"Item Name": "FOUR SEAZON CLASSIC",
"SellingPrice": 112
}, {
"Item Name": "FOUR SEAZON CLASSIC ",
"SellingPrice": 225
}, {
"Item Name": "BIG BANAYAN CARBINET ",
"SellingPrice": 112
}, {
"Item Name": "BIG BANAYAN CARBINE",
"SellingPrice": 225
}, {
"Item Name": "SULA SATORI MERLOT 750",
"SellingPrice": 123
}, {
"Item Name": "SULA SATORI MERLOT BY GLASS",
"SellingPrice": 247
}, {
"Item Name": "GROVERS LA RESERVE 750",
"SellingPrice": 180
}, {
"Item Name": "GROVERS LA RESERVE 100",
"SellingPrice": 360
}, {
"Item Name": "GLENFIDDICH 12 YEARS 700 ",
"SellingPrice": 922
}, {
"Item Name": "GLENFIDDICH 12 YEARS 30",
"SellingPrice": 405
}, {
"Item Name": "TALISKER 750",
"SellingPrice": 877
}, {
"Item Name": "TALISKER 30",
"SellingPrice": 360
}, {
"Item Name": "GLENNLIVET 750",
"SellingPrice": 888
}, {
"Item Name": "GLENNLIVET 30",
"SellingPrice": 360
}, {
"Item Name": "THE SINGLETON 750",
"SellingPrice": 794
}, {
"Item Name": "THE SINGLETON 30",
"SellingPrice": 326
}, {
"Item Name": "AMRUT FUSION 750",
"SellingPrice": 506
}, {
"Item Name": "AMRUT FUSION 30",
"SellingPrice": 202
}, {
"Item Name": "JACK DANIELS 750",
"SellingPrice": 731
}, {
"Item Name": "JACK DANIELS 30",
"SellingPrice": 292
}, {
"Item Name": "JIM BEAM WHITE 750",
"SellingPrice": 409
}, {
"Item Name": "JIM BEAM WHITE 30",
"SellingPrice": 168
}, {
"Item Name": "JAMESON 750",
"SellingPrice": 49
}, {
"Item Name": "JAMESON 30",
"SellingPrice": 202
}, {
"Item Name": "JW BLACK LABEL 750",
"SellingPrice": 821
}, {
"Item Name": "JW BLACK LABEL 200",
"SellingPrice": 29
}, {
"Item Name": "JW BLACK LABEL 30",
"SellingPrice": 337
}, {
"Item Name": "JW RED LABEL 200",
"SellingPrice": 115
}, {
"Item Name": "BALLENTINSE FINEST BLENDED 750",
"SellingPrice": 454
}, {
"Item Name": "BALLENTINSE FINEST BLENDED 30",
"SellingPrice": 180
}, {
"Item Name": "BLACK \u0026 WHITE 375",
"SellingPrice": 157
}, {
"Item Name": "BLACK \u0026 WHITE 180",
"SellingPrice": 787
}, {
"Item Name": "BLACK \u0026 WHITE 60",
"SellingPrice": 258
}, {
"Item Name": "BLACK \u0026 WHITE 30",
"SellingPrice": 135
}, {
"Item Name": "100 PIPERS 180",
"SellingPrice": 787
}, {
"Item Name": "100 PIPERS 60",
"SellingPrice": 258
}, {
"Item Name": "100 PIPERS 30",
"SellingPrice": 135
}, {
"Item Name": "VAT 69 180",
"SellingPrice": 675
}, {
"Item Name": "VAT 69 60",
"SellingPrice": 225
}, {
"Item Name": "VAT 69 30",
"SellingPrice": 112
}, {
"Item Name": "TEACHERS HIGHLAND 180",
"SellingPrice": 787
}, {
"Item Name": "TEACHERS HIGHLAND 60",
"SellingPrice": 258
}, {
"Item Name": "TEACHERS HIGHLAND 30",
"SellingPrice": 135
}, {
"Item Name": "TEACHERS 50 60",
"SellingPrice": 393
}, {
"Item Name": "TEACHERS 50 30",
"SellingPrice": 202
}, {
"Item Name": "BLACK DOG TRIPPLE GOLD 180",
"SellingPrice": 121
}, {
"Item Name": "BLACK DOG TRIPPLE GOLD 30",
"SellingPrice": 213
}, {
"Item Name": "BLACK DOG 8 YEARS 180",
"SellingPrice": 731
}, {
"Item Name": "BLACK DOG 8 YEARS 60",
"SellingPrice": 247
}, {
"Item Name": "BLACK DOG 8 YEARS 30",
"SellingPrice": 123
}, {
"Item Name": "BLENDERS PRIDE 750",
"SellingPrice": 228
}, {
"Item Name": "BLENDERS PRIDE 375",
"SellingPrice": 114
}, {
"Item Name": "BLENDERS PRIDE 180",
"SellingPrice": 573
}, {
"Item Name": "BLENDERS PRIDE 60",
"SellingPrice": 191
}, {
"Item Name": "BLENDERS PRIDE 30",
"SellingPrice": 90
}, {
"Item Name": "SIGNATURE 180",
"SellingPrice": 450
}, {
"Item Name": "SIGNATURE 60",
"SellingPrice": 168
}, {
"Item Name": "SIGNATURE 30",
"SellingPrice": 90
}, {
"Item Name": "GREY GOOSE 750",
"SellingPrice": 819
}, {
"Item Name": "GREY GOOSE 30",
"SellingPrice": 326
}, {
"Item Name": "BELVEDERE 700",
"SellingPrice": 812
}, {
"Item Name": "BELVEDERE 30",
"SellingPrice": 360
}, {
"Item Name": "CIROC 750",
"SellingPrice": 742
}, {
"Item Name": "CIROC 30",
"SellingPrice": 303
}, {
"Item Name": "ABSOLUT 750",
"SellingPrice": 455
}, {
"Item Name": "ABSOLUT 30",
"SellingPrice": 191
}, {
"Item Name": "SMIRNOFF RED 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF RED 60",
"SellingPrice": 202
}, {
"Item Name": "SMIRNOFF RED30",
"SellingPrice": 101
}, {
"Item Name": "SMIRNOFF ORANGE 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF ORANGE 60",
"SellingPrice": 202
}, {
"Item Name": "SMINOFF ORANGE30",
"SellingPrice": 101
}, {
"Item Name": "SMIRNOFF GREEN APPLE 180",
"SellingPrice": 551
}, {
"Item Name": "SMIRNOFF GREEN APPLE 60",
"SellingPrice": 202
}, {
"Item Name": "SMIRNOFF GREEN APPLE30",
"SellingPrice": 101
}, {
"Item Name": "BOMBAY SAPHIRE 750",
"SellingPrice": 472
}, {
"Item Name": "BOMBAY SAPHIRE 30",
"SellingPrice": 191
}, {
"Item Name": "BLUE RIBBAND 750",
"SellingPrice": 877
}, {
"Item Name": "BLUE RIBBAND 60",
"SellingPrice": 78
}, {
"Item Name": "BACCARDI WHITE 750",
"SellingPrice": 248
}, {
"Item Name": "BACCARDI WHITE 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI WHITE 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI WHITE 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI LEMON 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI LEMON 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI LEMON 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI ORANGE 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI ORANGE 60",
"SellingPrice": 202
}, {
"Item Name": "BACCARDI LEMON 30",
"SellingPrice": 101
}, {
"Item Name": "BACCARDI BLACK 180",
"SellingPrice": 393
}, {
"Item Name": "BACCARDI BLACK 30",
"SellingPrice": 67
}, {
"Item Name": "BACCARDI GOLD 180",
"SellingPrice": 585
}, {
"Item Name": "BACCARDI GOLD30",
"SellingPrice": 101
}, {
"Item Name": "OLD MONK 180",
"SellingPrice": 225
}, {
"Item Name": "OLD MONK 90",
"SellingPrice": 168
}, {
"Item Name": "OLD MONK 60",
"SellingPrice": 90
}, {
"Item Name": "OLD MONK 30 ",
"SellingPrice": 45
}, {
"Item Name": "DON ANGEL 750",
"SellingPrice": 466
}, {
"Item Name": "DON ANGEL 30",
"SellingPrice": 191
}, {
"Item Name": "SAUZA SILVER 700",
"SellingPrice": 615
}, {
"Item Name": "SAUZA SILVER 30",
"SellingPrice": 270
}, {
"Item Name": "JAGERBOMB",
"SellingPrice": 506
}, {
"Item Name": "KAMAKAZI",
"SellingPrice": 168
}, {
"Item Name": "JAGERMASTER",
"SellingPrice": 303
}, {
"Item Name": "COINTTRAEU",
"SellingPrice": 303
}, {
"Item Name": "SAMBUCA",
"SellingPrice": 258
}, {
"Item Name": "KHALUA",
"SellingPrice": 168
}, {
"Item Name": "MARTINI BLANCO",
"SellingPrice": 90
}, {
"Item Name": "MARTINI ROSSO",
"SellingPrice": 90
}, {
"Item Name": "HENESSY VS 700",
"SellingPrice": 787
}, {
"Item Name": "HENESSY VS 30",
"SellingPrice": 348
}, {
"Item Name": "MORPHEUS 750",
"SellingPrice": 218
}, {
"Item Name": "MORPHEUS 180",
"SellingPrice": 540
}, {
"Item Name": "MORPHEUS 60",
"SellingPrice": 191
}, {
"Item Name": "MORPHEUS 30",
"SellingPrice": 101
}, {
"Item Name": "MANSION HOUSE 180",
"SellingPrice": 292
}, {
"Item Name": "MANSION HOUSE 90",
"SellingPrice": 168
}, {
"Item Name": "MANSION HOUSE 60",
"SellingPrice": 90
}, {
"Item Name": "MC BRANDY 60",
"SellingPrice": 90
}, {
"Item Name": "RED BULL ",
"SellingPrice": 157
}, {
"Item Name": "COKE",
"SellingPrice": 45
}, {
"Item Name": "SPRITE",
"SellingPrice": 45
}, {
"Item Name": "SODA",
"SellingPrice": 33
}, {
"Item Name": "DIET COKE",
"SellingPrice": 56
}, {
"Item Name": "TONIC WATER",
"SellingPrice": 67
}, {
"Item Name": "GINGER ALE",
"SellingPrice": 67
}, {
"Item Name": "LIME SODA",
"SellingPrice": 45
}, {
"Item Name": "LIME WATER",
"SellingPrice": 45
}, {
"Item Name": "PACKEGED WATER 1L",
"SellingPrice": 39
}, {
"Item Name": "MANSION HOUSE 650",
"SellingPrice": 900
}, {
"Item Name": "Chole Kulche",
"SellingPrice": 80
}, {
"Item Name": "Butter Nan",
"SellingPrice": 65
}, {
"Item Name": "Dhai",
"SellingPrice": 20
}, {
"Item Name": "Rice",
"SellingPrice": 55
}, {
"Item Name": "Plain rice",
"SellingPrice": 30
}, {
"Item Name": "MANSION HOUSE 650",
"SellingPrice": 900
}, {
"Item Name": "Chole Kulche",
"SellingPrice": 80
}, {
"Item Name": "Butter Nan",
"SellingPrice": 65
}, {
"Item Name": "Dhai",
"SellingPrice": 20
}, {
"Item Name": "Rice",
"SellingPrice": 55
}, {
"Item Name": "Plain rice",
"SellingPrice": 30
}]
interval = '';
function initTable(tableValue) {
addTable(tableValue)
interval = window.setInterval(showRows, 3000);
}
initTable(tableValue);
function hideImage() {
$("#displayImage").show(); //this is here I am trying to show image
$("#DisplayTable").hide();
setTimeout(function(){
initTable(tableValue);
},10000);
}
function showRows() {
// Any TRs that are not hidden and not already shown get "already-shown" applies
if ($(".hidden:lt(12)").length > 0) { //checking is it is the last page or not
$("#displayImage").hide(); //this is here I am trying to show image
$("#DisplayTable").show();
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
} else { // if it is the last row
$("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
hideImage();
//
clearInterval(interval); //if last then clearing time interval and calling the function again
}
$(".hidden:lt(12)").removeClass("hidden"); // this one is to hide previous rows and show next
}
function addTable(tableValue) {
var $tbl = $("<table />", {
"class": "table fixed"
}),
$tb = $("<tbody/>"),
$trh = $("<tr/>");
var split = Math.round(tableValue.length / 4);
for (i = 0; i < split; i++) {
$tr = $("<tr/>", {
class: "hidden "
});
for (j = 0; j < 4; j++) {
$.each(tableValue[split * j + i], function(key, value) {
if (typeof(value) === "number") {
$("<td/>", {
"class": "text-right color" + (j + 1)
}).html(value).appendTo($tr);
} else {
$("<td/>", {
"class": "text-left color" + (j + 1)
}).html(value).appendTo($tr);
}
});
}
$tr.appendTo($tb);
}
$tbl.append($tb);
$("#DisplayTable").html($tbl);
}tbody>tr>td {
white-space: normal;
border-collapse: collapse;
font-family: Verdana;
font-weight: bold;
font-size: .9em;
}
td:nth-child(2),
td:nth-child(4),
td:nth-child(6),
td:nth-child(8) {
width: 85px;
max-width: 85px;
height: 63px
}
.fixed {
table-layout: fixed;
}
.color1 {
background: #4AD184;
}
.color2 {
background: #EA69EF;
}
.color3 {
background: #E1A558;
}
.color4 {
background: #F4F065;
}
.hidden,
.already-shown {
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<div id="DisplayTable"></div>
<div id="displayImage" style="display: none">
<img src="myImage.jpg" alt="Some Image" width="460" height="345">
</div>Upvotes: 1
Shashank Singh
Reputation: 1300
I think this will help you.
<script type="text/javascript">
//execute your main code through ajax ajaxCall() function which will execute after every 5 seconds
setInterval("ajaxCall()",5000);
function ajaxCall(){
//Your main code here
}
</script>
Upvotes: 0
Related Questions
- Hide/Show Image
- How to Hide and Show Images by clicking on HTML Button
- Show/hide image with JavaScript
- Show and hide image js
- Hiding/Showing images jQuery
- How to hide the image
- Show hide image with jQuery
- how to make jquery show and hide image
- Show hidden image with jQuery
- Hide and then show an image using Javascript