<div class="container-fluid">
        <div id="theGrid">
        </div>
    </div>
.wj-flexgrid {
    max-height: 250px;
    margin-bottom: 12px;
}

.header {
    display: inline-block;
    width: 150px;
    text-align: right;
    font-weight: normal;
}
document.readyState === 'complete' ? init() : window.onload = init;
//
function init() {
  var startDateEditor = new wijmo.input.InputDate(document.createElement("div"));
  var endDateEditor = new wijmo.input.InputDate(document.createElement("div"));
  // default grid
  var theGrid = new wijmo.grid.FlexGrid('#theGrid', {
    itemsSource: getData(20),
    beginningEdit: function (s, e) {
      s.columns.getColumn("startDate").editor = startDateEditor;
      s.columns.getColumn("endDate").editor = endDateEditor;
      let col = e.getColumn();
      if (col.binding !== "endDate") {
        return;
      }

      let startDate = e.getRow().dataItem.startDate;
      if (!startDate) {
        return;
      }
      
      let endDate = e.getRow().dataItem.endDate;
      if (!endDate) {
        return;
      }
  
  
  
      let endMinDate = wijmo.DateTime.addDays(startDate, 1);
      let endMaxDate = wijmo.DateTime.addDays(endDate, 1);
      endDateEditor.min = endMinDate;
      endDateEditor.max = endMaxDate
      
    }
  });
}

function getData(count) {
  var countries = "US,Germany,UK,Japan,Italy,Greece".split(","),
      products = "Phones,Computers,Cameras,Stereos".split(","),
      data = [];
  for (var i = 0; i < count; i++) {
    data.push({
      id: i,
      country: countries[i % countries.length],
      product: products[i % products.length],
      startDate: new Date(
        Math.floor(new Date().getTime() + Math.random() * 2222222222)
      ),
      endDate: new Date(
        Math.floor(new Date().getTime() + Math.random() * 222222222222)
      ),
      downloads: Math.round(100 + Math.random() * 10000),
      sales: Math.random() * 10000,
      expenses: Math.random() * 5000,
      active: Math.random() > 0.5
    });
  }

  return data;
}

External CSS

  1. https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css
  2. https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.1/css/bulma.min.css
  3. https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css

External JavaScript

  1. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js
  2. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js
  3. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.min.js
  4. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.filter.min.js
  5. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.sheet.min.js
  6. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.xlsx.min.js
  7. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.xlsx.min.js
  8. https://www.grapecity.co.kr/files/license/Wijmo/CodePen_License.js
  9. https://cdnjs.cloudflare.com/ajax/libs/jszip/3.5.0/jszip.min.js
  10. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.search.min.js
  11. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.grouppanel.min.js
  12. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.cellmaker.min.js
  13. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.pdf.min.js
  14. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.pdf.min.js
  15. https://code.jquery.com/jquery-3.5.1.slim.min.js
  16. https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js
  17. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.odata.min.js
  18. https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.detail.min.js