Bug condition :
1. There must be enough data for scrolling
2. cls must be added dynamically - ex) editModel.addDisableCls = true
3. colModel.editable is function & function call method getChanges()
- maybe another method occurs same bug
Result :
1. If you scroll while editing, editing will end.
2. Newly rendered rows are duplicated(has same aria-rowindex).
3. Duplicated row has only first column
Example
https://paramquery.com/pro/demos/grid_jsonp - add Grid Option
editModel : { addDisableCls : true }
- add Option for ColModel Column
editable: function (ui) {
this.getChanges();
return true;
}
full Javascript
/*
$(function () {
var colModel= [
{ title: "Product ID", dataType: "integer", dataIndx: "ProductID", editable: false, width: 80, editable: function (ui) {
this.getChanges()
return true;
}
},
{ title: "Product Name", width: 165, dataType: "string", dataIndx: "ProductName" },
{ title: "Quantity Per Unit", width: 140, dataType: "string", align: "right", dataIndx: "QuantityPerUnit" },
{ title: "Unit Price", width: 100, dataType: "float", align: "right", dataIndx: "UnitPrice" },
{ title: "Units In Stock", width: 100, dataType: "integer", align: "right", dataIndx: "UnitsInStock" },
{ title: "Discontinued", width: 100, dataType: "bool", align: "center", dataIndx: "Discontinued" }
];
var dataModel = {
location: "remote",
dataType: "jsonp",
method: "GET",
url: "/pro/products/get_jsonp"
//url: "/pro/products.php",//for PHP
};
$("#grid_jsonp").pqGrid({
height: 450,
scrollModel: {autoFit: true},
dataModel: dataModel,
colModel: colModel,
numberCell: { resizable: true, width: 30, title: "#" },
title: "Products",
resizable: true,
editModel : { addDisableCls : true }
});
});
*/
Result
real Row
<div class="pq-grid-row pq-striped" role="row" id="pq-body-row-u5-18-right" aria-rowindex="19" style="top:486px;height:27px;width:100%;"><div class="pq-grid-cell pq-align-right" role="gridcell" id="pq-body-cell-u5-18-0-right" style="left: 30px; width: 206px; height: 27px;"><div>31</div></div><div class="pq-grid-cell" role="gridcell" id="pq-body-cell-u5-18-1-right" style="left: 236px; width: 291px; height: 27px;"><div>Gorgonzola Telino</div></div><div class="pq-grid-cell pq-align-right" role="gridcell" id="pq-body-cell-u5-18-2-right" style="left: 527px; width: 265px; height: 27px;"><div>12 - 100 g pkgs</div></div><div class="pq-grid-cell pq-align-right" role="gridcell" id="pq-body-cell-u5-18-3-right" style="left: 792px; width: 226px; height: 27px;"><div>12.5</div></div><div class="pq-grid-cell pq-align-right" role="gridcell" id="pq-body-cell-u5-18-4-right" style="left: 1018px; width: 225px; height: 27px;"><div>0</div></div><div class="pq-grid-cell pq-align-center" role="gridcell" id="pq-body-cell-u5-18-5-right" style="left: 1243px; width: 226px; height: 27px;"><div>false</div></div></div>
duplicated row
<div class="pq-grid-row pq-striped" role="row" id="pq-body-row-u5-18-right" aria-rowindex="19" style="top:486px;height:27px;width:100%;"><div class="pq-grid-cell pq-align-right" role="gridcell" id="pq-body-cell-u5-18-0-right" style="left:30px;width:206px;height:27px;"><div>31</div></div></div>