jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Original html is always rewritten when scrolling
This topic contains 4 replies, has 2 voices, and was last updated by williamtourinho 12 years, 2 months ago.
-
Author
-
Hi,
if I modify the style attribute of a cell in the grid, when I scroll my modification is canceled, ie will reappear the original style. How can I set the style to not be change with the scroll.
What happens is that the original html is always rewritten when the user makes scroll.
The editable state of the grid is set to false in my case.
Thank you.Hi williamtourinho,
If you want to customize a cell, use the ‘cellsrenderer’ callback function. See here: jquery-grid-cellsrendering.htm.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comHi Petter, here a example to better understand my problem. Thank you for your time.
$(document).ready(function () {
var theme = getTheme();
var data = generatedata(500);
var source =
{
localdata: data,
datatype: “array”
};
var dataAdapter = new $.jqx.dataAdapter(source);var cellrenderer = function (row, column, value) {
var html = ‘‘ + value +’‘;
return html;
}$(“#jqxgrid”).jqxGrid(
{
width: 685,
source: dataAdapter,
showfilterrow: true,
filterable: true,
theme: theme,
columns: [
{ text: ‘Name’, columntype: ‘textbox’, filtertype: ‘textbox’, filtercondition: ‘starts_with’, cellsrenderer: cellrenderer, datafield: ‘name’, width: 115 },
{
text: ‘Product’, filtertype: ‘checkedlist’, datafield: ‘productname’, width: 220
},
{ text: ‘Available’, datafield: ‘available’, columntype: ‘checkbox’, filtertype: ‘bool’, width: 67 },
{ text: ‘Ship Date’, datafield: ‘date’, filtertype: ‘date’, width: 210, cellsalign: ‘right’, cellsformat: ‘d’ },
{ text: ‘Qty.’, datafield: ‘quantity’, filtertype: ‘number’, cellsalign: ‘right’ }
]
});
$(‘#button’).jqxButton({ height: 25, theme: theme });
$(‘#button’).click(function () {
var rows = $(‘#jqxgrid’).jqxGrid(‘getrows’);
var rowindex = $(‘#jqxgrid’).jqxGrid(‘getselectedrowindex’);$(“#NameRow_” + rowindex).css(“color”, “blue”);
});
});select cell, press button and them move the scroll bar to see behavior
Hi williamtourinho,
To modify the rendering of a cell, use the cellsrenderer callback. The Grid reuses the cells HTML elements so you can’t statically apply a style to a cell, row or any other HTML element. You should use the built-in methods provided by the widget.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comWith the ‘setcellvalue’ I was able to do what I needed. Thank you.
-
AuthorPosts
You must be logged in to reply to this topic.