Html Grid

Set the showemptyrow property of the jqxGrid. Author: http://jqwidgets.com

by jqwidgets

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">
<div id="jqxgrid"></div>
<button style='margin: 10px;' id="button">Set "showemptyrow" to false</button>

JavaScript

$("#jqxgrid").jqxGrid({
    showemptyrow: true,
    theme: 'energyblue',
    sortable: true,
    autoshowfiltericon: true,
    width:500,
    columns: [{
        text: 'First Name',
        datafield: 'firstname',
        width: 90
    }, {
        text: 'Last Name',
        datafield: 'lastname',
        width: 90
    }, {
        text: 'Product',
        datafield: 'productname',
        width: 170
    }, {
        text: 'Order Date',
        datafield: 'date',
        cellsformat: 'dd-MMMM-yyyy'
    }]
});
$("#button").jqxButton({
    theme: 'energyblue'
});
$("#button").click(function () {
    $("#jqxgrid").jqxGrid({
        showemptyrow: false
    });
    $("#jqxgrid").jqxGrid('refresh');
});