Customizing the Grid

[antun]

You can customize the columns and appearance of the Grid by specifying <gridcolumns>. Declare a <gridcolumn> tag for each column you wish to show. Within the tag, you can specify what will appear in each row of that column. This gives you finer control over what is displayed: e.g. based on the data for that row, you could have an image load into the row, pre-select the default value of a component, or colorize a view, instead of just displaying the text:


<canvas width="800" height="700">

<!-- Weather Data -->
<dataset name="weatherdata" request="true"
src="http://www.laszlosystems.com/cgi-pub/weather.cgi?zip=10022"/>

<!-- The datagrid -->
<grid datapath="weatherdata:/weather/forecast"
contentdatapath="day" rowheight="58">

<!-- First column -->
<gridcolumn width="120">Day
<text datapath="@label" />
</gridcolumn>

<!-- Second column -->
<gridcolumn width="44" sortable="false"
resizable="false">Icon
<view datapath="@imageurl" height="44"
stretches="both">
<method event="ondata" args="d">
this.setSource( d );
</method>
</view>
</gridcolumn>

<!-- Third column -->
<gridcolumn width="120">Forecast
<text datapath="@desc" fontstyle="italic" />
</gridcolumn>

</grid>

</canvas>


You can also control whether columns are editable, resizeable and so forth.

Enjoy!

[oleane]

I am sorry but icons don't appear into grid !

My debugger show me this error :

bad url: can't form uri from null
«string#0| java.text.ParseException: Unparseable date: "Thu, 19 Feb 2004 21:25:23 GMT" : Exception stack: com.laszlosystems.utils.ChainedException: java.text.ParseException: Unparseable date: "Thu, 19 Feb 2004 21:25:23 GMT" at com.laszlosystems.utils.LZHttpUtils.getDate(LZHttp Utils.java:128) at com.laszlosystems.data.internal.HTTPDataSource$Htt pData.lastModified(HTTPDataSource.java:520) at com.laszlosystems.cache.RequestCache.getItemStream AsSWF(RequestCache.java:332) at com.laszlosystems.cache.RequestCache.getAsSWF(Requ estCache.java:140) at com.laszlosystems.servlets.responders.ResponderCac he.respondImpl(ResponderCache.java:327) at com.laszlosystems.servlets.responders.Responder.re spond(Responder.java:207) at com.laszlosystems.servlets.LZServlet._doGet(LZServ let.java:287) at com.laszlosystems.servlets.LZServlet.doGet(LZServl et.java:223) at javax.servlet.http.HttpServlet.service(HttpServlet .java:740) at javax.servlet.http.HttpServlet.service(HttpServlet .java:853) at org.apache.catalina.core.Appli...»

see the source used :
<canvas debug="true" width="1024">

<simplelayout axis="y" spacing="10" />


<dataset name="weatherdata" request="true"
src="http://www.laszlosystems.com/cgi-pub/weather.cgi?zip=10022"/>



<!-- The datagrid -->
<grid datapath="weatherdata:/weather/forecast"
contentdatapath="day" rowheight="58">

<!-- First column -->
<gridcolumn width="120">Day
<text datapath="@label" />
</gridcolumn>

<!-- Second column -->
<gridcolumn width="44" sortable="false"
resizable="false">Icon
<view datapath="@imageurl" height="44"
stretches="both">
<method event="ondata" args="d">
this.setSource( d );
</method>
</view>
</gridcolumn>

<!-- Third column -->
<gridcolumn width="120">Forecast
<text datapath="@desc" fontstyle="italic" />
</gridcolumn>

</grid>

</canvas>

[antun]

Hmmm - I get the error in the debugger, but the icons do appear for me. The reason for the error is as follows:

The ondata event gets sent at the start when there is no data in the weatherdata dataset, because it's an HTTP dataset, and the response for the initial request has not been received yet. i.e. the first time round, the d variable in the ondata method is null.

Of course you can't set a view's source to null, so a quick fix would be:


<method event="ondata" args="d">
if (d == null) return;
this.setSource( d );
</method>


What version of the LPS are you using?

-Antun

[coszmin]

Hi ,

I will post a question here , as for the past 6 hours this thread is the only lead i could get with my problem .


I was trying to set the source of a view , at run time . So I was using this.setSource("some.jpg"); in the constructor .

My problem is that , everytime i try to do this I get the following error in the debuger :

«string#0| java.text.ParseException: Unparseable date "Mon : "

This makes no sense , as i'm not trying to work with dates , and the error seems to be a java error . But like I said , in the past 6 hours , I could only find this somewhat related article , and I couldn't miss on the oportunity to try and get some help .

Since then i tried , isolating the code to the simplest form possible . I tried running it on lps 2.2.1 , lps 2.2 , lps 2.2.1 in tomcat 5.0.24 , tomcat 5.0.28 ... All on my windows XP computer .

I also tried on other computers , and the same code worked , just not on mine . I then proceeded to reisntall the 1.4.2 JDK , tomcat and laszlo . Nothing fixed the problem , so this is my only left hope .


Thanks

P.S. related thread here : http://www.laszlosystems.com/developers/community/forums/showthread.php?s=&threadid=2195

[coszmin]

fixed the problem

Java + Laszlo + Romanian Timezones in XP are a dangerous threesome

[porsche_dave]

Is it possible to set the gridcolumn width from a dataset like this?

<gridcolumn datapath="myds:/nodes/field" text="$path{'fieldDesc/text()'}" width="$path{'fieldWidth/text()'}" />

myds XML:
<nodes>
<field>
<fieldDesc>First</fieldDesc>
<fieldWidth>30</fieldDesc>
</field>
</nodes>

Through all my extensive digging and testing I have found no way to do this.
David

[lwz7512]

Originally posted by porsche_dave
Is it possible to set the gridcolumn width from a dataset like this?

<gridcolumn datapath="myds:/nodes/field" text="$path{'fieldDesc/text()'}" width="$path{'fieldWidth/text()'}" />

myds XML:
<nodes>
<field>
<fieldDesc>First</fieldDesc>
<fieldWidth>30</fieldDesc>
</field>
</nodes>

Through all my extensive digging and testing I have found no way to do this.
David


just as the doc said:
by default it will present an editable field either for each attribute in the first data node in the grid.

the default data presentation use "lazy replication", it can only read the attribute value of each row, and display them row by row, the default xml schema grid can read is:

<table>
<row name="lwz" sex="male" age="25">
<row name="lwz" sex="male" age="25">
<row name="lwz" sex="male" age="25">
</table>

still trying to change this....

[lwz7512]

Originally posted by porsche_dave
Is it possible to set the gridcolumn width from a dataset like this?

<gridcolumn datapath="myds:/nodes/field" text="$path{'fieldDesc/text()'}" width="$path{'fieldWidth/text()'}" />

myds XML:
<nodes>
<field>
<fieldDesc>First</fieldDesc>
<fieldWidth>30</fieldDesc>
</field>
</nodes>

Through all my extensive digging and testing I have found no way to do this.
David

first,need to use a datapointer to convert the xml to row-based structure for grid to digest

then, use setPionter to reference the newly created lzDataElement to grid as datapath, so the grid can recognize the structure and display rightly!

if need more help , ask me directly!

[bpinheiromg]

I'm trying to create a customized grid in a library.
I have created it using a class that extends the grid.
Its working ok and I don’t need to set the columns because it gets the names from the xml.

The grid created its supposed to be a pattern on my projects and i want, every time some one use it, the gridtext can’t be editable.

How can i set the gridtext property in my grid class library?

<library>
<bluestyle name="bluecolors"/>
<class name="mygrid"
extends="grid"
showvlines="true"
bgcolor0="$once{bluecolors.basecolor}"
sizetoheader="false"
style="greencolors">
</class>
</library>


On the main lzx i use:

<mygrid datapath="dsetEqpto:/equipset" contentdatapath="equip"/>

[antun]

Hi

You should be able to nest the <gridtext> instances in the <class tag:


<class name="mygrid"
extends="grid" showvlines="true"
bgcolor0="$once{bluecolors.basecolor}"
sizetoheader="false"
style="greencolors">
<gridtext editable="false" datapath="@id"
datatype="number">ID
</gridtext>
</class>


Take care,

Antun

Originally posted by bpinheiromg
How can i set the gridtext property in my grid class library?

[bpinheiromg]

tks Antun,

That will do, but is there a way to set the gridtext not editable without specify the datapath, datatype and the column title?
If i just use the attributes from the xml i can determine the number and title of columns in my Java program while I’m generating the XML.

[pathogen]

Could I also please see an example of using the incubator tooltips with a grid? I can't seem to get it to work.

[pab]

Is it possible to customize the rows?
I need something like:

Product------------------Price------Stock

-Intel
|-Pentium IV
||-Pentium IV 3.0Ghz-----$190---------40
|-Xeon
||-Xeon 3.2Ghz-----------$350---------18
||-Xeon 3.6Ghz-----------$700---------10
-AMD
|-Athlon 64
||-Athlon 64 3700+-------$400---------32
||-Athlon 64 X2 3800+----$600---------19
|-Opteron
||-Opteron Model 270-----$800----------7


I mean, the rows are tree leaves, and the other nodes group them.

[ebrentnelson]

Is there any way to keep the cool editablity (click a cell and it turns to an edittext) of the grid AND assign columns without having to write it manually?

Thanks.

ebn

===================
EDIT

Yes, I figured out you just use gridtext instead of grid column

===================

[ustado]

how can I change the text being displayed ... e.g if i wanted to add bump up the day of the dataset value?

<gridcolumn width="120">Day
<text datapath="@label" >
<method event="ondata" args="d">
this.setText( d+1 );
</method>

</text>
</gridcolumn>



You can customize the columns and appearance of the Grid by specifying <gridcolumns>. Declare a <gridcolumn> tag for each column you wish to show. Within the tag, you can specify what will appear in each row of that column. This gives you finer control over what is displayed: e.g. based on the data for that row, you could have an image load into the row, pre-select the default value of a component, or colorize a view, instead of just displaying the text:


<canvas width="800" height="700">

<!-- Weather Data -->
<dataset name="weatherdata" request="true"
src="http://www.laszlosystems.com/cgi-pub/weather.cgi?zip=10022"/>

<!-- The datagrid -->
<grid datapath="weatherdata:/weather/forecast"
contentdatapath="day" rowheight="58">

<!-- First column -->
<gridcolumn width="120">Day
<text datapath="@label" />
</gridcolumn>

<!-- Second column -->
<gridcolumn width="44" sortable="false"
resizable="false">Icon
<view datapath="@imageurl" height="44"
stretches="both">
<method event="ondata" args="d">
this.setSource( d );
</method>
</view>
</gridcolumn>

<!-- Third column -->
<gridcolumn width="120">Forecast
<text datapath="@desc" fontstyle="italic" />
</gridcolumn>

</grid>

</canvas>


You can also control whether columns are editable, resizeable and so forth.

Enjoy!

[ravindran]

hi,
can i set an entire row non editable depending upon the values from a dataset at the time of loading the grid.That in my grid i need some rows editable and some rows non editable

[ggallego]

how can I change the text being displayed ... e.g if i wanted to add bump up the day of the dataset value?

<gridcolumn width="120">Day
<text datapath="@label" >
<method event="ondata" args="d">
this.setText( d+1 );
</method>

</text>
</gridcolumn>
I am also having this problem: how to change the text being displayed?

Is there a way?

[senshi]

Try to use "applyData":


<gridcolumn width="120">Day
<text datapath="@label" >
<method name="applyData" args="d">
this.setText( d );
</method>
</text>
</gridcolumn>

[ggallego]

Try to use "applyData":


<gridcolumn width="120">Day
<text datapath="@label" >
<method name="applyData" args="d">
this.setText( d );
</method>
</text>
</gridcolumn>

thank you senshi!

and if it helps someone else, I've found an alternative way:

<gridcolumn width="120">Day
<text datapath="@label" >
<method name="ondata" args="d">
this.datapath.setNodeText(d);
this.datapath.updateData();
</method>
</text>
</gridcolumn>