问:
How to give specific width to HTML table and columns
I have created an HTML table with JSON data which I am dividing into four columns to show up on display Screen, and at one go showing 5 rows then after 5 seconds next five row, This how my table is working

Now I have to show that Table on a display screen which has a resolution of 1336*768 soi am trying to give the full with so that it fitted to screen without any scroll

Due to Some reasons I want to give width to my columns also but that too is not taking the width, I don't know what I am doing wrong It is coming

Code

$(document).ready(function() {

  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": 7875
  }, {
    "Item Name": "SULA BRUT",
    "SellingPrice": 1687
  }, {
    "Item Name": "MATEUS ROSE",
    "SellingPrice": 2137
  }, {
    "Item Name": "HARDYS SIRAZ CABERNET 750",
    "SellingPrice": 1890
  }, {
    "Item Name": "HARDYS SIRAZ CABERNET BY GLASS",
    "SellingPrice": 382
  }, {
    "Item Name": "JACOB CREEK SIRAZ 750",
    "SellingPrice": 1800
  }, {
    "Item Name": "JACOB CREEK SIRAZ BY GLASS",
    "SellingPrice": 360
  }, {
    "Item Name": "BIG BANAYAN CHENNIN BLANC 750",
    "SellingPrice": 990
  }, {
    "Item Name": "BIG BANAYAN CHENNIN BLANC BY GLASS",
    "SellingPrice": 202
  }, {
    "Item Name": "SULA CHENIN BLANC 750 ",
    "SellingPrice": 1293
  }, {
    "Item Name": "SULA CHENIN BLANC BY GLASS",
    "SellingPrice": 258
  }, {
    "Item Name": "FOUR SEAZON CLASSIC CHENNIN BLANC 7",
    "SellingPrice": 1125
  }, {
    "Item Name": "FOUR SEAZON CLASSIC CHENNIN BLANC B",
    "SellingPrice": 225
  }, {
    "Item Name": "BIG BANAYAN CARBINET SAUVIGNON 750",
    "SellingPrice": 1125
  }, {
    "Item Name": "BIG BANAYAN CARBINET SAUVIGNON BY G",
    "SellingPrice": 225
  }, {
    "Item Name": "SULA SATORI MERLOT 750",
    "SellingPrice": 1237
  }, {
    "Item Name": "SULA SATORI MERLOT BY GLASS",
    "SellingPrice": 247
  }, {
    "Item Name": "GROVERS LA RESERVE 750",
    "SellingPrice": 1800
  }, {
    "Item Name": "GROVERS LA RESERVE 100",
    "SellingPrice": 360
  }, {
    "Item Name": "GLENFIDDICH 12 YEARS 700 ",
    "SellingPrice": 9225
  }, {
    "Item Name": "GLENFIDDICH 12 YEARS 30",
    "SellingPrice": 405
  }, {
    "Item Name": "TALISKER 750",
    "SellingPrice": 8775
  }, {
    "Item Name": "TALISKER 30",
    "SellingPrice": 360
  }, {
    "Item Name": "GLENNLIVET 750",
    "SellingPrice": 8887
  }, {
    "Item Name": "GLENNLIVET 30",
    "SellingPrice": 360
  }, {
    "Item Name": "THE SINGLETON 750",
    "SellingPrice": 7942
  }, {
    "Item Name": "THE SINGLETON 30",
    "SellingPrice": 326
  }, {
    "Item Name": "AMRUT FUSION 750",
    "SellingPrice": 5062
  }, {
    "Item Name": "AMRUT FUSION 30",
    "SellingPrice": 202
  }, {
    "Item Name": "JACK DANIELS 750",
    "SellingPrice": 7312
  }, {
    "Item Name": "JACK DANIELS 30",
    "SellingPrice": 292
  }, {
    "Item Name": "JIM BEAM WHITE 750",
    "SellingPrice": 4095
  }, {
    "Item Name": "JIM BEAM WHITE 30",
    "SellingPrice": 168
  }, {
    "Item Name": "JAMESON 750",
    "SellingPrice": 4950
  }, {
    "Item Name": "JAMESON 30",
    "SellingPrice": 202
  }, {
    "Item Name": "JW BLACK LABEL 750",
    "SellingPrice": 8212
  }, {
    "Item Name": "JW BLACK LABEL 200",
    "SellingPrice": 2925
  }, {
    "Item Name": "JW BLACK LABEL 30",
    "SellingPrice": 337
  }, {
    "Item Name": "JW RED LABEL 200",
    "SellingPrice": 1158
  }, {
    "Item Name": "BALLENTINSE FINEST BLENDED 750",
    "SellingPrice": 4545
  }, {
    "Item Name": "BALLENTINSE FINEST BLENDED 30",
    "SellingPrice": 180
  }, {
    "Item Name": "BLACK \u0026 WHITE 375",
    "SellingPrice": 1575
  }, {
    "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": 1215
  }, {
    "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": 2283
  }, {
    "Item Name": "BLENDERS PRIDE 375",
    "SellingPrice": 1147
  }, {
    "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": 8190
  }, {
    "Item Name": "GREY GOOSE 30",
    "SellingPrice": 326
  }, {
    "Item Name": "BELVEDERE 700",
    "SellingPrice": 8122
  }, {
    "Item Name": "BELVEDERE 30",
    "SellingPrice": 360
  }, {
    "Item Name": "CIROC 750",
    "SellingPrice": 7425
  }, {
    "Item Name": "CIROC 30",
    "SellingPrice": 303
  }, {
    "Item Name": "ABSOLUT 750",
    "SellingPrice": 4556
  }, {
    "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": 4725
  }, {
    "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": 2418
  }, {
    "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": 4668
  }, {
    "Item Name": "DON ANGEL 30",
    "SellingPrice": 191
  }, {
    "Item Name": "SAUZA SILVER 700",
    "SellingPrice": 6153
  }, {
    "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": 7875
  }, {
    "Item Name": "HENESSY VS 30",
    "SellingPrice": 348
  }, {
    "Item Name": "MORPHEUS 750",
    "SellingPrice": 2182
  }, {
    "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
  }]

  myFun();
  window.setInterval(showRows, 5000);
  showRows();

  function myFun() {
    addTable(tableValue);
  }

  function showRows() {
    // Any TRs that are not hidden and not already shown get "already-shown" applied
    $("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
    // Then your previous code
    $(".hidden:lt(5)").removeClass("hidden"); // this one is to hide previous 5 rows and show next five
  }

  function addTable(tableValue) {
    var $tbl = $("
", {
        "class": "table"
      }),

      $tb = $("
"),
      $trh = $("
");

    var split = Math.round(tableValue.length / 4);
    for (i = 0; i < split; i++) {
      $tr = $("
", {
        class: "hidden"
      }); //ading class
      for (j = 0; j < 4; j++) {
        $.each(tableValue[split * j + i], function(key, value) {

          $("", {
            "class": "text-left color" + (j + 1)
          }).html(value).appendTo($tr);
        });
      }
      $tr.appendTo($tb);
    }
    $tbl.append($tb);
    $("#DisplayTable").html($tbl);
  }
});```
<pre class="snippet-code-css lang-css prettyprint-override"><code>tbody>tr>td {
  white-space: nowrap;
  border-collapse: collapse;
  font-family: Verdana;
  font-size: 1.1rem;
  font-weight: bold;
  white-space: nowrap;
  width: 100%;
}

td:nth-child(1),
td:nth-child(3),
td:nth-child(5),
td:nth-child(7) {
  width: 50px;
  /*change*/
  max-width: 50px;
  /*new add*/
}

.color1 {
  background: #4AD184;
}

.color2 {
  background: #EA69EF;
}

.color3 {
  background: #E1A558;
}

.color4 {
  background: #F4F065;
}

/* added .already-shown to have the same properties as hidden */

.hidden,
.already-shown {
  display: none;
}</code>```

<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">

```

EDIT

I am trying to fix the column width of itemname while doing that the texts are over lapping

答:
$(document).ready(function() {

  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.25
    },
    {
      "Item Name": "Kiwi martini",
      "SellingPrice": 281.25
    },
    {
      "Item Name": " Apple gin",
      "SellingPrice": 225
    },
    {
      "Item Name": "Cucumber  cooler ",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Martini",
      "SellingPrice": 225
    },
    {
      "Item Name": "Pink lady",
      "SellingPrice": 225
    },
    {
      "Item Name": " Bloody marry",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Cosmopolitan",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Sex on the beach",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Bull frog",
      "SellingPrice": 506.25
    },
    {
      "Item Name": "Long  island iced tea ",
      "SellingPrice": 393.75
    },
    {
      "Item Name": "Pinacolada",
      "SellingPrice": 225
    },
    {
      "Item Name": "Daiquiri",
      "SellingPrice": 225
    },
    {
      "Item Name": "Mojito ",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Whisky sour",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Hot toddy",
      "SellingPrice": 225
    },
    {
      "Item Name": "Margarita",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "Tequila sunrise",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "Red sangria",
      "SellingPrice": 225
    },
    {
      "Item Name": "White sangria",
      "SellingPrice": 247.5
    },
    {
      "Item Name": "Rose sangria",
      "SellingPrice": 247.5
    },
    {
      "Item Name": "By chance special ",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Made in heaven",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Strawberry delight",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "DRAGON",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Mangochil ",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Cucumber cola",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin mojito",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin mary",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin pinacolada",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "CORONA",
      "SellingPrice": 438.75
    },
    {
      "Item Name": "CRAFT BEERS",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "BIRA WHITE 330",
      "SellingPrice": 157.5
    },
    {
      "Item Name": "BIRA BLONDE 330",
      "SellingPrice": 135
    },
    {
      "Item Name": "BIRA STRONG 650",
      "SellingPrice": 213.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 330",
      "SellingPrice": 123.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 650",
      "SellingPrice": 202.5
    },
    {
      "Item Name": "KINGFISHER PREMIUM 330",
      "SellingPrice": 123.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 650",
      "SellingPrice": 202.5
    },
    {
      "Item Name": "TESTING ITEM",
      "SellingPrice": 22
    }
  ]

  myFun();
  window.setInterval(showRows, 5000);
  showRows();

  function myFun() {
    addTable(tableValue);
  }

  function showRows() {
    // Any TRs that are not hidden and not already shown get "already-shown" applied
    $("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
    // Then your previous code
    $(".hidden:lt(5)").removeClass("hidden"); // this one is to hide previous 5 rows and show next five
  }

  function addTable(tableValue) {
    var $tbl = $("
", {
        "class": "table"
      }),

      $tb = $("
"),
      $trh = $("
");

    var split = Math.round(tableValue.length / 4);
    for (i = 0; i < split; i++) {
      $tr = $("
", {
        class: "hidden"
      }); //ading class
      for (j = 0; j < 4; j++) {
        $.each(tableValue[split * j + i], function(key, value) {

          $("", {
            "class": "text-left color" + (j + 1)
          }).html(value).appendTo($tr);
        });
      }
      $tr.appendTo($tb);
    }
    $tbl.append($tb);
    $("#DisplayTable").html($tbl);
  }
});```
<pre class="snippet-code-css lang-css prettyprint-override"><code>tbody>tr>td {
  white-space: nowrap;
  border-collapse: collapse;
  font-family: Verdana;
  font-size: 1.1rem;
  font-weight: bold;
  white-space: nowrap;
 /* width: 100%;*/ /*remove this style*/
}

td:nth-child(2),
td:nth-child(4),
td:nth-child(6),
td:nth-child(8) {
      width: 100px; /*change*/
max-width: 100px; /*new add*/
}

.color1 {
  background: #4AD184;
}

.color2 {
  background: #EA69EF;
}

.color3 {
  background: #E1A558;
}

.color4 {
  background: #F4F065;
}

/* added .already-shown to have the same properties as hidden */

.hidden,
.already-shown {
  display: none;
}</code>```

<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">

```

Body:
I have created an HTML table with JSON data which I am dividing into four columns to show up on display Screen, and at one go showing 5 rows then after 5 seconds next five row, This how my table is working

Now I have to show that Table on a display screen which has a resolution of 1336*768 soi am trying to give the full with so that it fitted to screen without any scroll

Due to Some reasons I want to give width to my columns also but that too is not taking the width, I don't know what I am doing wrong It is coming

Code

$(document).ready(function() {

  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": 7875
  }, {
    "Item Name": "SULA BRUT",
    "SellingPrice": 1687
  }, {
    "Item Name": "MATEUS ROSE",
    "SellingPrice": 2137
  }, {
    "Item Name": "HARDYS SIRAZ CABERNET 750",
    "SellingPrice": 1890
  }, {
    "Item Name": "HARDYS SIRAZ CABERNET BY GLASS",
    "SellingPrice": 382
  }, {
    "Item Name": "JACOB CREEK SIRAZ 750",
    "SellingPrice": 1800
  }, {
    "Item Name": "JACOB CREEK SIRAZ BY GLASS",
    "SellingPrice": 360
  }, {
    "Item Name": "BIG BANAYAN CHENNIN BLANC 750",
    "SellingPrice": 990
  }, {
    "Item Name": "BIG BANAYAN CHENNIN BLANC BY GLASS",
    "SellingPrice": 202
  }, {
    "Item Name": "SULA CHENIN BLANC 750 ",
    "SellingPrice": 1293
  }, {
    "Item Name": "SULA CHENIN BLANC BY GLASS",
    "SellingPrice": 258
  }, {
    "Item Name": "FOUR SEAZON CLASSIC CHENNIN BLANC 7",
    "SellingPrice": 1125
  }, {
    "Item Name": "FOUR SEAZON CLASSIC CHENNIN BLANC B",
    "SellingPrice": 225
  }, {
    "Item Name": "BIG BANAYAN CARBINET SAUVIGNON 750",
    "SellingPrice": 1125
  }, {
    "Item Name": "BIG BANAYAN CARBINET SAUVIGNON BY G",
    "SellingPrice": 225
  }, {
    "Item Name": "SULA SATORI MERLOT 750",
    "SellingPrice": 1237
  }, {
    "Item Name": "SULA SATORI MERLOT BY GLASS",
    "SellingPrice": 247
  }, {
    "Item Name": "GROVERS LA RESERVE 750",
    "SellingPrice": 1800
  }, {
    "Item Name": "GROVERS LA RESERVE 100",
    "SellingPrice": 360
  }, {
    "Item Name": "GLENFIDDICH 12 YEARS 700 ",
    "SellingPrice": 9225
  }, {
    "Item Name": "GLENFIDDICH 12 YEARS 30",
    "SellingPrice": 405
  }, {
    "Item Name": "TALISKER 750",
    "SellingPrice": 8775
  }, {
    "Item Name": "TALISKER 30",
    "SellingPrice": 360
  }, {
    "Item Name": "GLENNLIVET 750",
    "SellingPrice": 8887
  }, {
    "Item Name": "GLENNLIVET 30",
    "SellingPrice": 360
  }, {
    "Item Name": "THE SINGLETON 750",
    "SellingPrice": 7942
  }, {
    "Item Name": "THE SINGLETON 30",
    "SellingPrice": 326
  }, {
    "Item Name": "AMRUT FUSION 750",
    "SellingPrice": 5062
  }, {
    "Item Name": "AMRUT FUSION 30",
    "SellingPrice": 202
  }, {
    "Item Name": "JACK DANIELS 750",
    "SellingPrice": 7312
  }, {
    "Item Name": "JACK DANIELS 30",
    "SellingPrice": 292
  }, {
    "Item Name": "JIM BEAM WHITE 750",
    "SellingPrice": 4095
  }, {
    "Item Name": "JIM BEAM WHITE 30",
    "SellingPrice": 168
  }, {
    "Item Name": "JAMESON 750",
    "SellingPrice": 4950
  }, {
    "Item Name": "JAMESON 30",
    "SellingPrice": 202
  }, {
    "Item Name": "JW BLACK LABEL 750",
    "SellingPrice": 8212
  }, {
    "Item Name": "JW BLACK LABEL 200",
    "SellingPrice": 2925
  }, {
    "Item Name": "JW BLACK LABEL 30",
    "SellingPrice": 337
  }, {
    "Item Name": "JW RED LABEL 200",
    "SellingPrice": 1158
  }, {
    "Item Name": "BALLENTINSE FINEST BLENDED 750",
    "SellingPrice": 4545
  }, {
    "Item Name": "BALLENTINSE FINEST BLENDED 30",
    "SellingPrice": 180
  }, {
    "Item Name": "BLACK \u0026 WHITE 375",
    "SellingPrice": 1575
  }, {
    "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": 1215
  }, {
    "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": 2283
  }, {
    "Item Name": "BLENDERS PRIDE 375",
    "SellingPrice": 1147
  }, {
    "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": 8190
  }, {
    "Item Name": "GREY GOOSE 30",
    "SellingPrice": 326
  }, {
    "Item Name": "BELVEDERE 700",
    "SellingPrice": 8122
  }, {
    "Item Name": "BELVEDERE 30",
    "SellingPrice": 360
  }, {
    "Item Name": "CIROC 750",
    "SellingPrice": 7425
  }, {
    "Item Name": "CIROC 30",
    "SellingPrice": 303
  }, {
    "Item Name": "ABSOLUT 750",
    "SellingPrice": 4556
  }, {
    "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": 4725
  }, {
    "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": 2418
  }, {
    "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": 4668
  }, {
    "Item Name": "DON ANGEL 30",
    "SellingPrice": 191
  }, {
    "Item Name": "SAUZA SILVER 700",
    "SellingPrice": 6153
  }, {
    "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": 7875
  }, {
    "Item Name": "HENESSY VS 30",
    "SellingPrice": 348
  }, {
    "Item Name": "MORPHEUS 750",
    "SellingPrice": 2182
  }, {
    "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
  }]

  myFun();
  window.setInterval(showRows, 5000);
  showRows();

  function myFun() {
    addTable(tableValue);
  }

  function showRows() {
    // Any TRs that are not hidden and not already shown get "already-shown" applied
    $("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
    // Then your previous code
    $(".hidden:lt(5)").removeClass("hidden"); // this one is to hide previous 5 rows and show next five
  }

  function addTable(tableValue) {
    var $tbl = $("
", {
        "class": "table"
      }),

      $tb = $("
"),
      $trh = $("
");

    var split = Math.round(tableValue.length / 4);
    for (i = 0; i < split; i++) {
      $tr = $("
", {
        class: "hidden"
      }); //ading class
      for (j = 0; j < 4; j++) {
        $.each(tableValue[split * j + i], function(key, value) {

          $("", {
            "class": "text-left color" + (j + 1)
          }).html(value).appendTo($tr);
        });
      }
      $tr.appendTo($tb);
    }
    $tbl.append($tb);
    $("#DisplayTable").html($tbl);
  }
});

tbody>tr>td {
  white-space: nowrap;
  border-collapse: collapse;
  font-family: Verdana;
  font-size: 1.1rem;
  font-weight: bold;
  white-space: nowrap;
  width: 100%;
}

td:nth-child(1),
td:nth-child(3),
td:nth-child(5),
td:nth-child(7) {
  width: 50px;
  /*change*/
  max-width: 50px;
  /*new add*/
}

.color1 {
  background: #4AD184;
}

.color2 {
  background: #EA69EF;
}

.color3 {
  background: #E1A558;
}

.color4 {
  background: #F4F065;
}

/* added .already-shown to have the same properties as hidden */

.hidden,
.already-shown {
  display: none;
}

<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">

EDIT

I am trying to fix the column width of itemname while doing that the texts are over lapping

Body:
$(document).ready(function() {

  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.25
    },
    {
      "Item Name": "Kiwi martini",
      "SellingPrice": 281.25
    },
    {
      "Item Name": " Apple gin",
      "SellingPrice": 225
    },
    {
      "Item Name": "Cucumber  cooler ",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Martini",
      "SellingPrice": 225
    },
    {
      "Item Name": "Pink lady",
      "SellingPrice": 225
    },
    {
      "Item Name": " Bloody marry",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Cosmopolitan",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Sex on the beach",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Bull frog",
      "SellingPrice": 506.25
    },
    {
      "Item Name": "Long  island iced tea ",
      "SellingPrice": 393.75
    },
    {
      "Item Name": "Pinacolada",
      "SellingPrice": 225
    },
    {
      "Item Name": "Daiquiri",
      "SellingPrice": 225
    },
    {
      "Item Name": "Mojito ",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Whisky sour",
      "SellingPrice": 281.25
    },
    {
      "Item Name": "Hot toddy",
      "SellingPrice": 225
    },
    {
      "Item Name": "Margarita",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "Tequila sunrise",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "Red sangria",
      "SellingPrice": 225
    },
    {
      "Item Name": "White sangria",
      "SellingPrice": 247.5
    },
    {
      "Item Name": "Rose sangria",
      "SellingPrice": 247.5
    },
    {
      "Item Name": "By chance special ",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Made in heaven",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Strawberry delight",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "DRAGON",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Mangochil ",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Cucumber cola",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin mojito",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin mary",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "Virgin pinacolada",
      "SellingPrice": 168.75
    },
    {
      "Item Name": "CORONA",
      "SellingPrice": 438.75
    },
    {
      "Item Name": "CRAFT BEERS",
      "SellingPrice": 337.5
    },
    {
      "Item Name": "BIRA WHITE 330",
      "SellingPrice": 157.5
    },
    {
      "Item Name": "BIRA BLONDE 330",
      "SellingPrice": 135
    },
    {
      "Item Name": "BIRA STRONG 650",
      "SellingPrice": 213.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 330",
      "SellingPrice": 123.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 650",
      "SellingPrice": 202.5
    },
    {
      "Item Name": "KINGFISHER PREMIUM 330",
      "SellingPrice": 123.75
    },
    {
      "Item Name": "KINGFISHER PREMIUM 650",
      "SellingPrice": 202.5
    },
    {
      "Item Name": "TESTING ITEM",
      "SellingPrice": 22
    }
  ]

  myFun();
  window.setInterval(showRows, 5000);
  showRows();

  function myFun() {
    addTable(tableValue);
  }

  function showRows() {
    // Any TRs that are not hidden and not already shown get "already-shown" applied
    $("tr:not(.hidden):not(.already-shown)").addClass("already-shown");
    // Then your previous code
    $(".hidden:lt(5)").removeClass("hidden"); // this one is to hide previous 5 rows and show next five
  }

  function addTable(tableValue) {
    var $tbl = $("<table />", {
        "class": "table"
      }),

      $tb = $("<tbody/>"),
      $trh = $("<tr/>");

    var split = Math.round(tableValue.length / 4);
    for (i = 0; i < split; i++) {
      $tr = $("<tr/>", {
        class: "hidden"
      }); //ading class
      for (j = 0; j < 4; j++) {
        $.each(tableValue[split * j + i], function(key, value) {

          $("<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: nowrap;
  border-collapse: collapse;
  font-family: Verdana;
  font-size: 1.1rem;
  font-weight: bold;
  white-space: nowrap;
 /* width: 100%;*/ /*remove this style*/
}

td:nth-child(2),
td:nth-child(4),
td:nth-child(6),
td:nth-child(8) {
      width: 100px; /*change*/
max-width: 100px; /*new add*/
}

.color1 {
  background: #4AD184;
}

.color2 {
  background: #EA69EF;
}

.color3 {
  background: #E1A558;
}

.color4 {
  background: #F4F065;
}

/* added .already-shown to have the same properties as hidden */

.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="//stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<table class="table" id="DisplayTable">
</table>


来源: stackexchange

问:
Is /dev/random considered truly random?
For instance, could it be used to generate a one-time pad key?

Also, what are its sources and how could it be used to generate a random number between x and y?

答:
/dev/random will block if there's not enough random data in the entropy pool whereas /dev/urandom will not. Instead, /dev/urandom will fall back to a PRNG (kernel docs). From the same docs:

The random number generator [entropy pool] gathers environmental noise from device drivers and other sources into an entropy pool.

So /dev/random is not algorithmic, like a PRNG, but it may not be "truly random" either. Mouse movements and keystroke timings tend to follow patterns and can be used for exploits but you'll have to weigh the risk against your use case.

To get a random number between x and y using /dev/random, assuming you're happy with a 32-bit integer, you could have a look at the way the Java java.util.Random class does it (nextInt()), substituting in appropriate code to read from /dev/random for the nextBytes() method.

ContentLicense: CC BY-SA 3.0

Title: Is /dev/random considered truly random?


问:
How can I use atexit() function to cleanup function call?
I am using atexit() function inside my code to cleanup function call, but it's not working.

```<code>#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    _exit(0);
}
</code>```

Any help regarding this will be appreciated.

答:
This behavior of atexit() function is due to the use of function _exit(). This function does not call the clean-up functions like atexit() etc. If atexit() is required to be called then exit() or ‘return’ should be used instead of _exit().

As:

```<code>#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    exit(0);
}
</code>```

ContentLicense: CC BY-SA 4.0

Body:
I am using atexit() function inside my code to cleanup function call, but it's not working.

#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    _exit(0);
}

Any help regarding this will be appreciated.

Body:
This behavior of atexit() function is due to the use of function _exit(). This function does not call the clean-up functions like atexit() etc. If atexit() is required to be called then exit() or ‘return’ should be used instead of _exit().

As:

#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    exit(0);
}


问:
Yocto rebuild image after modifying source code
How can I rebuild the image after making some modifications to driver source code?

I have tried bitbake -f -c compile and bitbake but I coudn't find the modified settings in the driver. Can someone tell me how can i rebuild the image with the modified code.

答:
I guess that you want to re-generate the whole image, don't you? If so, you can try the following commands to ensure that bitbake won't use the sstate cache:

```<code>bitbake image-name -c cleansstate && bitbake image-name
</code>```

In the case you just want to rebuild the kernel, substitute image-name by virtual/kernel (or the name of whatever recipe you want to rebuild).

Note that the do_cleansstate task is going to remove the recipe ${WORKDIR}!

For further information: https://www.yoctoproject.org/docs/latest/ref-manual/ref-manual.html#ref-tasks-cleansstate

In the case you're doing such modifications directly in the ${WORKDIR}, which you shouldn't unless you're testing, the execution of the following command would be enough:

```<code>bitbake virtual/kernel -f -c compile
</code>```

or

```<code>bitbake virtual/kernel -C compile (to invalidate the stamps and force all tasks starting from do_compile)
</code>```

Body:
I guess that you want to re-generate the whole image, don't you? If so, you can try the following commands to ensure that bitbake won't use the sstate cache:

bitbake image-name -c cleansstate && bitbake image-name

In the case you just want to rebuild the kernel, substitute image-name by virtual/kernel (or the name of whatever recipe you want to rebuild).

Note that the do_cleansstate task is going to remove the recipe ${WORKDIR}!

For further information: https://www.yoctoproject.org/docs/latest/ref-manual/ref-manual.html#ref-tasks-cleansstate

In the case you're doing such modifications directly in the ${WORKDIR}, which you shouldn't unless you're testing, the execution of the following command would be enough:

bitbake virtual/kernel -f -c compile

or

bitbake virtual/kernel -C compile (to invalidate the stamps and force all tasks starting from do_compile)


问:
Enforcing a vftable entry in windbg "x /2" results, what to consider?
(This is quite a large question about software design. In case it's not suited for StackOverflow I'm willing to copy it to the Software-Engineering community)

I'm working with heap_stat, a script, which investigates dumps. This script is based on the idea that, for any object which has a virtual function, the vftable field is always the first one (allowing to find the memory address of the class of the object).

In my applications there are some objects, having vftable entries (typically every STL object has it), but there are also quite some objects who don't.

In order to force the presence of a vftable field, I've done following test:

Create a nonsense class, having a virtual function, and let my class inherit from this nonsense class:

```<code>class NONSENSE {
    virtual int nonsense() { return 0; }
};

class Own_Class : public NONSENSE, ...
</code>```

This, as expected, created a vftable entry in the symbols, which I could find (using Windbg's x /2 *!Own_Class*vftable* command):

```<code>00000000`012da1e0 Own_Application!Own_Class::`vftable'
</code>```

I also saw a difference in memory usage:

```<code>sizeof(an normal Own_Class object) = 2928
sizeof(inherited Own_Class object) = 2936
</code>```

=> 8 bytes have been added for this object.

There's a catch: apparently quite some objects are defined as:

```<code>class ATL_NO_VTABLE Own_Class
</code>```

This ATL_NO_VTABLE blocks the creation of the vftable entry, which means the following (ATL_NO_VTABLE equals __declspec(novtable)):

```<code>// __declspec(novtable) is used on a class declaration to prevent the vtable
// pointer from being initialized in the constructor and destructor for the
// class.  This has many benefits because the linker can now eliminate the
// vtable and all the functions pointed to by the vtable.  Also, the actual
// constructor and destructor code are now smaller.
</code>```

In my opinion, this means that the vftable does not get created, because of which object methods get called more directly, having an impact on the speed of the method execution and stack handling. Allowing the vftable to be created has following impact:

Not to be taken into account:

There is one more call on the stack, this only has impact in case of systems which are already at the limit of their memory usage. (I have no idea how the linker points to a particular method)

The CPU usage increase will be too small to be seen.

The speed decrease will be too small to be seen.

To be taken into account:

As mentioned before, the memory usage of the application increases by 8 bytes per object. When a regular object has a size of some 1000 bytes, this means a memory usage increase of ±1%, but for objects with a memory size of less than 80 bytes, this might cause a memory usage increase of +10%.

Now I have following questions:

Is my analysis on the impact correct?

Is there a better way to force the creation of the vftable field, having less impact?

Did I miss anything?

Thanks in advance

答:
In the meantime, I've found a terribly easy way to force vftable' entries for every class: just declare every destructor as virtual.

In order to find all destructors, who are not virtual yet, I've launched following command in my Ubuntu app within my development directory:

```<code>find ./ -name "*.h" -exec fgrep "~" {} /dev/null \; | grep -v "virtual"
</code>```

After having declared all destructors as virtual, I'm planning to do some performance testing (I believe that declaring a method as virtual might have an impact on the speed, as the method declaration has been changed, especially for a server application with heavy load), I'll keep this post up to date.

Body:
(This is quite a large question about software design. In case it's not suited for StackOverflow I'm willing to copy it to the Software-Engineering community)

I'm working with heap_stat, a script, which investigates dumps. This script is based on the idea that, for any object which has a virtual function, the vftable field is always the first one (allowing to find the memory address of the class of the object).

In my applications there are some objects, having vftable entries (typically every STL object has it), but there are also quite some objects who don't.

In order to force the presence of a vftable field, I've done following test:

Create a nonsense class, having a virtual function, and let my class inherit from this nonsense class:

class NONSENSE {
    virtual int nonsense() { return 0; }
};

class Own_Class : public NONSENSE, ...

This, as expected, created a vftable entry in the symbols, which I could find (using Windbg's x /2 *!Own_Class*vftable* command):

00000000`012da1e0 Own_Application!Own_Class::`vftable'

I also saw a difference in memory usage:

sizeof(an normal Own_Class object) = 2928
sizeof(inherited Own_Class object) = 2936

=> 8 bytes have been added for this object.

There's a catch: apparently quite some objects are defined as:

class ATL_NO_VTABLE Own_Class

This ATL_NO_VTABLE blocks the creation of the vftable entry, which means the following (ATL_NO_VTABLE equals __declspec(novtable)):

// __declspec(novtable) is used on a class declaration to prevent the vtable
// pointer from being initialized in the constructor and destructor for the
// class.  This has many benefits because the linker can now eliminate the
// vtable and all the functions pointed to by the vtable.  Also, the actual
// constructor and destructor code are now smaller.

In my opinion, this means that the vftable does not get created, because of which object methods get called more directly, having an impact on the speed of the method execution and stack handling. Allowing the vftable to be created has following impact:

Not to be taken into account:

There is one more call on the stack, this only has impact in case of systems which are already at the limit of their memory usage. (I have no idea how the linker points to a particular method)

The CPU usage increase will be too small to be seen.

The speed decrease will be too small to be seen.

To be taken into account:

As mentioned before, the memory usage of the application increases by 8 bytes per object. When a regular object has a size of some 1000 bytes, this means a memory usage increase of ±1%, but for objects with a memory size of less than 80 bytes, this might cause a memory usage increase of +10%.

Now I have following questions:

Is my analysis on the impact correct?

Is there a better way to force the creation of the vftable field, having less impact?

Did I miss anything?

Thanks in advance

Body:
In the meantime, I've found a terribly easy way to force vftable' entries for every class: just declare every destructor as virtual.

In order to find all destructors, who are not virtual yet, I've launched following command in my Ubuntu app within my development directory:

find ./ -name "*.h" -exec fgrep "~" {} /dev/null \; | grep -v "virtual"

After having declared all destructors as virtual, I'm planning to do some performance testing (I believe that declaring a method as virtual might have an impact on the speed, as the method declaration has been changed, especially for a server application with heavy load), I'll keep this post up to date.


问:
ngx-spinner is not working outside of subscribe
Below is the code I tried to execute in ngOnInit().

```<code>ngOnInit() {
    this.spinner.show('full_settings');
    this.settings_api.get_all_settings().subscribe(response => {
        console.log(response);
    }, error => {
        console.log('error');
    });
}
</code>```

While executing this code spinner is not showing. There is no any console error too. So I tried to place spinner.show() inside the subscribe. That's working fine.

```<code>ngOnInit() {
    this.settings_api.get_all_settings().subscribe(response => {
        this.spinner.show('full_settings');
        console.log(response);
    }, error => {
        console.log('error');
    });
}
</code>```

I want it to work from outside of subscribe. I found the same issue here, but the solution said in there is not working for me.

答:
Please check the below code. I think a little timeout will fix the issue.</p>

```<code>ngOnInit() {
    setTimeout(() => { this.spinner.show('full_settings'); }, 30);
    this.settings_api.get_all_settings().subscribe(response => {
        console.log(response);
    }, error => {
        console.log('error');
    });
}
</code>```

Body:
Below is the code I tried to execute in ngOnInit().

ngOnInit() {
    this.spinner.show('full_settings');
    this.settings_api.get_all_settings().subscribe(response => {
        console.log(response);
    }, error => {
        console.log('error');
    });
}

While executing this code spinner is not showing. There is no any console error too. So I tried to place spinner.show() inside the subscribe. That's working fine.

ngOnInit() {
    this.settings_api.get_all_settings().subscribe(response => {
        this.spinner.show('full_settings');
        console.log(response);
    }, error => {
        console.log('error');
    });
}

I want it to work from outside of subscribe. I found the same issue here, but the solution said in there is not working for me.

Body:
Please check the below code. I think a little timeout will fix the issue.

ngOnInit() {
    setTimeout(() => { this.spinner.show('full_settings'); }, 30);
    this.settings_api.get_all_settings().subscribe(response => {
        console.log(response);
    }, error => {
        console.log('error');
    });
}


问:
how do I get the cache memory and Main memory using block size?
I'm learning the concept of directed mapped cache, but I don't get it how to get cache memory size and main memory size by using block size. (The unit is bytes.) the given values are 2^3 words = 2^5 bytes of block size, 4 bits of tags(0000~1111) and 3 bits of the index(000~111).

the questions >>

what's the size of cache memory and main memory in each?

and which address do we insert in each data part?

I already tried to separate the part tag and the cache index. I insert the tag on 3 upper order bits and insert the cache index(29 bits) on the remaining space. I got the main memory size, 4GB, and the cache size, 2^29 bytes. but I think something is wrong. I feel that I don't understand the concept of this.

答:
Your answer is incorrect, because you are assuming address is 32 bits and it is byte addressable, hence the 4GB memory size. This is not true and we must first compute these values.

8 words = 32 bytes = block size

So offset=3 bits (to address 8 words in a block)

and word size=4 bytes/word (32 bytes/8 words)

We have now the width of an address: 4 bits (tag) + 3 bits (index) +  3 bits (offset)= 10 bits.

With 10 bits address, main memory is 2^10 words=2^12 bytes=4kB

Cache has 8 blocks (3 bits index), each block has 32 bytes and cache size=8*32 bytes=256B.


答:
_exit close the program without calling at exit methods Further reading.

Thus, use exit(0); instead of _exit(0);

```<code>#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    exit(0);
}
</code>```

Title: How can I use atexit() function to cleanup function call?

Body:
_exit close the program without calling at exit methods Further reading.

Thus, use exit(0); instead of _exit(0);

#include<stdio.h>
void ftn(void)
{
    printf(" Function called --> exit\n");
    return;
}
int main(void)
{
    int x = 0;
    atexit(ftn);
    for(;x<0xffffff;x++);
    exit(0);
}


问:
How to assign Textbox value to the other textbox using jquery
I have two textboxes in my view,

My requirement is when I enter some text in the first textbox automatically that value should be assigned to second text box when I leave first textbox. using jquery or javascript.

thanks for your help

EDIT:

For Some reason this code is not inserting the value into seconed textbox.

```<code>http://jsfiddle.net/9tEV2/4/
</code>```

答:
```<code><script type="text/javascript">
    $(function () {
        $("#txt1").change(function () {

           $("#text2").val($(this).val());// For Single textBox
            $("#filltext").find("input:text").val($(this).val()) // Fill textbox1 value to multiple textboxes present in a single div(filltext is Division ID)
        });
    })
</script>`
</code>```

ContentLicense: CC BY-SA 2.5

Body:
I have two textboxes in my view,

My requirement is when I enter some text in the first textbox automatically that value should be assigned to second text box when I leave first textbox. using jquery or javascript.

thanks for your help

EDIT:

For Some reason this code is not inserting the value into seconed textbox.

http://jsfiddle.net/9tEV2/4/


问:
Working With Temporary Tables in ASP.NET MVC

Background:

I am currently writing a web front for analysis of our web logs which get inserted into SQL Server.

One of the most basic features is that it you can search for a set of results by specifying a time frame (This is generally a tool for troubleshooting recent traffic, not deep data mining) and then various other fields, such has the ClientIP, Uri, etc.

I originally did this with LINQ, but started to get annoyed with it and decided for me it would be easier to construct queries wtih StringBuilder and use Dapper.NET. So I still se the dmbl generated for my table (there are actually 31 tables, one for each day, but a view brings them together). And then create queries in my controller that go something like:

```<code>public ActionResult Index(SearchParams sp)
{

    var db = new LogTableDataContext();
    var query = new StringBuilder();
    ...
    var fields = " Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host ";
    query.Append(" SELECT ");

    if (sp.top.HasValue)
        query.Append(" Top ").Append(sp.top);
    query.Append(fields);
    query.Append(" from Logs ");

    query.Append(" WHERE 1=1 ");
    if (wherestrings.HasValue())
        query.Append(wherestrings);
    var resultsModel = new UberRows { rows = results, generated_query = query.ToString(), query_params = sp.GetPropertyNamesAndValues() };
    return View(resultsModel);
</code>```

Where WHERE clauses are generated based on the GET parameters passed to the controller, something like:

```<code>public string GenerateWhereString()
{
    var wherestring = new StringBuilder();
    if (this.Uri.HasValue())
        wherestring.Append(" AND Uri = @Uri ");
    if (this.ClientIp.HasValue())
        wherestring.Append(" AND ClientIp = @ClientIP ");
    if (this.Server.HasValue())
</code>```

UberRows simply has public List<HAProxyLogViewer.Log> rows; and I just render the results in div with jquery and the DataTable plugin since the result sets should generally be small.

Now, to my question:

What I would also like to have his a bunch of queries that query the result set of the above search (How many hits to each Server, Average Response Time, etc).

I am guessing that the way to do this would be create a temp table with the results (since if I didn't I would have to generate the base results for each of those queries on things like response time for the result set), but since I am new to that, c#, and asp.mvc I am not sure in either the big picture of how that would work and be tied into MVC, my ORM, and the dmbl classes. Assuming I am correct about the temp table, how would I work with that?

So the pure SQL would be something like:

```<code>SELECT Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host
INTO #resultsTable
FROM Logs
WHERE 1=1 AND Time BETWEEN dateadd(minute, -1440, getutcdate()) and getutcdate()
AND UserAgent = 'Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)';

SELECT Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host
FROM #resultsTable;

SELECT Server, COUNT(*)
FROM #resultsTable
GROUP BY Server;

SELECT AVG(Tr)
FROM #resultsTable;

DROP TABLE #resultsTable;
</code>```

答:
A Temporary Table will not last beyond the DB session that created it.  A Global Temporary Table can be shared across DB sessions but based on your scenario it might not be predictable when the sessions start and end so that might not give predictable results.

I would suggest creating a real table to hold the results and just query that. When the queries are done just DELETE all of the data. If it is possible to have multiple connections using different result sets (hence a Temp Table would have been great), then you can add a UNIQUEIDENTIFIER field as the "key" for which set of data to use for this set of queries.  Meaning, generate the GUID on the app side, and pass that into the query that populates the real table so that each of the queries against it can use that app-generated value as an additional WHERE clause.  When all of the queries against that "temporary" result set are done, do a DELETE based on that GUID. If for some reason the queries against a particular result set are disconnected and you don't know when the last one executes, add a DATETIME field to the result set and create a SQL Agent Job to DELETE records older than 30 or 60 minutes or whatever.

Edit:
Also, to be clear, IF all of the queries are really being done by a single connection then you might be able to still use a Temp Table if you enable MARS (Multiple Active Result Sets) as I think MARS keeps a consistent session, but I am not sure as I have never used it.

Body:
Background:

I am currently writing a web front for analysis of our web logs which get inserted into SQL Server.

One of the most basic features is that it you can search for a set of results by specifying a time frame (This is generally a tool for troubleshooting recent traffic, not deep data mining) and then various other fields, such has the ClientIP, Uri, etc.

I originally did this with LINQ, but started to get annoyed with it and decided for me it would be easier to construct queries wtih StringBuilder and use Dapper.NET. So I still se the dmbl generated for my table (there are actually 31 tables, one for each day, but a view brings them together). And then create queries in my controller that go something like:

public ActionResult Index(SearchParams sp)
{

    var db = new LogTableDataContext();
    var query = new StringBuilder();
    ...
    var fields = " Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host ";
    query.Append(" SELECT ");

    if (sp.top.HasValue)
        query.Append(" Top ").Append(sp.top);
    query.Append(fields);
    query.Append(" from Logs ");

    query.Append(" WHERE 1=1 ");
    if (wherestrings.HasValue())
        query.Append(wherestrings);
    var resultsModel = new UberRows { rows = results, generated_query = query.ToString(), query_params = sp.GetPropertyNamesAndValues() };
    return View(resultsModel);

Where WHERE clauses are generated based on the GET parameters passed to the controller, something like:

public string GenerateWhereString()
{
    var wherestring = new StringBuilder();
    if (this.Uri.HasValue())
        wherestring.Append(" AND Uri = @Uri ");
    if (this.ClientIp.HasValue())
        wherestring.Append(" AND ClientIp = @ClientIP ");
    if (this.Server.HasValue())

UberRows simply has public List<HAProxyLogViewer.Log> rows; and I just render the results in div with jquery and the DataTable plugin since the result sets should generally be small.

Now, to my question:

What I would also like to have his a bunch of queries that query the result set of the above search (How many hits to each Server, Average Response Time, etc).

I am guessing that the way to do this would be create a temp table with the results (since if I didn't I would have to generate the base results for each of those queries on things like response time for the result set), but since I am new to that, c#, and asp.mvc I am not sure in either the big picture of how that would work and be tied into MVC, my ORM, and the dmbl classes. Assuming I am correct about the temp table, how would I work with that?

So the pure SQL would be something like:

SELECT Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host
INTO #resultsTable
FROM Logs
WHERE 1=1 AND Time BETWEEN dateadd(minute, -1440, getutcdate()) and getutcdate()
AND UserAgent = 'Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)';

SELECT Time, ClientIp, Method, Uri, Bytes, Server, Tr, TermState, UserAgent, Host
FROM #resultsTable;

SELECT Server, COUNT(*)
FROM #resultsTable
GROUP BY Server;

SELECT AVG(Tr)
FROM #resultsTable;

DROP TABLE #resultsTable;


问:
Flutter: Why am I getting the error "Route builders must never return null"?
I am new to flutter and below is my code

homepage.dart

```<code>import 'package:flutter/material.dart';

import './product_page.dart';

class Homepage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("Choco Factory"),
      ),
      body: HomepageUI(),
    );
  }
}

class HomepageUI extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _HomepageUIState();
  }
}

class _HomepageUIState extends State<HomepageUI> {
  List<Map<String, String>> productsMap = [];

  _HomepageUIState() {
    productsMap
        .add({"title": "Cappuccino", "imageUrl": "assets/cappuccino.jpg"});
    productsMap.add(
        {"title": "Chocolate Cake", "imageUrl": "assets/chocolate_cake.jpg"});
    productsMap
        .add({"title": "Chocolates", "imageUrl": "assets/chocolates.jpg"});
    productsMap.add(
        {"title": "Hot Chocolate", "imageUrl": "assets/hot_chocolate.jpg"});
    productsMap.add({"title": "Naougat", "imageUrl": "assets/nougat.jpg"});
    productsMap.add(
        {"title": "White Chocolate", "imageUrl": "assets/white_chocolate.jpg"});
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      children: <Widget>[
        Text("Select Your Choco!"),
        Expanded(
            child: ListView.builder(
          itemBuilder: _listBuilder,
          itemCount: productsMap.length,
        )

            //child: Image.asset("assets/chocolates.jpg"),
            )
      ],
    );
  }

  Widget _listBuilder(BuildContext context, int index) {
    return Card(
      child: Column(
        children: <Widget>[
          Image.asset(productsMap[index]["imageUrl"]),
          Text(productsMap[index]["title"]),
          RaisedButton(
            child: Text("Details"),
            color: Colors.green,
            onPressed: () {
              Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
                ProductPage(productsMap[index]["title"],
                    productsMap[index]["imageUrl"]);
              }));
            },
          )
        ],
      ),
    );
  }
}
</code>```

product_page.dart

```<code>import 'package:flutter/material.dart';

class ProductPage extends StatelessWidget {
  final String  title, imageUrl;

  ProductPage(this.title,this.imageUrl);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("Choco Factory"),
      ),
      body: ProductPageUI(title, imageUrl),
    );
  }
}

class ProductPageUI extends StatefulWidget {

  String title, imageUrl;

  ProductPageUI(this.title, this.imageUrl);

  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _ProductPageUIState();
  }
}

class _ProductPageUIState extends State<ProductPageUI> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return _productPageUIBuilder(widget.title, widget.imageUrl);
  }

  Widget _productPageUIBuilder(String title, String imageUrl) {
    return Column(
      children: <Widget>[
        Text(title),
        Image.asset(imageUrl),
        Text(
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean semper sodales nisi, ac ornare nisl ullamcorper vel. Aliquam nibh libero, consequat in arcu molestie, congue scelerisque elit. Integer eu ex in tellus iaculis egestas. Aliquam a molestie ante. Etiam eget magna id neque suscipit sollicitudin. Phasellus dolor erat, sagittis ut felis quis, faucibus finibus est. Aenean nunc justo, venenatis nec urna a, vehicula lacinia odio. Ut molestie velit vitae augue pulvinar dignissim. Integer tempus nisi dignissim nisl rutrum venenatis at in leo."),
      ],
    );
  }
}
</code>```

When I click on the button, I get the following error. If there is no error, I should be navigating into another page "ProductPage".

```<code>I/flutter (31115): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter (31115): The following assertion was thrown building Builder(dirty):
I/flutter (31115): The builder for route "null" returned null.
I/flutter (31115): Route builders must never return null.
</code>```

What is the problem here?

答:
```<code>  Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
                PageOne();
              }));
</code>```

Instead of just instantiating the page to be pushed in the builder method ,add it as a return param

```<code>Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
              return  PageOne();
              }));
</code>```

Body:
I am new to flutter and below is my code

homepage.dart

import 'package:flutter/material.dart';

import './product_page.dart';

class Homepage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("Choco Factory"),
      ),
      body: HomepageUI(),
    );
  }
}

class HomepageUI extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _HomepageUIState();
  }
}

class _HomepageUIState extends State<HomepageUI> {
  List<Map<String, String>> productsMap = [];

  _HomepageUIState() {
    productsMap
        .add({"title": "Cappuccino", "imageUrl": "assets/cappuccino.jpg"});
    productsMap.add(
        {"title": "Chocolate Cake", "imageUrl": "assets/chocolate_cake.jpg"});
    productsMap
        .add({"title": "Chocolates", "imageUrl": "assets/chocolates.jpg"});
    productsMap.add(
        {"title": "Hot Chocolate", "imageUrl": "assets/hot_chocolate.jpg"});
    productsMap.add({"title": "Naougat", "imageUrl": "assets/nougat.jpg"});
    productsMap.add(
        {"title": "White Chocolate", "imageUrl": "assets/white_chocolate.jpg"});
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      children: <Widget>[
        Text("Select Your Choco!"),
        Expanded(
            child: ListView.builder(
          itemBuilder: _listBuilder,
          itemCount: productsMap.length,
        )

            //child: Image.asset("assets/chocolates.jpg"),
            )
      ],
    );
  }

  Widget _listBuilder(BuildContext context, int index) {
    return Card(
      child: Column(
        children: <Widget>[
          Image.asset(productsMap[index]["imageUrl"]),
          Text(productsMap[index]["title"]),
          RaisedButton(
            child: Text("Details"),
            color: Colors.green,
            onPressed: () {
              Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
                ProductPage(productsMap[index]["title"],
                    productsMap[index]["imageUrl"]);
              }));
            },
          )
        ],
      ),
    );
  }
}

product_page.dart

import 'package:flutter/material.dart';

class ProductPage extends StatelessWidget {
  final String  title, imageUrl;

  ProductPage(this.title,this.imageUrl);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("Choco Factory"),
      ),
      body: ProductPageUI(title, imageUrl),
    );
  }
}

class ProductPageUI extends StatefulWidget {

  String title, imageUrl;

  ProductPageUI(this.title, this.imageUrl);

  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _ProductPageUIState();
  }
}

class _ProductPageUIState extends State<ProductPageUI> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return _productPageUIBuilder(widget.title, widget.imageUrl);
  }

  Widget _productPageUIBuilder(String title, String imageUrl) {
    return Column(
      children: <Widget>[
        Text(title),
        Image.asset(imageUrl),
        Text(
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean semper sodales nisi, ac ornare nisl ullamcorper vel. Aliquam nibh libero, consequat in arcu molestie, congue scelerisque elit. Integer eu ex in tellus iaculis egestas. Aliquam a molestie ante. Etiam eget magna id neque suscipit sollicitudin. Phasellus dolor erat, sagittis ut felis quis, faucibus finibus est. Aenean nunc justo, venenatis nec urna a, vehicula lacinia odio. Ut molestie velit vitae augue pulvinar dignissim. Integer tempus nisi dignissim nisl rutrum venenatis at in leo."),
      ],
    );
  }
}

When I click on the button, I get the following error. If there is no error, I should be navigating into another page "ProductPage".

I/flutter (31115): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter (31115): The following assertion was thrown building Builder(dirty):
I/flutter (31115): The builder for route "null" returned null.
I/flutter (31115): Route builders must never return null.

What is the problem here?

Body:
  Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
                PageOne();
              }));

Instead of just instantiating the page to be pushed in the builder method ,add it as a return param

Navigator.push(context,
                  MaterialPageRoute(builder: (BuildContext context) {
              return  PageOne();
              }));


问:
Same Object is getting added into list of object
I have 5 records in db , and i want to show them on UI , but with the below code while iterating it shows different object but in list it shows same object 5 times
Help me with this and tell if i can have better coding practice

I have used For loop to iterate and get the record into list of friend

```<code>  public ViewResult Contact()
    {
        Friends friend = new Friends();
        List<Friends> friends = new List<Friends>();
        string connectionString = ConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString;
        SqlConnection con = new SqlConnection(connectionString);
        SqlCommand cmd = new SqlCommand("select * from Friends", con);
        SqlDataAdapter da = new SqlDataAdapter();
        DataTable dt = new DataTable();
        da.SelectCommand = cmd;
        da.Fill(dt);

        for (var i = 0; i < dt.Rows.Count; i++)
        {
            friend.friendId = Convert.ToInt32(dt.Rows[i]["FriendId"]);
            friend.firstName = dt.Rows[i]["FirstName"].ToString();
            friend.lastName = dt.Rows[i]["LastName"].ToString();
            friend.currentAmountGiven = Convert.ToInt32(dt.Rows[i]["CurrentAmountGiven"]);
            friend.totalAmount = Convert.ToInt32(dt.Rows[i]["TotalAmount"]);
            friends.Add(friend);
        }
        return View(friends);

    }
</code>```

In Friends i am getting same row 5 times from db

need output as i told above

答:
You are changing the same friend object over and over again.

Although the properties change every time, it's still the same object reference.

This should work:

```<code>public ViewResult Contact()
{
    List<Friends> friends = new List<Friends>();
    string connectionString =
        ConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString;
    SqlConnection con = new SqlConnection(connectionString);
    SqlCommand cmd = new SqlCommand("select * from Friends", con);
    SqlDataAdapter da = new SqlDataAdapter();
    DataTable dt = new DataTable();
    da.SelectCommand = cmd;
    da.Fill(dt);

    for (var i = 0; i < dt.Rows.Count; i++)
    {

        Friends friend = new Friends();
        friend.friendId = Convert.ToInt32(dt.Rows[i]["FriendId"]);
        friend.firstName = dt.Rows[i]["FirstName"].ToString();
        friend.lastName = dt.Rows[i]["LastName"].ToString();
        friend.currentAmountGiven = Convert.ToInt32(dt.Rows[i]["CurrentAmountGiven"]);
        friend.totalAmount = Convert.ToInt32(dt.Rows[i]["TotalAmount"]);
        friends.Add(friend);
    }
    return View(friends);
}
</code>```

See Here to see more on reference types.

Additionally, some more coding tips:

Name your classes in singular, a single Friends object is not
actually friends, it's a Friend

Name properties like FirstName, LastName etc. instead of firstName lastName. This is just a generally accepted convention.

Body:
I have 5 records in db , and i want to show them on UI , but with the below code while iterating it shows different object but in list it shows same object 5 times
Help me with this and tell if i can have better coding practice

I have used For loop to iterate and get the record into list of friend

  public ViewResult Contact()
    {
        Friends friend = new Friends();
        List<Friends> friends = new List<Friends>();
        string connectionString = ConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString;
        SqlConnection con = new SqlConnection(connectionString);
        SqlCommand cmd = new SqlCommand("select * from Friends", con);
        SqlDataAdapter da = new SqlDataAdapter();
        DataTable dt = new DataTable();
        da.SelectCommand = cmd;
        da.Fill(dt);

        for (var i = 0; i < dt.Rows.Count; i++)
        {
            friend.friendId = Convert.ToInt32(dt.Rows[i]["FriendId"]);
            friend.firstName = dt.Rows[i]["FirstName"].ToString();
            friend.lastName = dt.Rows[i]["LastName"].ToString();
            friend.currentAmountGiven = Convert.ToInt32(dt.Rows[i]["CurrentAmountGiven"]);
            friend.totalAmount = Convert.ToInt32(dt.Rows[i]["TotalAmount"]);
            friends.Add(friend);
        }
        return View(friends);

    }

In Friends i am getting same row 5 times from db

need output as i told above

Body:
You are changing the same friend object over and over again.

Although the properties change every time, it's still the same object reference.

This should work:

public ViewResult Contact()
{
    List<Friends> friends = new List<Friends>();
    string connectionString =
        ConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString;
    SqlConnection con = new SqlConnection(connectionString);
    SqlCommand cmd = new SqlCommand("select * from Friends", con);
    SqlDataAdapter da = new SqlDataAdapter();
    DataTable dt = new DataTable();
    da.SelectCommand = cmd;
    da.Fill(dt);

    for (var i = 0; i < dt.Rows.Count; i++)
    {

        Friends friend = new Friends();
        friend.friendId = Convert.ToInt32(dt.Rows[i]["FriendId"]);
        friend.firstName = dt.Rows[i]["FirstName"].ToString();
        friend.lastName = dt.Rows[i]["LastName"].ToString();
        friend.currentAmountGiven = Convert.ToInt32(dt.Rows[i]["CurrentAmountGiven"]);
        friend.totalAmount = Convert.ToInt32(dt.Rows[i]["TotalAmount"]);
        friends.Add(friend);
    }
    return View(friends);
}

See Here to see more on reference types.

Additionally, some more coding tips:

Name your classes in singular, a single Friends object is not
actually friends, it's a Friend

Name properties like FirstName, LastName etc. instead of firstName lastName. This is just a generally accepted convention.


问:
How to compare the differences of two folders and save in new folder
I want to compare the differences between two folders and then copy the differences to a NEW folder.

I have seen existing software like winmerge and robo copy that allows you to copy the differences between two folders and synchronise the two folders so that the contents of each folder are the same. However, I do not want to do this.

I want the differences of the two folders to be saved within a different folder/location. Also - happy to take on recommendations for scripts rather than software i.e. cmd, python etc.

答:
Use diff command:

Let's say you have two folder:

folder-1

folder-2

In this case, the command should be:

```<code>diff -rq folder-1 folder-2 > /tmp/mydiff.diff
</code>```

The results are saved in your new file mydiff.diff within the folder /tmp. Use the folder that fits with your need.

You must run the command from within the masterFolder that contains the two subfolder:

```<code>masterFolder
├── folder-1
├── folder-2
</code>```

Example:

```<code>user@user-pc:~/Document/masterFolder/ $ diff -rq folder-1 folder-2 > /tmp/mydiff.diff
</code>```

Remember to substitute folder-1 and folder-2 with the name of your folder!!

Body:
Use diff command:

Let's say you have two folder:

folder-1

folder-2

In this case, the command should be:

diff -rq folder-1 folder-2 > /tmp/mydiff.diff

The results are saved in your new file mydiff.diff within the folder /tmp. Use the folder that fits with your need.

You must run the command from within the masterFolder that contains the two subfolder:

masterFolder
├── folder-1
├── folder-2

Example:

user@user-pc:~/Document/masterFolder/ $ diff -rq folder-1 folder-2 > /tmp/mydiff.diff

Remember to substitute folder-1 and folder-2 with the name of your folder!!


问:
I want Generic class's "Class<T>" with "Class variable"
I want to get Generic class's type variable for JsonDeserialize.

```<code>Class Data<T> {
  private T data;
}

Class DataType {
  private String dummy;
}

Class dataTypeClass = DataType.class;

// I want get this.
Class dataClass = Data<dataTypeClass>.class;

</code>```

I've tried it like this way, It doesn't work.

Could I get Data.class ??

答:
If you're using Jackson as your library. You can just use TypeReference:

```<code>TypeReference<Data<DataType>> r = new TypeReference<Data<DataType>>() {};
...
Data<DataType> data = objectMapper.readValue(json, r);
</code>```

This code will create a new anonymous sub class of TypeReference parameterized with <Data<DataType>>. This class internally uses a "hackaround" to get the generic parameter, which then is picked up by Jackson to deserialize your JSON.

Body:
I want to get Generic class's type variable for JsonDeserialize.

Class Data<T> {
  private T data;
}

Class DataType {
  private String dummy;
}

Class dataTypeClass = DataType.class;

// I want get this.
Class dataClass = Data<dataTypeClass>.class;

I've tried it like this way, It doesn't work.

Could I get Data.class ??

Body:
If you're using Jackson as your library. You can just use TypeReference:

TypeReference<Data<DataType>> r = new TypeReference<Data<DataType>>() {};
...
Data<DataType> data = objectMapper.readValue(json, r);

This code will create a new anonymous sub class of TypeReference parameterized with <Data<DataType>>. This class internally uses a "hackaround" to get the generic parameter, which then is picked up by Jackson to deserialize your JSON.