Hi,
I’m seeing an exception when destroying the grid in IE and Chrome (didn’t test other browsers).
SCRIPT5022: Invalid jQuery Selector! Please, check whether the used ID or CSS Class name is correct. jqx-all.js, line 7 character 5476
The error message is suggesting I’m using a wrong ID selector, which I don’t think is the case. Here’s the complete HTML code:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><title>Insert title here</title><link href="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/jqx.base.css" rel="stylesheet" type="text/css"/><script type="text/javascript" src="http://www.jqwidgets.com/jquery-widgets-demo/scripts/jquery-1.10.1.min.js"></script><script type="text/javascript" src="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js"></script><script type="text/javascript">$(document).ready(function() { $("#grid").jqxGrid({ theme: "", width: $(window).innerWidth() - 20, height: $(window).innerHeight() - 200, columnsresize: true, columnsreorder: true, selectionmode: 'multiplerows', filterable: true, sortable: true, pageable: true, pagesize: 100, pagesizeoptions: [100, 500], showfilterrow: true, columns: [ { text: "", columntype: "checkbox", datafield: "selected", width: 50, filterable: false}, { text: "ID", datafield: "id", editable: false } ], source: new $.jqx.dataAdapter({ localdata: [ { selected: true, id: "ID - 1" } ], datatype: 'array' }), rowdetails: true, rowdetailstemplate: { rowdetails: "<div></div>", rowdetailsheight: 250 }, initrowdetails: function(index, parentElement, gridElement, datarecord) { $(parentElement).find("div").html("Hello"); }, ready: function() { console.log("Now destroying"); $("#grid").jqxGrid('destroy'); } });});</script></head><body><div id="grid"></div></body></html>