InfoBox

CesiumJS
1

Hi,

I have a table drawn in the infobox description. The code looks like this:

target.description =
"<div id ='grpChkBox'>" +
  "<p><input type='checkbox' name='alertid'>Alert ID</p>" +
    "<p><input type='checkbox' name='time'>Time</p>" +
    "<p><input type='checkbox' name='group'>Group</p>" +
  "</div>" +

"<table id='someTable' border='1'>" +
  "<thead>" +
      "<tr>" +
        "<th class='alertid'>Alert ID</th>" +
        "<th class='time'>Time</th>" +
        "<th class='group'>Group</th>" +
      "</tr>" +
  "</thead>" +
  "<tbody>" +
      "<tr>" +
      "<td>" + alertId + "</td>" +
        "<td>" + iso[1] + ' ' + iso[2] + "</td>" +
        "<td>" + groupId + "</td>" +
      "</tr>" +
  "</tbody>" +
"</table>";

And I have this jQuery function that allows the user to hide/show a table column in the infobox description:

$(function () {
  var chk = ("#grpChkBox input:checkbox");
  var tbl = ("#someTable");
  var tblhead = ("#someTable th");

  $chk.prop('checked', true);

  $chk.click(function () {
    var colToHide = tblhead\.filter\(&quot;\.&quot; \+ (this).attr("name"));
    var index = $(colToHide).index();
    $tbl.find('tr :nth-child(' + (index + 1) + ')').toggle();
  });
});

By default, as you click onto an entity to display the infobox description, the boxes from the <div id ='grpChkBox'> should be checked. However, mine isn't. Therefore, my jQuery function to hide/show table columns is not working.

Is there any way to solve this issue?

Thank you in advance!

Trialea