when i try to do like this its throwing js error on fire bug like this:
"this._el is null[Break on this error] } else if (Lang.trim(this._el.innerHTML)) { "

i belive this is because i am rendering the tree before the "treeDiv1-" element is drawn or instantiated..

can any one give me an idea how to overcoming this..

Thanks!

MingoMax

Maybe, you would try to render the treevview after elCell html modify, because when you try to render something and this no exist(the element where to render

Message 2 of 7
, Nov 26, 2009

0 Attachment

Maybe, you would try to render the treevview after elCell html modify, because when you try to render something and this no exist(the element where to render the widget) the render() method return a error or nothing happens.

Mingo

De: nagaraj <manne_swiss@...>Para: ydn-javascript@yahoogroups.comEnviadas: Quinta-feira, 26 de Novembro de 2009 10:37:57Assunto: [ydn-javascript] Can we render a tree view with in datatable formatter?

Hi All,

I have a requirement in such a way that in need to show a simple treeview structure in datatable cell.
so for this i am trying to display it with in a formatter like this :

but still the same problem... :( correct me if i am doing any thing wrong over here..
i am rendering in tree view in formatter only because i need to customize the tree nodes based on the data i get for that particular record.

Thanks!

--- In ydn-javascript@yahoogroups.com, MingoMax <loucnet@...> wrote:
>
> Maybe, you would try to render the treevview after elCell html modify, because when you try to render something and this no exist(the element where to render the widget) the render() method return a error or nothing happens.
>
> Mingo
>
>
>
>
>
> ________________________________
> De: nagaraj <manne_swiss@...>
> Para: ydn-javascript@yahoogroups.com
> Enviadas: Quinta-feira, 26 de Novembro de 2009 10:37:57
> Assunto: [ydn-javascript] Can we render a tree view with in datatable formatter?
>
>
> Hi All,
>
> I have a requirement in such a way that in need to show a simple treeview structure in datatable cell.
> so for this i am trying to display it with in a formatter like this :
>
> YAHOO.widget. DataTable. formattName= function( elCell, oRecord, oColumn, oData) {
> var rowid=this.getTrInd ex(oRecord) ;
> tree = new YAHOO.widget. TreeView( "treeDiv1- "+rowid);
> tree.render( );
> elCell.innerHTML= "<span id='treeDiv1- "+rowid+" '><ul><li> Nag<ul> <li>Test</li> </ul></li> </ul></span> ";
> }
>
> when i try to do like this its throwing js error on fire bug like this:
> "this._el is null[Break on this error] } else if (Lang.trim(this. _el.innerHTML) ) { "
>
> i belive this is because i am rendering the tree before the "treeDiv1-" element is drawn or instantiated. .
>
> can any one give me an idea how to overcoming this..
>
> Thanks!
>
>
>
>
>
> ____________________________________________________________________________________
> Veja quais sÃ£o os assuntos do momento no Yahoo! +Buscados
> http://br.maisbuscados.yahoo.com
>

Satyam

You are giving the tree the id of an element that doesn t yet exist so it can contain it, nor can the tree parse what you haven t placed in that element yet.

Message 4 of 7
, Nov 26, 2009

0 Attachment

You are giving the tree the id of an element that doesn't yet exist so
it can contain it, nor can the tree parse what you haven't placed in
that element yet. First you have to fill the cell, then you may refer
to its contents.

Satyam

nagaraj escribió:

> Hi All,
>
> I have a requirement in such a way that in need to show a simple treeview structure in datatable cell.
> so for this i am trying to display it with in a formatter like this :
>
> YAHOO.widget.DataTable.formattName=function(elCell, oRecord, oColumn, oData) {
> var rowid=this.getTrIndex(oRecord);
> tree = new YAHOO.widget.TreeView("treeDiv1-"+rowid);
> tree.render();
> elCell.innerHTML="<span id='treeDiv1-"+rowid+"'><ul><li>Nag<ul> <li>Test</li></ul></li></ul></span>";
> }
>
>
> when i try to do like this its throwing js error on fire bug like this:
> "this._el is null[Break on this error] } else if (Lang.trim(this._el.innerHTML)) { "
>
>
> i belive this is because i am rendering the tree before the "treeDiv1-" element is drawn or instantiated..
>
> can any one give me an idea how to overcoming this..
>
> Thanks!
>
>
>
> ------------------------------------
>
> Yahoo! Groups Links
>
>
>
> ------------------------------------------------------------------------
>
>
> No virus found in this incoming message.
> Checked by AVG - www.avg.com
> Version: 9.0.709 / Virus Database: 270.14.83/2526 - Release Date: 11/25/09 20:43:00
>
>

nagaraj

Thanks Satyam! it worked! ..but i ran into another problem :( which is related to the Distortion of treeview (can find the screeshot(Distortion.JPG)

Thanks Satyam! it worked! ..but i ran into another problem :( which is related to the Distortion of treeview (can find the screeshot(Distortion.JPG) as attachment)..

1.The div in which i am displaying tree is getting displayed with borders.

2.For the datatable i am using "rowClickEvent" to highlight the row where the user knows on which row he is currently in..in this case the tree nodes appears blank(seems white color is overwriting the nodes) we can see this for "S.No" 1 from the Distortion.JPG attachment..

You are giving the tree the id of an element that doesn't yet exist so
it can contain it, nor can the tree parse what you haven't placed in
that element yet. First you have to fill the cell, then you may refer
to its contents.

The tree is made out of tables with a varying number of cells to provide the indentation. Somehow, some border-style from the enclosing DataTable is spilling

Message 6 of 7
, Nov 27, 2009

0 Attachment

The tree is made out of tables with a varying number of cells to provide
the indentation. Somehow, some border-style from the enclosing
DataTable is spilling into the HTML tables that make the treeview so you
are getting borders inherited from the DataTable. You will have to
research that one with a real-life example and see what is spilling and
how to override it. This article will help you:

If you pay attention to the examples in the YUI site, you might be able
to notice that the labels contrast against the background, which is not
exactly white, though so light that you barely notice. The comment
says it all, some of the versions of IE still in the support list have
problems with the edges of the characters on the screen.

The tree is made out of tables with a varying number of cells to provide
the indentation. Somehow, some border-style from the enclosing
DataTable is spilling into the HTML tables that make the treeview so you
are getting borders inherited from the DataTable. You will have to
research that one with a real-life example and see what is spilling and
how to override it. This article will help you:

If you pay attention to the examples in the YUI site, you might be able
to notice that the labels contrast against the background, which is not
exactly white, though so light that you barely notice. The comment
says it all, some of the versions of IE still in the support list have
problems with the edges of the characters on the screen.