Loading ...
Sorry, an error occurred while loading the content.

Re: [ydn-javascript] Can we render a tree view with in datatable formatter?

Expand Messages
  • 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)
    Message 1 of 7 , Nov 26, 2009
    • 1 Attachment
    • 46 KB
    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..

    what are the possibilities for this sort of distortions.

    Thanks!

    --- On Thu, 26/11/09, Satyam <satyam@...> wrote:

    From: Satyam <satyam@...>
    Subject: Re: [ydn-javascript] Can we render a tree view with in datatable formatter?
    To: ydn-javascript@yahoogroups.com
    Date: Thursday, 26 November, 2009, 9:50 PM

     

    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.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!
    >
    >
    >
    > ------------ --------- --------- ------
    >
    > 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
    >
    >



    The INTERNET now has a personality. YOURS! See your Yahoo! Homepage.
  • Satyam
    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 2 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:

      http://www.satyam.com.ar/yui/widgetstyles.html


      Regarding the white background, is due to this style:

      .ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover {
      background-color: white; /* workaround for IE font smoothing bug */
      }

      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.

      Satyam

      nagaraj escribió:
      > [Attachment(s) <#TopText> from nagaraj included below]
      >
      > 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..
      >
      > what are the possibilities for this sort of distortions.
      >
      > Thanks!
      >
      > --- On *Thu, 26/11/09, Satyam /<satyam@...>/* wrote:
      >
      >
      > From: Satyam <satyam@...>
      > Subject: Re: [ydn-javascript] Can we render a tree view with in
      > datatable formatter?
      > To: ydn-javascript@yahoogroups.com
      > Date: Thursday, 26 November, 2009, 9:50 PM
      >
      >
      >
      > 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.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!
      > >
      > >
      > >
      > > ------------ --------- --------- ------
      > >
      > > 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
      > >
      > >
      >
      >
      > ------------------------------------------------------------------------
      > The INTERNET now has a personality. YOURS! See your Yahoo! Homepage
      > <http://in.rd.yahoo.com/tagline_yyi_1/*http://in.yahoo.com/>.
      >
      > Attachment(s) from nagaraj
      >
      > 1 of 1 Photo(s)
      >
      > Distortion.JPG
      > <http://groups.yahoo.com/group/ydn-javascript/attachments/folder/1429887582/item/1411404064/view>
      > Distortion.JPG
      > <http://groups.yahoo.com/group/ydn-javascript/attachments/folder/1429887582/item/1411404064/view>
      >
      >
      > ------------------------------------------------------------------------
      >
      >
      > No virus found in this incoming message.
      > Checked by AVG - www.avg.com
      > Version: 9.0.709 / Virus Database: 270.14.83/2528 - Release Date: 11/26/09 10:10:00
      >
      >
    • nagaraj
      Thanks a lot Satyam!! it worked...the link you have given worked thanks a lot..Sorry for the late reply..          /      Nagaraj ... From: Satyam
      Message 3 of 7 , Dec 7, 2009
      • 0 Attachment
        Thanks a lot Satyam!! it worked...the link you have given worked thanks a lot..Sorry for the late reply..

         
               / 
            Nagaraj



        --- On Fri, 27/11/09, Satyam <satyam@...> wrote:

        From: Satyam <satyam@...>
        Subject: Re: [ydn-javascript] Can we render a tree view with in datatable formatter?
        To: ydn-javascript@yahoogroups.com
        Date: Friday, 27 November, 2009, 3:05 PM

         

        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:

        http://www.satyam. com.ar/yui/ widgetstyles. html

        Regarding the white background, is due to this style:

        .ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover {
        background-color: white; /* workaround for IE font smoothing bug */
        }

        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.

        Satyam

        nagaraj escribió:
        > [Attachment( s) <#TopText> from nagaraj included below]
        >
        > Thanks Satyam!
        > it worked! ..but i ran into another problem :( which is related
        > to the Distortion of treeview (can find the screeshot(Distortio n.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..
        >
        > what are the possibilities for this sort of distortions.
        >
        > Thanks!
        >
        > --- On *Thu, 26/11/09, Satyam /<satyam@satyam. com.ar>/* wrote:
        >
        >
        > From: Satyam <satyam@satyam. com.ar>
        > Subject: Re: [ydn-javascript] Can we render a tree view with in
        > datatable formatter?
        > To: ydn-javascript@ yahoogroups. com
        > Date: Thursday, 26 November, 2009, 9:50 PM
        >
        >
        >
        > 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.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!
        > >
        > >
        > >
        > > ------------ --------- --------- ------
        > >
        > > 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
        > >
        > >
        >
        >
        > ------------ --------- --------- --------- --------- --------- -
        > The INTERNET now has a personality. YOURS! See your Yahoo! Homepage
        > <http://in.rd. yahoo.com/ tagline_yyi_ 1/*http:/ /in.yahoo. com/>.
        >
        > Attachment(s) from nagaraj
        >
        > 1 of 1 Photo(s)
        >
        > Distortion.JPG
        > <http://groups. yahoo.com/ group/ydn- javascript/ attachments/ folder/142988758 2/item/141140406 4/view>
        > Distortion.JPG
        > <http://groups. yahoo.com/ group/ydn- javascript/ attachments/ folder/142988758 2/item/141140406 4/view>
        >
        >
        > ------------ --------- --------- --------- --------- --------- -
        >
        >
        > No virus found in this incoming message.
        > Checked by AVG - www.avg.com
        > Version: 9.0.709 / Virus Database: 270.14.83/2528 - Release Date: 11/26/09 10:10:00
        >
        >



        The INTERNET now has a personality. YOURS! See your Yahoo! Homepage.
      Your message has been successfully submitted and would be delivered to recipients shortly.