JQuery Grid

Invoke the cellhover method of the jqxGrid. Author: http://jqwidgets.com

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<script src="https://jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/generatedata.js"></script>
<div id="kanban"></div>

JavaScript

$(document).ready(function() {
   const fields = [{
       name: "id",
       type: "string"
     },
     {
       name: "status",
       map: "state",
       type: "string"
     },
     {
       name: "text",
       map: "label",
       type: "string"
     },
     {
       name: "tags",
       type: "string"
     },
     {
       name: "color",
       map: "hex",
       type: "string"
     },
     {
       name: "resourceId",
       type: "number"
     }
   ];

   const data = [{
       id: "1161",
       state: "new",
       label: "Combine Orders",
       tags: "orders, combine",
       hex: "#5dc3f0",
       tooltipData: '1161',
       resourceId: 3
     },
     {
       id: "1645",
       state: "work",
       label: "Change Billing Address",
       tags: "billing",
       hex: "#f19b60",
       tooltipData: '1645',
       resourceId: 1
     },
     {
       id: "9213",
       state: "new",
       label: "One item added to the cart",
       tags: "cart",
       hex: "#5dc3f0",
       tooltipData: '9213',
       resourceId: 3
     },
     {
       id: "6546",
       state: "done",
       label: "Edit Item Price",
       tags: "price, edit",
       hex: "#5dc3f0",
       tooltipData: '6546',
       resourceId: 4
     },
     {
       id: "9034",
       state: "new",
       label: "Login 404 issue",
       tags: "issue, login",
       tooltipData: '9034',
       hex: "#6bbd49"
     }
   ];

   const source = {
     localData: data,
     dataType: "array",
     dataFields: fields
   };

   const dataAdapter = new $.jqx.dataAdapter(source);

   const resourcesAdapterFunc = function() {
     const resourcesSource = {
       localData: [{
           id: 0,
           name: "No name",
           image: "https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/images/common.png",
           common: true
         },
         {
           id: 1,
           name: "Andrew Fuller",
           image: "https://www.jqwidgets.com/jquery-widgets-demo/images/andrew.png"
 ...