first scenario: pageSize:5
1. my grid is displaying 5 rows. on the right side of grid footer it says 1-3 of 3 items. how??
2. actual result have seven data items still grid doesn't allow me to go to the next page.
second scenario: pageSize:2
1. in the right side of grid footer it says 1-2 of 3 items, as soon as I clicked on second page it says 3-4 of 7 items.
i really do not understand why grid is behaving so weird. what am I doing wrong?
i have attached png files for both scenario and as well as in what
form my data is coming. please take a look at those pictures.
the below one is my grid. please let me know what is wrong i'm doing.
references that I have follow to create this grid is http://www.telerik.com/forums/grid-support-for-data-in-array-form-instead-of-object-form#KyFQE9yl006Mm_iV0QM8fw
http://jsbin.com/utaquf/9/edit?html,js,output
001.
$.ajax({
002.
type:
"GET"
,
003.
url:
"/Actionables/SearchSubmissions/"
,
004.
data: {
005.
filters: param,
006.
moduleToSearch: moduleID,
007.
moduleItemToSearch: moduleItemID,
008.
},
009.
success:
function
(result) {
010.
var
defer = $.Deferred();
011.
function
confirmation(result) {
012.
if
(result.length > 1) {
013.
$(
'#field'
+ questionID).append(
'<div id=dialog></div>'
);
014.
$(
"#dialog"
).append(
'<div id=grid></div>'
);
015.
$(
"#dialog"
).kendoDialog({
016.
modal:
true
,
017.
visible:
false
,
018.
draggable:
true
,
019.
closable:
false
,
020.
title:
"Please Select One Submission"
,
021.
maxWidth: 500,
022.
//maxHeight:300,
023.
animation: {
024.
open: {
025.
effects:
"slideIn:down fadeIn"
,
026.
duration: 500
027.
},
028.
close: {
029.
effects:
"slide:up fadeOut"
,
030.
duration: 500
031.
}
032.
},
033.
actions: [
034.
{ text:
'OK'
, primary:
true
, action: onOK }
035.
]
036.
});
037.
$(
"#grid"
).kendoGrid({
038.
dataSource: {
039.
data: result,
040.
schema: {
041.
data:
function
(result) {
042.
return
$.map(result,
function
(item) {
043.
return
$.map(item,
function
(innerData) {
044.
for
(
var
i = 0; i < displayFields.length; i++){
045.
if
(displayFields[i] == innerData.FieldIDString)
046.
{
047.
return
{
048.
EntryGroupID: innerData.EntryGroupID,
049.
FieldTextString : innerData.FieldTextString,
050.
EntryValue: innerData.EntryValue
051.
}
052.
}
053.
}
054.
});
055.
});
056.
}
057.
},
058.
pageSize: 2,
059.
group: { field:
"EntryGroupID"
}
060.
},
061.
filterable: {
062.
mode:
"row"
063.
},
064.
pageable: {
065.
refresh:
true
,
066.
},
067.
noRecords: {
068.
template:
"No records to display"
069.
},
070.
groupable:
false
,
071.
//scrollable: true,
072.
selectable:
true
,
073.
columns: [{
074.
field:
"EntryGroupID"
,
075.
title:
"Submissions"
,
076.
filterable: {
077.
cell: {
078.
operator:
"contains"
079.
}
080.
}
081.
}, {
082.
field:
"FieldTextString"
,
083.
title:
"Questions"
,
084.
filterable: {
085.
cell: {
086.
operator:
"contains"
087.
}
088.
}
089.
}, {
090.
field:
"EntryValue"
,
091.
title:
"Answers"
,
092.
filterable: {
093.
cell: {
094.
operator:
"contains"
095.
}
096.
}
097.
}]
098.
});
099.
var
wnd = $(
"#dialog"
).data(
"kendoDialog"
);
100.
wnd.wrapper.find(
'.k-dialog-title'
).css(
'background'
, CIMSFields.backgroundColour).css(
'color'
, IMSFields.textColour).css(
'width'
,
'100%'
).css(
'text-align'
,
'center'
);
101.
wnd.open().center(
true
);
102.
103.
function
onOK(e) {
104.
var
data = [];
105.
var
grid = $(
"#grid"
).data(
"kendoGrid"
);
106.
var
selectedItem = grid.dataItem(grid.select());
107.
if
(selectedItem !=
null
) {
108.
$.map(result,
function
(item) {
109.
if
(selectedItem.EntryGroupID == item[0].EntryGroupID) {
110.
data.push(item);
111.
defer.resolve(data);
112.
}
113.
});
114.
}
115.
else
{
116.
defer.resolve(data);
117.
}
118.
wnd.close();
119.
}
120.
}
121.
else
{
122.
defer.resolve(result);
123.
}
124.
125.
return
defer.promise();
126.
127.
}