Forums

Board index » YUI 2.x: » DataTable and DataSource

Page 1 of 2   [ 13 posts ] Go to page 1, 2 Next
New Topic | Post Reply | Print view

Mahesh Srinivasan

  • Username: maheshs4677
  • Joined: Mon Jul 13, 2009 4:14 am
  • Posts: 9
  • Offline
  • Profile
Tags:

DataTable Column width

Post Posted: Mon Jul 13, 2009 6:44 am
+0-
Hi,

Recently I have started using the YUI. I am slowly working my way thro the examples provided and the API documentation. I got the DataTable working OK with a Data Source. However, I cant seem to initialise the column width. I am providing the code I have below. Can anyone tell me where I am going wrong?
Code:
function DispayDataTable ( sURL, sDiv )
{
   
   var myColumnDefs = [
               {key:"C1",resizeable:true,width:"50em"},
               {key:"C2",resizeable:true,width:"50em"},
               {key:"C3",resizeable:true,width:"50em"},
               {key:"C4",resizeable:true,width:"200em"},
               {key:"C5",resizeable:true,width:"50em"},
               {key:"C6",resizeable:true,width:"200em"}
   
        ];
   
    var myDataSource = new YAHOO.util.DataSource(sURL);
   
    myDataSource.responseType = YAHOO.util.DataSource.TYPE_TEXT;
   
   myDataSource.responseSchema = {
      recordDelim: "\n",
      fieldDelim: "|",
      fields: [
             "C1",
             "C2",
             "C3",
             "C4",
             "C5",
             "C6"]
    };
   
    var myDataTable = new YAHOO.widget.DataTable ( sDiv, myColumnDefs,
               myDataSource, {caption:"Data Table Test"});
    myDataTable.render;   
   
}


I just tried with 50em and 50px but nothing seems to work. Any help much appreciated!

Satyam

YUI Contributor

  • Username: Satyam
  • Joined: Tue Dec 09, 2008 12:34 am
  • Posts: 2016
  • Location: Sitges, Spain
  • GitHub: Satyam
  • Gists: Satyam
  • IRC: DevaSatyam
  • YUI Developer
  • Offline
  • Profile

Re: DataTable Column width

Post Posted: Mon Jul 13, 2009 7:06 am
+0-
Widths have to be in pixels or plain integers which will be assumed to be pixels.

Mahesh Srinivasan

  • Username: maheshs4677
  • Joined: Mon Jul 13, 2009 4:14 am
  • Posts: 9
  • Offline
  • Profile

Re: DataTable Column width

Post Posted: Mon Jul 13, 2009 7:10 am
+0-
Thanks for your reply. I changed it to normal integers and it still automatically sets the width!! Any other thing I can try?

Satyam

YUI Contributor

  • Username: Satyam
  • Joined: Tue Dec 09, 2008 12:34 am
  • Posts: 2016
  • Location: Sitges, Spain
  • GitHub: Satyam
  • Gists: Satyam
  • IRC: DevaSatyam
  • YUI Developer
  • Offline
  • Profile

Re: DataTable Column width

Post Posted: Mon Jul 13, 2009 9:43 am
+0-
What can I say? The API docs say:

http://developer.yahoo.com/yui/docs/YAH ... erty_width

Jenny Donnelly

YUI Developer

  • Username: jenny
  • Joined: Tue Dec 09, 2008 5:00 pm
  • Posts: 58
  • GitHub: jenny
  • Gists: jenny
  • YUI Developer
  • Offline
  • Profile
Tags:

Re: DataTable Column width

Post Posted: Mon Jul 13, 2009 9:51 am
+0-
Just to clarify, it should be

width:50

not

width:"50"

Mahesh Srinivasan

  • Username: maheshs4677
  • Joined: Mon Jul 13, 2009 4:14 am
  • Posts: 9
  • Offline
  • Profile

Re: DataTable Column width

Post Posted: Tue Jul 14, 2009 1:34 am
+0-
Doh!! Thanks very much. Works now :)

Timbo White

  • Username: twhite_asm
  • Joined: Wed Jul 22, 2009 11:33 am
  • Posts: 2
  • Offline
  • Profile
Tags:

Re: DataTable Column width

Post Posted: Wed Jul 22, 2009 11:43 am
+0-
Specified column widths for a YUI DataTable that has the table's CSS property "width: 100%" fails. These specified columns remain auto-sized (the th and td tag widths are not set).

Does anyone know of a way to make a DataTable's width expand to 100%, specify the column width for certain columns, and allow other columns' width to be auto-sized?

Timbo White

  • Username: twhite_asm
  • Joined: Wed Jul 22, 2009 11:33 am
  • Posts: 2
  • Offline
  • Profile
Tags:

Re: DataTable Column width

Post Posted: Wed Jul 22, 2009 1:31 pm
+1-
After scouring the web, it appears that the question in my previous post has been a long sought after by lot's of folks. Not even the YUI dev's have been able to offer an answer.

It's a good thing I showed up to save the day. :mrgreen:

To get a table stretched to 100% of it's container div, while still maintaining specified column widths, do this:

1. Set the CSS property "width: 100%" for either the DataTable's table tag, or the div that contains the DataTable.
2. Set the "width" DataTable column property to the number of pixels you want specifically per column.
3. Set the "minWidth" DataTable column property to a ridiculously enormous number per columns you want auto-sized.

Example:

Code:
var myColumnDefs = [
    {key:"foo", width: 20},
    {key:"bar", minWidth: 999999 },
];
new YAHOO.widget.DataTable("someContainer", myColumnDefs, myDataSource);


Tested using YUI 2.7.0 with FF3 and IE7.

cakhairia

  • Joined: Fri Apr 09, 2010 4:49 am
  • Posts: 2
  • Offline
  • Profile
Tags:

Re: DataTable Column width

Post Posted: Fri Apr 09, 2010 4:51 am
+0-
Unfortunately this does not work at Chrome 4.1 :( any known work around?

cakhairia

  • Joined: Fri Apr 09, 2010 4:49 am
  • Posts: 2
  • Offline
  • Profile

Re: DataTable Column width

Post Posted: Fri Apr 09, 2010 4:56 am
+0-
Correction: it works perfectly with Chrome too! Awesome! :)
Page 1 of 2   [ 13 posts ] Go to page 1, 2 Next
New Topic | Post Reply | Print view
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum

Recent Forums Posts

Recent YUI Blog Posts

Online Users

© 2006-2013 Yahoo! Inc. All rights reserved.
All code on this site is licensed under the BSD License unless stated otherwise.
About This Site · Security Contact Info

Powered by phpBB® Forum Software © phpBB Group