Home/ Questions/Q 8291159
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T13:01:41+00:00

Allright, I have been able to make it work with DataGrid, but for some

  • 0

Allright, I have been able to make it work with DataGrid, but for some reason, Dgrid can be really impressing and at the same time, really frustrating (many people recommend it). So far, I have been able to request a certain amount of data (only first call, so my request header specifies to return 25 items…), once I try to scroll down to have more item (so additional request should be sent) nothing happens.

Basically that’s the store build with jsonrest:

define([
    "dojo/store/Memory",
    "dojo/store/JsonRest",
    "dojo/store/Cache",
    "dojo/store/Observable"
    ],
function(
    Memory,
    JsonRest,
    Cache,
    Observable
){

    var contentMemoryStore = new Memory();
    var contentJsonRestStore = new JsonRest({target: "http://dev.mpact.tv:30087/rest/contenus/"});

    contentStore = new Cache(contentJsonRestStore, contentMemoryStore);

    return new Observable(contentStore);
});

And then, I pass this store to the property of the OnDemandGrid.

I have checked this guy example: http://www.speich.net/articles/demos/jsonrest/dojo-demo-dgrid.php
I have checked the documentation for dgrid (OnDemandList): https://github.com/SitePen/dgrid/wiki/Core-Components

Added Request header / Response header (but I think they are correct):
enter image description here
enter image description here

Server side code (in perl):

$r->headers_out->set('Content-Range', sprintf("items %d-%d/%d", $start, $start 
+ $num_items - 1, $total));

Update:

I did a quick test with the old jsonstore (dojox/data):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Statut des canaux générés par Gipsy</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></meta>
        <style type="text/css">
            @import "/dojo/dojo/resources/dojo.css";
            @import "/dojo/dijit/themes/tundra/tundra.css";
            @import "/dojo/dojox/grid/resources/Grid.css";
            @import "/dojo/dojox/grid/resources/tundraGrid.css";
            //.grid {
            //    width: 70em;
            //    height: 40em;
            //}
            .Title { text-align: center }
            html, body { height: 100%; margin: 0px; font-size: 14px; }
        </style>
        <script type="text/javascript" src="/dojo/dojo/dojo.js"  djConfig="isDebug:false, parseOnLoad: false"></script>
        <script type="text/javascript">
            dojo.require("dijit.layout.BorderContainer");
            dojo.require("dijit.layout.ContentPane");
            dojo.require("dojox.grid.TreeGrid");
            dojo.require("dijit.tree.ForestStoreModel");
            dojo.require("dojox.data.JsonRestStore");
            dojo.require("dojo.parser");

            dojo.addOnLoad(function(){

                dojo.parser.parse();

                var layout = [
                    { name: "Dossier", field: "repertoire", width: "auto" },
                    { name: "Fichier", field: "fichier", width: "auto" },
                    { name: "Nom", field: "nom", width: "auto" },
                    { name: "Date", field: "date", width: "auto" }
                ];
                //var jsonStore = new dojo.data.ItemFileReadStore({ data: dataItems });
                //var jsonStore = new dojo.data.ItemFileReadStore({ url: "/cgi-bin/senscity/stingray.json", clearOnClose: true });
                var jsonStore = new dojox.data.JsonRestStore({idAttribute: 'id', target: 'http://dev.mpact.tv:30087/rest/contenus'});
                var treeModel = new dijit.tree.ForestStoreModel({
                    store: jsonStore,
                    query: { type: 'canal' },
                    rootId: 'canalRoot',
                    rootLabel: 'Banane',
                    childrenAttrs: ['children']
                });
                var grid = new dojox.grid.TreeGrid({
                    treeModel: treeModel,
                    structure: layout,
                    selectable: true,
                    defaultOpen: false
                }, 'programmatic_grid');
                grid.startup();
                dojo.connect(window, "onresize", grid, "resize");
            });
        </script>
    </head>
    <body class="tundra">
<!-- -->
        <h1 class="Title" style="margin-bottom: 0.5em;">Statut de la programmation</h1>
        <div dojoType="dijit.layout.BorderContainer" style="width: 100%; height: 100%;">
<!--
            <div dojoType="dijit.layout.ContentPane" region="top" style="height: 20pt; padding: 0px; border: 0px;">
            date de dernière mise à jour, décompte de prochaine mise à jour, bouton de mise à jour, case de désactivation de mise à jour automatique
            </div>
-->
            <div dojoType="dijit.layout.ContentPane" region="center">
<!-- -->
                <div id="programmatic_grid"></div>
<!-- -->
            </div>
<!-- -->
        </div>
    </body>
</html>

So, My guess it has to be the store or the grid.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I forgot to mention I was doing cross-domain request with my rest framework (maybe should of said it…).

    Found out after 2 days, that this was the cause of my problem (I still don’t know the reason or the source). When I migrated my code to the server everything was working properly. Did a simple little test on my php server to populate a onDemandeGrid and saw that it was working on my localhost!

    Plus, to bypass the cross-domain, I added this header on my server-side rest code (to continue developing on a cross-domain, until we have a decent dev environment): 

    Access-Control-Expose-Headers:Content-Range
    • 0