[daniel_yap01Participant]

Hi Peter,

i modified this jsfiddle…i added some more columns…(see below)
http://jsfiddle.net/jqwidgets/gPEec/

scrolling with ‘pinned’ column is more ‘choppy’
nothing we can do about this?

Thanks

var data = generatedata(500);
var source = {
localdata: data,
datafields: [{
name: ‘firstname’,
type: ‘string’
}, {
name: ‘lastname’,
type: ‘string’
}, {
name: ‘productname’,
type: ‘string’
}, {
name: ‘date’,
type: ‘date’
}, {
name: ‘quantity’,
type: ‘number’
}, {
name: ‘price’,
type: ‘number’
}, {
name: ‘price2’,
type: ‘number’
}, {
name: ‘price3’,
type: ‘number’
}, {
name: ‘price4’,
type: ‘number’
}, {
name: ‘price5’,
type: ‘number’
}, {
name: ‘price6’,
type: ‘number’
}, {
name: ‘price7’,
type: ‘number’
}, {
name: ‘price9’,
type: ‘number’
}, {
name: ‘price0’,
type: ‘number’
}, {
name: ‘price10’,
type: ‘number’
}],
datatype: “array”
};

var adapter = new $.jqx.dataAdapter(source);
$(“#jqxgrid”).jqxGrid({
width: 500,
theme: ‘energyblue’,
source: adapter,
sortable: true,
selectionmode: ‘singlecell’,
columns: [{
pinned: true,
text: ‘First Name’,
datafield: ‘firstname’,
columngroup: ‘Name’,
width: 90
}, {
text: ‘Last Name’,
columngroup: ‘Name’,
datafield: ‘lastname’,
width: 90
}, {
text: ‘Product’,
datafield: ‘productname’,
width: 170
}, {
text: ‘Order Date’,
datafield: ‘date’,
width: 160,
cellsformat: ‘dd-MMMM-yyyy’
}, {
text: ‘Quantity’,
datafield: ‘quantity’,
width: 80,
cellsalign: ‘right’
}, {
text: ‘Unit Price’,
datafield: ‘price’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price2’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price3’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price4’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price5’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price6’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price7’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price8’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price9’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}, {
text: ‘Unit Price’,
datafield: ‘price10’,
cellsalign: ‘right’,
cellsformat: ‘c2’
}]
});

$(“#jqxbutton”).jqxButton({
theme: ‘energyblue’,
width: 300,
height: 30
});

$(‘#jqxbutton’).click(function () {
var pinned = $(‘#jqxgrid’).jqxGrid(‘iscolumnpinned’, ‘firstname’);
alert(‘The second column is pinned:’ + pinned);
});

[Author]

Posts