|
Here is the "production" version of my project:
http://www.clmitchell.net/dotnet1/HistCosmos.php
And here is the Backbase prototype I'm attempting to build of the same project:
http://www.clmitchell.net/hcbb/
Following is the code for the listGrid and pager. I adapted an example that uses a JSON / PHP / MySQL datasource. I tested eventjson.php, which presents the query results in JSON format, and it works.
Likewise the listGrid took the first page of data with no worries. However, while the page numbers on the pager control seem to function, the content of the listGrid doesn't change. I'm sure this is the result of neglect on my part...I would be grateful if someone could point me in the right direction (grin).
<b:dataSource name="recAll" url="eventjson.php" type="array" dataRoot="historycosmos">
<b:dataSchema>
<b:dataField name="yBible" key="Date_Bible"></b:dataField>
<b:dataField name="yGreg" key="Date_Gregorian"></b:dataField>
<b:dataField name="eType" key="Event_Type"></b:dataField>
<b:dataField name="eLoc" key="Event_NLL"></b:dataField>
<b:dataField name="eDesc" key="Event_Desc"></b:dataField>
<b:dataField name="eSrc" key="Event_Link"></b:dataField>
</b:dataSchema>
</b:dataSource>
<b:listGrid dataSource="recAll" readonly="true" id="HCbrowse" rows="16" width="98%" height="400px" left="10px" top="0px" rowClasses="rowClass1, rowClass2">
<b:listGridCol width="9.5%" query="yBible" label="Year-Bible" />
<b:listGridCol width="12.7%" query="yGreg" label="Year-Gregorian" />
<b:listGridCol width="10.6%" query="eType" label="Event Type" />
<b:listGridCol width="10.6%" query="eLoc" label="Location" />
<b:listGridCol width="50.5%" query="eDesc" label="Event Description" datatype="text" />
<b:listGridCol width="5.8%" query="eSrc" label="Link" />
</b:listGrid>
<b:pagerBar width="98%" left="10px" position="absolute">
<b:pager for="id('HCbrowse')" width="350px">
<b:pagerButton type="First" />
<b:pagerButton type="Previous" />
<b:pagerSeparator />
<b:pagerJumper />
<b:pagerSeparator />
<b:pagerButton type="Next" />
<b:pagerButton type="Last" />
</b:pager>
</b:pagerBar>
Quasaur
Web Developer
http://www.clmitchell.net/
Hi, If remote dataSource is
16 October, 2007 - 13:19 — gaoHi,
If remote dataSource is used in listGrid, the pager sends a request with page number as one parameter. Then listGrid gets data from the server response to display.
So to solve your problem, you can either:
Implement the pager function on server
or
Use xi:include to load remote data to a local variable, and use the default client side pager function of b:pager
Re: Hi, if remove dataSource is
16 October, 2007 - 21:24 — Quasaurgao: Thanks for responding...
I like the second option: "Use xi:include to load remote data to a local variable, and use the default client side pager function of b:pager"
Didn't I use the second option? isn't dataSource "recAll" the local variable?
Quasaur
Web Developer
http://www.clmitchell.net/
Hi,
17 October, 2007 - 11:13 — gaoHi,
By "local variable", I meant to define explicitly a b:variable which can then be attached to a b:dataSource. So that the listGrid will behave like it's using local data. Try the following snippet, if you don't know how to do it yet.
<e:data type="text/xml">
<xi:include href="listGridData.xml" />
</e:data>
</e:variable>
<b:dataSource name="myData" select="$varData" type="xml" />
PS: listGrid will be improved in the coming Backbase 4.1
Re: listGrid / pager Mystery
21 October, 2007 - 01:31 — QuasaurTo gao:
I certainly appreciate the info...but i'm using JSON-formatted data. How would I use the e:variable for that kind of data? (Note: I'm sorry to be such a bother, but I cant find this stuff in your documentation or examples.)
Quasaur
Web Developer
http://www.clmitchell.net/
Hi, Currently, JSON data is
22 October, 2007 - 11:28 — gaoHi,
Currently, JSON data is not very well supported. However, to solve your problem (which I interpreted as "load remotely, handle locally"), the code below might help. What it does is to load a piece of JSON data and store it in a global variable, then create dataSource and listGrid after the data loading completes. Put this code in Backbase script tag.
<div id="jsonListGridContainer">
<e:handler event="dataLoaded" type="application/xml">
<c:create destination="." mode="lastChild">
<b:dataSource name="jsonSource" select="$jsonData" type="array" dataRoot="dvd">
<b:dataSchema>
<b:dataField name="film" key="title"></b:dataField>
</b:dataSchema>
</b:dataSource>
<b:listGrid dataSource="jsonSource" readonly="true" width="100%" height="100%" rowClasses="rowClass1, rowClass2">
<b:listGridCol query="film" label="Title" readonly="true"></b:listGridCol>
<b:listGridCol query="director" label="Director"></b:listGridCol>
<b:listGridCol query="genre" label="Genre"></b:listGridCol>
</b:listGrid>
</c:create>
</e:handler>
</div>
<e:handler event="DOMNodeInsertedIntoDocument" type="application/javascript">
bb.command.load('listGridData.js', 'GET', '', '', '', '', function(oRequest){
jsonData = eval(" (" + oRequest.responseText + ") ");
var oDiv = bb.getElementById('jsonListGridContainer');
var oEvent = call(bb.document).createEvent("Events");
oEvent.initEvent("dataLoaded", false, false);
call(oDiv).dispatchEvent(oEvent);
}, '', '');
</e:handler>
where the listGridData.js is
"dvd": [
{
"title":"The Seven Samurai",
"director":"Akira Kurosawa",
"genre":"Drama",
"language":"Japanese",
"premiere":"1954-01-12",
"rating":"88",
"price":"42.99"
},
{
"title":"City of God",
"director":"Fernando Meirelles",
"genre":"Drama",
"language":"Portuguese",
"premiere":"2002-02-03",
"rating":"88",
"price":"19.99"
},
{
"title":"The Godfather",
"director":"Francis Ford Coppola",
"genre":"Crime",
"language":"English",
"premiere":"1972-09-17",
"rating":"91",
"price":"9.88"
}
],
"cd": [
{
"title":"90125",
"artist":"Yes",
"genre":"Rock",
"rating":"75",
"price":"7.95"
},
{
"title":"China",
"artist":"Vangelis",
"genre":"Electronic Instrumental",
"rating":"56",
"price":"12.50"
},
{
"title":"Horizon",
"artist":"Carpenters",
"genre":"Easy Listening",
"rating":"67",
"price":"8.00"
}
]
}
PS, again, data binding in Backbase 4.1 (release this week) will be easier to use.
Re: Hi, Currently, JSON data is
23 October, 2007 - 10:55 — Quasaurgao:
Thank you for the code; i'm going to study it and see if i can adapt it to my project. I'm looking forward to the upgrade/databinding.
Quasaur
Web Developer
http://www.clmitchell.net/