CODEWITHSUNDEEP
htmlcss
Ajay
Ajay

Reputation: 7428

Should I use <table> or <ul>?

I have to render dynamic data using javascript which should be displayed as n rows, m columns. I have heard of ill-effects of using tables but cannot justify on my own as to why I should/should-not use tables. Can you reason the best practice in choosing the alternative for the requirement. I at all <ul> is the alternative, how do I manage to make it look like a table?

If I use tables, I cannot animate table rows. Keeping this consideration, please suggest the alternative.

Upvotes: 5

Views: 12813

Answers (6)

ntan
ntan

Reputation: 2205

Tables are the right choice for the situation.

If you use jQuery, you can animate an li or a tr or anything else.

Here's an example of deleting a row with jQuery:

close_timeout = setTimeout(function() { 
    $("tr#row_"+id).css("background","red");
    $("tr#row_"+id).animate({ opacity: 'hide' }, "slow");           
}, 600);
$("tr#row_"+id).remove();

This changes the background to red, hides the tr, and then removes it from the DOM.

I hope this helps.

Upvotes: 0

tahdhaze09
tahdhaze09

Reputation: 2213

It's data. Use tables.

Try this jQuery plugin for formatting your table:

http://tablesorter.com/docs/

Upvotes: 0

Asaph
Asaph

Reputation: 162791

You should not use tables for layout. It's perfectly reasonable to use tables for tabular data. If you have "n rows" and "m columns", that sounds an awful lot like tabular data and it would be appropriate to use a <table>.

As far as "animating" table rows, if by that you mean dynamically adding and removing rows from a table using javascript, that is supported. See the DOM Reference for table methods. It supports operations such as insertRow() and deleteRow().

Upvotes: 11

Sarfraz
Sarfraz

Reputation: 382696

Tables are sementically used for the tabular data, it is bad when you use them for layout purposes. In your case, you can use the tables since you want to show some data and i wonder how you can not animate table rows? Thanks

See W3C's: Tables in HTML Documents

Upvotes: 4

GeekTantra
GeekTantra

Reputation: 12081

This is a very common dilemma in the Web developers head. Actually using table sometimes make it easy to create web pages but makes it really difficult when you try to modify them or edit them. Tables should only be used to create tabular data like data-grids or representing lists in a tabular layout. Using the right markup for the right layout makes a lot of semantic sense for the webpage and makes it much more readable. You can check the following links to learn more about the significance of Semantic HTML.

http://www.communitymx.com/content/article.cfm?cid=0BEA6 http://www.thefutureoftheweb.com/blog/writing-semantic-html

Upvotes: 2

pavium
pavium

Reputation: 15118

The first sentence of your question describes a table so you should render it as a table.

Is animating the rows really necessary?

Upvotes: 1

Related Questions