Scroller not working for me server side, only gives me 10 total results
Scroller not working for me server side, only gives me 10 total results
Problem site link: http://abad02f2af7545e4bca5777aa198b4fa.cloudapp.net/
I am trying to get Scroller on the server side working with an ASP.NET AJAX implementation. The total number of records that I currently have is 51. However, as it is currently setup it only gives me 10 records and the scroller length on the right hand side only indicates there are 10 records (it is not long enough to suggest there are 51). These 10 records are displayed OK. The text beneath my table says: "Showing 1 to 10 of 51 entries." If I scroll down, I do NOT get another call on my server side requesting more data.
On the client side, I try to setup my Scroller code as follows:
[code]
var oTable = $('#unitTableData').dataTable({
"bServerSide": true, // All processing will be done in our controller
"sAjaxSource": "/UTS/UnitListHandler", // Where our controller is
"bProcessing": false,
"sScrollY": "300px", // Fix the height of the table
"sDom": "rtiS", // Dynamically request the content
"oScroller": { // Let the user know that data is loading
"loadingIndicator": true
},
"aoColumns": [ // Per-column settings and alignments
{ "bVisible": false }, // Primary key "id"
{ }, // C Number
{}, // Serial number
{}, // Label
{ "bVisible": false }, // IP Address
{ sWidth: '20%', sClass: "alignCenter" }, // Build
{}, // Location
{ "bVisible": false } // Location label
]
});
[/code]
On the server side, I return the follow Json data:
[code]
public ActionResult UnitListHandler(jQueryDataTableParamModel param)
{
var currUnitResults = pacificRepo.Units.OrderBy(p => p.c_number).Skip(param.iDisplayStart).Take(param.iDisplayLength).ToList();
return Json(new
{
sEcho = param.sEcho,
iTotalRecords = pacificRepo.Units.Count(), // Value = 51
iTotalDisplayRecords = pacificRepo.Units.Count(), // Value = 51
aaData = FormatUnitData(currUnitResults) // An array of 10 items (since
},
JsonRequestBehavior.AllowGet);
}
[/code]
Does anyone see what I am doing wrong here? It returns 10 items as I believe it should, since that is what the default iDisplayLength is set to. I think that iTotalRecords and iTotalDisplayRecords is correct. But why would the scroller bar only be long enough for 10 items, and why are more not requested when i scroll down on the client side?
I would sincerely appreciate any help/suggestions!
I am trying to get Scroller on the server side working with an ASP.NET AJAX implementation. The total number of records that I currently have is 51. However, as it is currently setup it only gives me 10 records and the scroller length on the right hand side only indicates there are 10 records (it is not long enough to suggest there are 51). These 10 records are displayed OK. The text beneath my table says: "Showing 1 to 10 of 51 entries." If I scroll down, I do NOT get another call on my server side requesting more data.
On the client side, I try to setup my Scroller code as follows:
[code]
var oTable = $('#unitTableData').dataTable({
"bServerSide": true, // All processing will be done in our controller
"sAjaxSource": "/UTS/UnitListHandler", // Where our controller is
"bProcessing": false,
"sScrollY": "300px", // Fix the height of the table
"sDom": "rtiS", // Dynamically request the content
"oScroller": { // Let the user know that data is loading
"loadingIndicator": true
},
"aoColumns": [ // Per-column settings and alignments
{ "bVisible": false }, // Primary key "id"
{ }, // C Number
{}, // Serial number
{}, // Label
{ "bVisible": false }, // IP Address
{ sWidth: '20%', sClass: "alignCenter" }, // Build
{}, // Location
{ "bVisible": false } // Location label
]
});
[/code]
On the server side, I return the follow Json data:
[code]
public ActionResult UnitListHandler(jQueryDataTableParamModel param)
{
var currUnitResults = pacificRepo.Units.OrderBy(p => p.c_number).Skip(param.iDisplayStart).Take(param.iDisplayLength).ToList();
return Json(new
{
sEcho = param.sEcho,
iTotalRecords = pacificRepo.Units.Count(), // Value = 51
iTotalDisplayRecords = pacificRepo.Units.Count(), // Value = 51
aaData = FormatUnitData(currUnitResults) // An array of 10 items (since
},
JsonRequestBehavior.AllowGet);
}
[/code]
Does anyone see what I am doing wrong here? It returns 10 items as I believe it should, since that is what the default iDisplayLength is set to. I think that iTotalRecords and iTotalDisplayRecords is correct. But why would the scroller bar only be long enough for 10 items, and why are more not requested when i scroll down on the client side?
I would sincerely appreciate any help/suggestions!
This discussion has been closed.
Replies
Allan
Sorry about that. I've included a full test case that replicates this behavior here using ASP.NET:
https://github.com/gnychis/ScrollerIssue
The client-side code is in my View here: https://github.com/gnychis/ScrollerIssue/blob/master/ScrollerIssue/Views/Home/Index.cshtml#L41
The server-side code is in my Controller here: https://github.com/gnychis/ScrollerIssue/blob/master/ScrollerIssue/Controllers/HomeController.cs#L27
I hope that this is helpful.
Allan
I was able to publish the example here:
http://scrollerissue.azurewebsites.net/
I hope that this is helpful. Sorry for it being in ASP.NET. If you find it extremely difficult to help me resolve the issue in ASP.NET, I can try to put it in another language. However, I've been trying to keep it in the language that I observe the issue in. Thanks for your help!
http://scrollerissue.azurewebsites.net/Home/UnitListHandler
You could try to query it with your client side to see if there is something wrong with the response it gives.
I think I see the problem - the Scroller Javascript isn't being included on your page. The Scroller CSS is, but you need the Javascript as well.
Allan
One last issue/suggestion. When using the bootstrap table look, it puts a small spacing in between the rows (5px). The way that "Loading..." for scroller works is that it just seems to always be shown, and then when the table rows come it is naturally hidden behind them due to its z-index. With spacing between the rows, however, you can still see it:
http://imgur.com/XcQ2pMG
I'll investigate a clean solution to this via the Javascript such as hiding/showing the div.
That assumption was obviously wrong! I'll need to look at adding that ability into a future release.
Allan