By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,825 Members | 1,026 Online
Bytes IT Community

Home Questions Articles Browse Topics Latest Top Members FAQ

home > topics > javascript / ajax / dhtml > questions > select lists -vs- tables
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,825 IT Pros & Developers. It's quick & easy.

Select Lists -vs- Tables

P: n/a
Hi,

Sorry if this is one of those issues that people feel passionate about and I
assure you I'm not trolling but rather seeking guidance on which way to go
with the web browser presentation of tabular result sets.

I'm a newbie and don't know any better, but I immediately opted for Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post of
Stephane's showed me this is not so)

These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font to
line up.
2) I have column headings and don't like having to fudge option[0] as a
header when thead and tfoot entries now look like they can be static outside
the scroll area (true?)
3) You can "select" table rows (true?)
4) Inserting and removing <tr>s is no harder than <optionsin a <select>
5) Have you seen what Microsoft has done with Tables lately? I don't know
how much is down to CSS or how much (<div TABNAM="name">) is IE specific but
it really looks good! Click down to expand tehh whole table or leave it how
it is and scroll through.

So any thoughts or advice on what direction drowsers are heading in with
regard to this issue?

Cheers Richard Maher
Mar 17 '07 #1
Share this Question
Share on Google+
10 Replies
P: n/a
"Richard Maher" <ma******@hotspamnotmail.comwrote in message
news:et**********@news-01.bur.connect.com.au...
Hi,

Sorry if this is one of those issues that people feel passionate about and
I
assure you I'm not trolling but rather seeking guidance on which way to go
with the web browser presentation of tabular result sets.

I'm a newbie and don't know any better, but I immediately opted for Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post
of
Stephane's showed me this is not so)

These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font to
line up.
[anip]

Consider this:

<html>
<head>
<title>selectab.htm</title>
<script type="text/javascript">
var opts = "\n<option value='0'>Row 0^^^^^^^^^^Heading";
opts += "\n<option value='0'>----------------------";
for (var i=1; i<10; i++) {
opts += "\n<option value='" + i + "'>Row " + i + "^^^^^^^^^^Details";
}
opts = opts.replace(/\^/g," ");
function pick(that) {
var valu = that.options[that.selectedIndex].value;
if (valu 0) alert(valu);
}
</script>
</head>
<body>
<form>
<select size="11" onclick="pick(this)"
style="font-family:Courier New">
<script type="text/javascript">
document.write(opts);
</script>
</select>
</form>
</body>
</html>
Mar 17 '07 #2
P: n/a
Hi,

"McKirahan" <Ne**@McKirahan.comwrote in message
news:Vt******************************@comcast.com. ..
Consider this:
OK, I've considered it. Is there something in there I'm meant to see apart
from you "having to use a non-proportional font to line up."?

Regards Richard Maher
"Richard Maher" <ma******@hotspamnotmail.comwrote in message
news:et**********@news-01.bur.connect.com.au...
Hi,

Sorry if this is one of those issues that people feel passionate about
and
I
assure you I'm not trolling but rather seeking guidance on which way to
go
with the web browser presentation of tabular result sets.

I'm a newbie and don't know any better, but I immediately opted for
Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post
of
Stephane's showed me this is not so)

These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font
to
line up.

[anip]

Consider this:

<html>
<head>
<title>selectab.htm</title>
<script type="text/javascript">
var opts = "\n<option value='0'>Row 0^^^^^^^^^^Heading";
opts += "\n<option value='0'>----------------------";
for (var i=1; i<10; i++) {
opts += "\n<option value='" + i + "'>Row " + i + "^^^^^^^^^^Details";
}
opts = opts.replace(/\^/g," ");
function pick(that) {
var valu = that.options[that.selectedIndex].value;
if (valu 0) alert(valu);
}
</script>
</head>
<body>
<form>
<select size="11" onclick="pick(this)"
style="font-family:Courier New">
<script type="text/javascript">
document.write(opts);
</script>
</select>
</form>
</body>
</html>


Mar 17 '07 #3
P: n/a
Richard Maher wrote:
Hi,

Sorry if this is one of those issues that people feel passionate about and I
assure you I'm not trolling but rather seeking guidance on which way to go
with the web browser presentation of tabular result sets.

I'm a newbie and don't know any better, but I immediately opted for Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post of
Stephane's showed me this is not so)

These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font to
line up.
2) I have column headings and don't like having to fudge option[0] as a
header when thead and tfoot entries now look like they can be static outside
the scroll area (true?)
3) You can "select" table rows (true?)
4) Inserting and removing <tr>s is no harder than <optionsin a <select>
5) Have you seen what Microsoft has done with Tables lately? I don't know
how much is down to CSS or how much (<div TABNAM="name">) is IE specific but
it really looks good! Click down to expand tehh whole table or leave it how
it is and scroll through.

So any thoughts or advice on what direction drowsers are heading in with
regard to this issue?
You might want to consider the full-on AJAX/RIA option like:

http://www.yui-ext.com/deploy/ext-1....um-search.html

The drop down which appears when you type (try entering "grid") is a fully configurable Grid with moveable, resizable columns. Lots of other example under the /examples directory there...

Download the library at http://www.yui-ext.com/deploy/ext-1.0-alpha3.zip

Help forum at http://www.yui-ext.com/forum/index.php

Have fun,

Animal
Mar 17 '07 #4
P: n/a
ASM
McKirahan a écrit :
>
Consider this:
or this :

<html>
<script type="text/javascript">
function myOptions() {
var S = document.forms[0][0], opts;
for(var i=1; i<10; i++) {
opts = new Option('Row '+i+' -----Details',i);
S.options[S.length] = opts;
}
}
function pick(that) {
var k = that.selectedIndex;
if (k 0)
alert(that.options[k].text +
' value = ' + that.options[k].value);
}
</script>
<form>
<select size="11" onclick="pick(this)"
style="font-family:Courier New">
<option>Row 0 --------Heading</option>
</select>
</form>
<script type="text/javascript">
myOptions();
</script>
</html>
--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Mar 17 '07 #5
P: n/a
Hi Stephane,

I'm not sure what you and Macca have given me apart from two very good
examples of one of the things I find undesirable in a select list. I must be
missing something but I just don't know what it is. "Without table columns
we need to use a non-proportional font in our select lists to get things to
line up correctly" Is that what you were showing me? The reverse? Something
new?

Regards Richard Maher

"ASM" <st*********************@wanadoo.fr.invalidwrote in message
news:45***********************@news.orange.fr...
McKirahan a écrit :

Consider this:

or this :

<html>
<script type="text/javascript">
function myOptions() {
var S = document.forms[0][0], opts;
for(var i=1; i<10; i++) {
opts = new Option('Row '+i+' -----Details',i);
S.options[S.length] = opts;
}
}
function pick(that) {
var k = that.selectedIndex;
if (k 0)
alert(that.options[k].text +
' value = ' + that.options[k].value);
}
</script>
<form>
<select size="11" onclick="pick(this)"
style="font-family:Courier New">
<option>Row 0 --------Heading</option>
</select>
</form>
<script type="text/javascript">
myOptions();
</script>
</html>
--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

Mar 17 '07 #6
P: n/a
Hi Animal,
You might want to consider the full-on AJAX/RIA option like:
I'm not real keen on http as a middleware protocol and much prefer something
context-rich, stateful, conversational, and with a bit more power, but I did
like the quality of your output (If not the performance :-) So if there is a
"Third-Way" in the argument between Tables and Select-Lists then I'm all for
hearing about it!

I tried viewing the source and also tried looking up some of the responses
to "grid" but I'm sorry to report that I'm still none the wiser. You
couldn't just post ~100-200 line example with inline styles that knocks up
one of these grids couldya? <DIVseems to be extremely powerful and the
driving force behind a lot of this stuff; is that right? I did see a great
example from someone here where the horizontal and vertical headers would
follow there columns when scrolling on way but stay fixed the other. This
was amazing functionality! But when I looked at the source it was
copyrighted and many hundreds of lines long :-(

I guess what I'm realling looking for is "Where are the browser vendors
putting their investment dollars when it comes to tables/select lists?" With
Internet Explorer is certainly looks like Tables to me.

Regards Richard Maher

PS. No idea what RIA is sorry.

"TheBagbournes" <no***@noway.comwrote in message
news:FY******************************@bt.com...
Richard Maher wrote:
Hi,

Sorry if this is one of those issues that people feel passionate about
and I
assure you I'm not trolling but rather seeking guidance on which way to
go
with the web browser presentation of tabular result sets.

I'm a newbie and don't know any better, but I immediately opted for
Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post
of
Stephane's showed me this is not so)

These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font
to
line up.
2) I have column headings and don't like having to fudge option[0] as a
header when thead and tfoot entries now look like they can be static
outside
the scroll area (true?)
3) You can "select" table rows (true?)
4) Inserting and removing <tr>s is no harder than <optionsin a
<select>
5) Have you seen what Microsoft has done with Tables lately? I don't
know
how much is down to CSS or how much (<div TABNAM="name">) is IE specific
but
it really looks good! Click down to expand tehh whole table or leave it
how
it is and scroll through.

So any thoughts or advice on what direction drowsers are heading in with
regard to this issue?

You might want to consider the full-on AJAX/RIA option like:

http://www.yui-ext.com/deploy/ext-1....um-search.html
>
The drop down which appears when you type (try entering "grid") is a fully
configurable Grid with moveable, resizable columns. Lots of other example
under the /examples directory there...
>
Download the library at http://www.yui-ext.com/deploy/ext-1.0-alpha3.zip

Help forum at http://www.yui-ext.com/forum/index.php

Have fun,

Animal

Mar 18 '07 #7
P: n/a
On Mar 17, 5:25 pm, "Richard Maher" <maher...@hotspamnotmail.com>
wrote:
Hi Animal,
You might want to consider the full-onAJAX/RIAoption like:

I'm not real keen on http as a middleware protocol and much prefer something
context-rich, stateful, conversational, and with a bit more power, but I did
like the quality of your output (If not the performance :-) So if there is a
"Third-Way" in the argument between Tables and Select-Lists then I'm all for
hearing about it!

I tried viewing the source and also tried looking up some of the responses
to "grid" but I'm sorry to report that I'm still none the wiser. You
couldn't just post ~100-200 line example with inline styles that knocks up
one of these grids couldya? <DIVseems to be extremely powerful and the
driving force behind a lot of this stuff; is that right? I did see a great
example from someone here where the horizontal and vertical headers would
follow there columns when scrolling on way but stay fixed the other. This
was amazing functionality! But when I looked at the source it was
copyrighted and many hundreds of lines long :-(

I guess what I'm realling looking for is "Where are the browser vendors
putting their investment dollars when it comes to tables/select lists?" With
Internet Explorer is certainly looks like Tables to me.

Regards Richard Maher

PS. No idea whatRIAis sorry.

"TheBagbournes" <n...@noway.comwrote in message

news:FY******************************@bt.com...
Richard Maher wrote:
Hi,
Sorry if this is one of those issues that people feel passionate about
and I
assure you I'm not trolling but rather seeking guidance on which way to
go
with the web browser presentation of tabular result sets.
I'm a newbie and don't know any better, but I immediately opted for
Select
Lists 'cos A) someone showed me :-) and b) 'cos I didn't think you could
select from a Table without a Button-cell on each row (but a recent post
of
Stephane's showed me this is not so)
These are some of the reasons I think I should now go to tables: -
1) I have columns and am sick of having to use a non-proportional font
to
line up.
2) I have column headings and don't like having to fudge option[0] as a
header when thead and tfoot entries now look like they can be static
outside
the scroll area (true?)
3) You can "select" table rows (true?)
4) Inserting and removing <tr>s is no harder than <optionsin a
<select>
5) Have you seen what Microsoft has done with Tables lately? I don't
know
how much is down to CSS or how much (<div TABNAM="name">) is IE specific
but
it really looks good! Click down to expand tehh whole table or leave it
how
it is and scroll through.
So any thoughts or advice on what direction drowsers are heading in with
regard to this issue?
You might want to consider the full-onAJAX/RIAoption like:

http://www.yui-ext.com/deploy/ext-1....orm/forum-sear...
The drop down which appears when you type (try entering "grid") is a fully

configurable Grid with moveable, resizable columns. Lots of other example
under the /examples directory there...


Download the library athttp://www.yui-ext.com/deploy/ext-1.0-alpha3.zip
Help forum athttp://www.yui-ext.com/forum/index.php
Have fun,
Animal- Hide quoted text -

- Show quoted text -- Hide quoted text -

- Show quoted text -
Hi,

Try Visual WebGui for a way to have a applicative web presence with
out going through hell (JavaScript long long files)...
This solution is basically extending ASP.NET with WinForms like
programming including design time which provides a very rapid
environment for developing web applications.

You can also use it to enhance an existing ASP.NET site with out
rewriting all the application... and it is open source available under
the GPL license.

Some quick start video tutorials:
http://www.visualwebgui.com/Default.aspx?tabid=297

The homepage of the project:
http://www.visualwebgui.com

Guy Peled
Founder & Chief Architect
Gizmox - Visual WebGui

Mar 18 '07 #8
P: n/a
ASM
Richard Maher a écrit :
Hi Stephane,

I'm not sure what you and Macca have given me apart from two very good
examples of one of the things I find undesirable in a select list. I must be
missing something but I just don't know what it is. "Without table columns
we need to use a non-proportional font in our select lists to get things to
line up correctly" Is that what you were showing me? The reverse? Something
new?
I did try to swhow you that you can very easily
- empty a select
- grow a select
- insert somewhere a new option in a select
because you seemed to say it was easier to do so with table(s) than with
select(s)

If your question is about presentation of options text ...
You can fix that via css (at least with FireFox or Opera)
as you would do with a table

select,
select option { color: maroon; font-size: 1.2em; text-align: center;
font-family: times, times new roman, university, serif;
width: 10em; height: 1.2em; background: #ffc; }

Now, you probably can do your increasing menu using "normal" lists
(ul li a) that will accelerate IE displays comparatively to tables
--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Mar 18 '07 #9
P: n/a
Richard Maher wrote:
Hi Animal,
>You might want to consider the full-on AJAX/RIA option like:

I'm not real keen on http as a middleware protocol and much prefer something
context-rich, stateful, conversational, and with a bit more power, but I did
like the quality of your output (If not the performance :-) So if there is a
"Third-Way" in the argument between Tables and Select-Lists then I'm all for
hearing about it!

I tried viewing the source and also tried looking up some of the responses
to "grid" but I'm sorry to report that I'm still none the wiser. You
couldn't just post ~100-200 line example with inline styles that knocks up
one of these grids couldya? <DIVseems to be extremely powerful and the
driving force behind a lot of this stuff; is that right? I did see a great
example from someone here where the horizontal and vertical headers would
follow there columns when scrolling on way but stay fixed the other. This
was amazing functionality! But when I looked at the source it was
copyrighted and many hundreds of lines long :-(

I guess what I'm realling looking for is "Where are the browser vendors
putting their investment dollars when it comes to tables/select lists?" With
Internet Explorer is certainly looks like Tables to me.

Regards Richard Maher

PS. No idea what RIA is sorry.
"Rich Internet Application."

The actual *example* code is quite small, 48 lines - follow the link to forum-search.js

And you won't be able to make head or tail of the actual library source (ext-all.js - the compressed version). It's a complex library. You'd have to study it in detail and step through the uncompressed source code. It's open source, so you are free to do so.

The point is that the API is documented, logical and reasonably simple for an experienced software developer to use, you don't actually *need* to understand the guts of it.

And as for using HTTP.... You are isolated in a browser - it's what you have!

Animal
Mar 18 '07 #10
P: n/a
Hi Animal,
The point is that the API is documented, logical and reasonably simple for
an experienced software developer to use, you don't actually *need* to
understand the guts of it.

OK, that's the bit I missed; I'll have to go back and look again. As I said
before, I was very impressed with the quality of the UI.
And as for using HTTP.... You are isolated in a browser - it's what you
have!

Oh, how wrong you are! (Or should I say, HTTP's not the only tool in the box
and it's certainly not the sharpest :-) Once http has pimped your hosting
page and applet for you, you are free to deploy any form of light-weight,
high-performance, application-sepecific protocol over a secure TCP/IP
connection. Context-rich, connection-oriented, authenticated,
high-performance, it's just all gravy here!

Cheers Richard Maher

PS. You don't even need HTTP for the applet upload, but I have to admit that
it beats FTP at least :-)

"TheBagbournes" <no***@noway.comwrote in message
news:k8******************************@bt.com...
Richard Maher wrote:
Hi Animal,
You might want to consider the full-on AJAX/RIA option like:
I'm not real keen on http as a middleware protocol and much prefer
something
context-rich, stateful, conversational, and with a bit more power, but I
did
like the quality of your output (If not the performance :-) So if there
is a
"Third-Way" in the argument between Tables and Select-Lists then I'm all
for
hearing about it!

I tried viewing the source and also tried looking up some of the
responses
to "grid" but I'm sorry to report that I'm still none the wiser. You
couldn't just post ~100-200 line example with inline styles that knocks
up
one of these grids couldya? <DIVseems to be extremely powerful and the
driving force behind a lot of this stuff; is that right? I did see a
great
example from someone here where the horizontal and vertical headers
would
follow there columns when scrolling on way but stay fixed the other.
This
was amazing functionality! But when I looked at the source it was
copyrighted and many hundreds of lines long :-(

I guess what I'm realling looking for is "Where are the browser vendors
putting their investment dollars when it comes to tables/select lists?"
With
Internet Explorer is certainly looks like Tables to me.

Regards Richard Maher

PS. No idea what RIA is sorry.

"Rich Internet Application."

The actual *example* code is quite small, 48 lines - follow the link to
forum-search.js
>
And you won't be able to make head or tail of the actual library source
(ext-all.js - the compressed version). It's a complex library. You'd have to
study it in detail and step through the uncompressed source code. It's open
source, so you are free to do so.
>
The point is that the API is documented, logical and reasonably simple for
an experienced software developer to use, you don't actually *need* to
understand the guts of it.
>
And as for using HTTP.... You are isolated in a browser - it's what you
have!
>
Animal

Mar 18 '07 #11

This discussion thread is closed

Replies have been disabled for this discussion.

Question stats

  • viewed: 1390
  • replies: 10
  • date asked: Mar 17 '07
BYTES.COM © 2019 About Bytes | Advertise on Bytes | Privacy Policy | Manage Cookies
Sitemap | JavaScript / Ajax / DHTML Answers Sitemap | JavaScript / Ajax / DHTML Insights Sitemap

Follow us to get the Latest Bytes Updates