By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,851 Members | 1,118 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,851 IT Pros & Developers. It's quick & easy.

show rows in table

P: n/a
Hi Gurus

I was wondering if you can send me in the right direction:

I have a table with about 300 rows. I want to make all of them invisible
and when a user enters a code in a form then make selected ones visible.

At the moment, I am doing it as follows:

www.corstorphinehouse.com/d/avail.html

The goal is to allow users to view availability for certain days. They will
enter the arrival date and the number of days that they will be staying.

TIA
- Nicolaas
Jul 23 '05 #1
Share this Question
Share on Google+
20 Replies


P: n/a
"WindAndWaves" <ac****@ngaru.com> wrote in message
news:iz*******************@news.xtra.co.nz...
Hi Gurus

I was wondering if you can send me in the right direction:

I have a table with about 300 rows. I want to make all of them invisible
and when a user enters a code in a form then make selected ones visible.

At the moment, I am doing it as follows:

www.corstorphinehouse.com/d/avail.html

The goal is to allow users to view availability for certain days. They will enter the arrival date and the number of days that they will be staying.

TIA
- Nicolaas

Why not use a calendar control as it's a lot more user-friendly.

At the very least, default the d/m/y values to the current or tomorrow's
date that way they may not have to enter/change but one or two of the
fields.

Another, perhaps preferred, alternative is to show calendars for the next
several months with colors to indicate availability. For an example, visit
http://www.chippewahotel.com/room_rates.phtml.
Jul 23 '05 #2

P: n/a
WindAndWaves wrote:
Hi Gurus

I was wondering if you can send me in the right direction: [...] The goal is to allow users to view availability for certain days. They will
enter the arrival date and the number of days that they will be staying.


If your goal was to provide the information without a database and
without using JS, you've suceeded quite nicely.

What kind of direction do you need? :-)

Fred.
Jul 23 '05 #3

P: n/a
"Fred Oz" <oz****@iinet.net.auau> wrote in message
news:41**********************@per-qv1-newsreader-01.iinet.net.au...
WindAndWaves wrote:
Hi Gurus

I was wondering if you can send me in the right direction:

[...]
The goal is to allow users to view availability for certain days. They will enter the arrival date and the number of days that they will be staying.


If your goal was to provide the information without a database and
without using JS, you've suceeded quite nicely.

What kind of direction do you need? :-)

Fred.


Dear Fred

Thank you - you are right, I would like all data to be contained in one HTML
page (inc. Javascript ), because I do not know anything about PHP and it
makes it a lot more difficult. My webpage is send automatically from a
reservation's database.

What I want to do is basically what I have now, but, I thought if I just had
one table where I could hide all the rows and on demand show the applicable
days.

McKirahan suggested a calender, but our place does not like to show all
their dates at the same time, because - in case we are not busy yet, this
will look bad.

I have a script that allows you to hide / show a div using a mouseover
script and I basically would like to do this, but with a start and end date
entered in a form which then "open up" a number of rows. I could possible,
for each TR use an ID (e.g. the date, e.g. D041223 )

TIA

- Nicolaas
Jul 23 '05 #4

P: n/a
"WindAndWaves" <ac****@ngaru.com> wrote in message
news:Dm*******************@news.xtra.co.nz...
Dear Fred

Thank you - you are right, I would like all data to be contained in one HTML page (inc. Javascript ), because I do not know anything about PHP and it
makes it a lot more difficult. My webpage is send automatically from a
reservation's database.

What I want to do is basically what I have now, but, I thought if I just had one table where I could hide all the rows and on demand show the applicable days.

McKirahan suggested a calender, but our place does not like to show all
their dates at the same time, because - in case we are not busy yet, this
will look bad.

I have a script that allows you to hide / show a div using a mouseover
script and I basically would like to do this, but with a start and end date entered in a form which then "open up" a number of rows. I could possible, for each TR use an ID (e.g. the date, e.g. D041223 )

TIA

- Nicolaas


The calendar I provided a link to actually only showed room rates not
availability.

I found these sites that offer "availability calendar software":

http://www.cgi-interactive-uk.com/availability.html
http://www.1000inns.com/miscellaneous/calendars.htm

You might contact them and share your concerns about revealing too much
information; perhaps they have addressed the issue and have some solutions.

BTW -- are you actually revealing to much information by just indicating
that one or more rooms are available? Then clicking on a calendar date to
see the details.

If a competitor really wants to see your information they can because you
provide it!
Jul 23 '05 #5

P: n/a
"McKirahan" <Ne**@McKirahan.com> wrote in message
news:aj5jd.52825$HA.40705@attbi_s01...
"WindAndWaves" <ac****@ngaru.com> wrote in message
news:Dm*******************@news.xtra.co.nz...
Dear Fred

Thank you - you are right, I would like all data to be contained in one HTML
page (inc. Javascript ), because I do not know anything about PHP and it
makes it a lot more difficult. My webpage is send automatically from a
reservation's database.

What I want to do is basically what I have now, but, I thought if I just

had
one table where I could hide all the rows and on demand show the

applicable
days.

McKirahan suggested a calender, but our place does not like to show all
their dates at the same time, because - in case we are not busy yet, this will look bad.

I have a script that allows you to hide / show a div using a mouseover
script and I basically would like to do this, but with a start and end

date
entered in a form which then "open up" a number of rows. I could

possible,
for each TR use an ID (e.g. the date, e.g. D041223 )

TIA

- Nicolaas


The calendar I provided a link to actually only showed room rates not
availability.

I found these sites that offer "availability calendar software":

http://www.cgi-interactive-uk.com/availability.html
http://www.1000inns.com/miscellaneous/calendars.htm

You might contact them and share your concerns about revealing too much
information; perhaps they have addressed the issue and have some

solutions.
BTW -- are you actually revealing to much information by just indicating
that one or more rooms are available? Then clicking on a calendar date to
see the details.

If a competitor really wants to see your information they can because you
provide it!


It is more psychological than anything. It just does not look good if you
have three weeks where, for example,, all rooms are still available.

Jul 23 '05 #6

P: n/a
WindAndWaves wrote:
[...]
for each TR use an ID (e.g. the date, e.g. D041223 )


Yes, that would work fine. Just set the display attribute to 'none',

e.g. <tr style="display: none">

Or give them a class with display set to none. Then for each row you
want to show, set it to "visible":

if (document.getElementById) {
document.getElementById('D041223').style.display = 'visible';
...
}

Of course for each search you will want to toggle the visible one back
to 'none' when you show the next one, perhaps when users click the
"search again" link.

However, you then make you page dependent on JavaScript, which is isn't
at the moment, so think carefully. The two are functionally equivalent
but with JS you are adding a dependency that doesn't exist right now.
Anyone with JS disabled will see nothing. You could set the display
attribute to none using JS, but then anyone with JS disabled will see
the entire table.

One advantage to using JS would be that you can get rid of the
recurrent parts of the table so you have one header, one footer and
lots of rows. This should make your page about 1/3 its present size.

Over to you - Fred.
Jul 23 '05 #7

P: n/a

"Fred Oz" <oz****@iinet.net.auau> wrote in message
news:41**********************@per-qv1-newsreader-01.iinet.net.au...
WindAndWaves wrote:
[...]
for each TR use an ID (e.g. the date, e.g. D041223 )


Yes, that would work fine. Just set the display attribute to 'none',

e.g. <tr style="display: none">

Or give them a class with display set to none. Then for each row you
want to show, set it to "visible":

if (document.getElementById) {
document.getElementById('D041223').style.display = 'visible';
...
}

Of course for each search you will want to toggle the visible one back
to 'none' when you show the next one, perhaps when users click the
"search again" link.

However, you then make you page dependent on JavaScript, which is isn't
at the moment, so think carefully. The two are functionally equivalent
but with JS you are adding a dependency that doesn't exist right now.
Anyone with JS disabled will see nothing. You could set the display
attribute to none using JS, but then anyone with JS disabled will see
the entire table.

One advantage to using JS would be that you can get rid of the
recurrent parts of the table so you have one header, one footer and
lots of rows. This should make your page about 1/3 its present size.

Over to you - Fred.


Hi Fred,

you are 100% on my wavelength. The main question I have is how I can make
the loops that:

1. set the rows invisible
2. open up the rows that should be visible

I actually think it is best to use ID numbers from D0 (being today), through
to D300 being 300 days in the future. Easier for loops.

Wow, discussing this idea really helps me. Thank you

- Nicolaas
Jul 23 '05 #8

P: n/a
WindAndWaves wrote:


1. set the rows invisible
2. open up the rows that should be visible

I actually think it is best to use ID numbers from D0 (being today), through
to D300 being 300 days in the future. Easier for loops.

Wow, discussing this idea really helps me. Thank you

- Nicolaas


http://milestonesmusicroom.com/november2004.html

This event calendar only displays current and future events.
Mick
Jul 23 '05 #9

P: n/a
WindAndWaves wrote:
you are 100% on my wavelength. The main question I have is how I can make
the loops that:

1. set the rows invisible
2. open up the rows that should be visible

Below is a minimal implementation purely for demo purposes. It shows
how to hide all the rows - it keeps an empty one showing as a place
holder. That way it appears that just the text in the row changes.

The clear button sets everything back to the start. It only works for
a couple of dates and there is zero validation, etc. but you have that
in your real page.
I actually think it is best to use ID numbers from D0 (being today), through to D300 being 300 days in the future. Easier for loops.


Bad idea - I would use real dates, otherwise you have to keep track of
your epoch. This way you just keep adding rows to the bottom of your
table and deleting them from the top as the days go by.

If you play with the date object, you can add/delete days to show
"tomorrow" and "yesterday" for any particular date. You can even use
it to check that the date entered is valid (leap years, Feb 29, etc.)
very simply (check Mike Winter's date posts).

Another way of doing this is to put all your values in an array and
just write them to the cells of a display table as appropriate. Your
"D041117" becomes a foreign key to access the values for a particular
date. You could do your bookings in a spreadsheet, then write them out
as comma separated (CSV) and with very little effort convert them to
your array to load.

But a database would be best... :-)

Cheers, Fred.

<html><head><title>Rows Play</title>
<STYLE TYPE="text/css">
BODY {margin: 0px; background-color: white; font-size: 11pt;
font-family: verdana, arial, helvetica, tahoma, geneva;}
TD {text-align: center; width: 12em;}
TD.f {Height: 20px;}
TD.h {Height: 20px; background-color: #FFCF1B; text-align: center;}
TABLE {border: 3px solid #CCCCCC; font-size: 11px; margin-top: 30px;}
input.ta
{width: 3em;}
</style>
<script type="text/javascript">
function hideRows(a){
if (document.getElementById) {
if (a == 'all') {
var t = document.getElementById('roomAvail').rows;
for (var i=0; i<t.length; i++) {
if (t[i].id != 'D000000' && t[i].id != '') {
t[i].style.display = 'none';
} else {
t[i].style.display = 'visible';
}
}
} else {
var t = document.getElementById('roomAvail').rows;
for (var i=0; i<t.length; i++) {
if (t[i].id != '') {
t[i].style.display = 'none';
}
}
}
}
}
function showRow(d,m,y) {
if (document.getElementById) {
document.getElementById('D'+y+m+d).style.display = 'visible';
}
}
</script>

</head>
<body onload="hideRows('all');">
<form action="">
Day&nbsp;<input type="text" class="ta" name="dA" value="14">&nbsp;
Month&nbsp;<input type="text" class="ta" name="mA" value ="11">&nbsp;
Year&nbsp;<input type="text" class="ta" name="yA" value="04">&nbsp;
<input type="button" value="Search" onclick="
hideRows();
showRow(this.form.dA.value,this.form.mA.value,this .form.yA.value);">
<input type="button" value="Clear" onclick="
hideRows('all');">
</form>

<TABLE id="roomAvail" CELLSPACING="0" CELLPADDING="5" CLASS="d" border="1">
<thead>
<TR>
<TD class="h">Day</TD>
<TD class="h">Deluxe 1 King</TD>
<TD class="h">Deluxe 1 Queen</TD>
<TD class="h">Deluxe 2 Queens</TD>
</TR>
</thead>
<tbody>
<TR id="D000000">
<TD CLASS="f">&nbsp;</TD>
<TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD>
</TR><TR id="D041114">
<TD CLASS=f>14-Nov-04</TD>
<TD>6</TD><TD>0</TD><TD>1</TD>
</TR><TR id="D041115">
<TD CLASS="f">15-Nov-04</TD>
<TD>6</TD><TD>1</TD><TD>1</TD>
</TR><TR id="D041116">
<TD CLASS="f">16-Nov-04</TD>
<TD>5</TD><TD>1</TD><TD>1</TD>
</TR><TR id="D041117">
<TD CLASS="f">17-Nov-04</TD>
<TD>4</TD><TD>0</TD><TD>1</TD>
</TR><TR id="D041118">
<TD CLASS="f">18-Nov-04</TD>
<TD>6</TD><TD>0</TD><TD>1</TD>
</TR>
</tbody>
</TABLE>
<DIV CLASS=p><A HREF="#b">make a booking</A></DIV>
<A NAME=041115>&nbsp;</A>
</body></html>
Jul 23 '05 #10

P: n/a
....snip ... snip
Another way of doing this is to put all your values in an array and
just write them to the cells of a display table as appropriate. Your
"D041117" becomes a foreign key to access the values for a particular
date. You could do your bookings in a spreadsheet, then write them out
as comma separated (CSV) and with very little effort convert them to
your array to load.


Thanks a petaflop for that. Awesome. Just need to tell you a secret, the
page I create, I do not create myself. It is straight from an access
database where people maintain their bookings, it turns it into html and
ftps it to the site.
Jul 23 '05 #11

P: n/a
Hi Fred

I have been trying to make the file below to work, but so far without
success. IE spits a complete dummy, opera and fire fox hide the row, but
none of them can show them again.

I replaced the style.display = "visible" with style.color = "red" and that
actually worked.

I looked at all the error messages, but it is way beyond me.

Error options may include:
- numbers from form are perceived to be hex.
- TR does not have the 'display' style associated with it
- ???

can you have another look at it???

thank you.
"Fred Oz" <oz****@iinet.net.auau> wrote in message
news:41**********************@per-qv1-newsreader-01.iinet.net.au...
WindAndWaves wrote:
you are 100% on my wavelength. The main question I have is how I can make the loops that:

1. set the rows invisible
2. open up the rows that should be visible

Below is a minimal implementation purely for demo purposes. It shows
how to hide all the rows - it keeps an empty one showing as a place
holder. That way it appears that just the text in the row changes.

The clear button sets everything back to the start. It only works for
a couple of dates and there is zero validation, etc. but you have that
in your real page.
> I actually think it is best to use ID numbers from D0 (being today),

through
> to D300 being 300 days in the future. Easier for loops.


Bad idea - I would use real dates, otherwise you have to keep track of
your epoch. This way you just keep adding rows to the bottom of your
table and deleting them from the top as the days go by.

If you play with the date object, you can add/delete days to show
"tomorrow" and "yesterday" for any particular date. You can even use
it to check that the date entered is valid (leap years, Feb 29, etc.)
very simply (check Mike Winter's date posts).

Another way of doing this is to put all your values in an array and
just write them to the cells of a display table as appropriate. Your
"D041117" becomes a foreign key to access the values for a particular
date. You could do your bookings in a spreadsheet, then write them out
as comma separated (CSV) and with very little effort convert them to
your array to load.

But a database would be best... :-)

Cheers, Fred.

<html><head><title>Rows Play</title>
<STYLE TYPE="text/css">
BODY {margin: 0px; background-color: white; font-size: 11pt;
font-family: verdana, arial, helvetica, tahoma, geneva;}
TD {text-align: center; width: 12em;}
TD.f {Height: 20px;}
TD.h {Height: 20px; background-color: #FFCF1B; text-align: center;}
TABLE {border: 3px solid #CCCCCC; font-size: 11px; margin-top: 30px;}
input.ta
{width: 3em;}
</style>
<script type="text/javascript">
function hideRows(a){
if (document.getElementById) {
if (a == 'all') {
var t = document.getElementById('roomAvail').rows;
for (var i=0; i<t.length; i++) {
if (t[i].id != 'D000000' && t[i].id != '') {
t[i].style.display = 'none';
} else {
t[i].style.display = 'visible';
}
}
} else {
var t = document.getElementById('roomAvail').rows;
for (var i=0; i<t.length; i++) {
if (t[i].id != '') {
t[i].style.display = 'none';
}
}
}
}
}
function showRow(d,m,y) {
if (document.getElementById) {
document.getElementById('D'+y+m+d).style.display = 'visible';
}
}
</script>

</head>
<body onload="hideRows('all');">
<form action="">
Day&nbsp;<input type="text" class="ta" name="dA" value="14">&nbsp;
Month&nbsp;<input type="text" class="ta" name="mA" value ="11">&nbsp;
Year&nbsp;<input type="text" class="ta" name="yA" value="04">&nbsp;
<input type="button" value="Search" onclick="
hideRows();
showRow(this.form.dA.value,this.form.mA.value,this .form.yA.value);">
<input type="button" value="Clear" onclick="
hideRows('all');">
</form>

<TABLE id="roomAvail" CELLSPACING="0" CELLPADDING="5" CLASS="d"

border="1"> <thead>
<TR>
<TD class="h">Day</TD>
<TD class="h">Deluxe 1 King</TD>
<TD class="h">Deluxe 1 Queen</TD>
<TD class="h">Deluxe 2 Queens</TD>
</TR>
</thead>
<tbody>
<TR id="D000000">
<TD CLASS="f">&nbsp;</TD>
<TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD>
</TR><TR id="D041114">
<TD CLASS=f>14-Nov-04</TD>
<TD>6</TD><TD>0</TD><TD>1</TD>
</TR><TR id="D041115">
<TD CLASS="f">15-Nov-04</TD>
<TD>6</TD><TD>1</TD><TD>1</TD>
</TR><TR id="D041116">
<TD CLASS="f">16-Nov-04</TD>
<TD>5</TD><TD>1</TD><TD>1</TD>
</TR><TR id="D041117">
<TD CLASS="f">17-Nov-04</TD>
<TD>4</TD><TD>0</TD><TD>1</TD>
</TR><TR id="D041118">
<TD CLASS="f">18-Nov-04</TD>
<TD>6</TD><TD>0</TD><TD>1</TD>
</TR>
</tbody>
</TABLE>
<DIV CLASS=p><A HREF="#b">make a booking</A></DIV>
<A NAME=041115>&nbsp;</A>
</body></html>

Jul 23 '05 #12

P: n/a
On Tue, 9 Nov 2004 10:22:58 +1300, WindAndWaves <ac****@ngaru.com> wrote:

[snip]
I replaced the style.display = "visible"


The value, visible, is not valid for the display property. You (or Fred)
are confusing it with the visibility property.

visibility: hidden / visible / collapse
display: none / inline / block / <lots of others>

[snip]

Mike
Please don't top-post.

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #13

P: n/a

"Michael Winter" <M.******@blueyonder.co.invalid> wrote in message
news:opsg50rxmvx13kvk@atlantis...
On Tue, 9 Nov 2004 10:22:58 +1300, WindAndWaves <ac****@ngaru.com> wrote:

[snip]
I replaced the style.display = "visible"


The value, visible, is not valid for the display property. You (or Fred)
are confusing it with the visibility property.

visibility: hidden / visible / collapse
display: none / inline / block / <lots of others>

[snip]

Mike
Please don't top-post.

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.


YOU ARE A LEGEND - thank you - I am stoked.
Jul 23 '05 #14

P: n/a

"WindAndWaves" <ac****@ngaru.com> wrote in message
news:Q6*******************@news.xtra.co.nz...

"Michael Winter" <M.******@blueyonder.co.invalid> wrote in message
news:opsg50rxmvx13kvk@atlantis...
On Tue, 9 Nov 2004 10:22:58 +1300, WindAndWaves <ac****@ngaru.com> wrote:
[snip]
I replaced the style.display = "visible"


The value, visible, is not valid for the display property. You (or Fred)
are confusing it with the visibility property.

visibility: hidden / visible / collapse
display: none / inline / block / <lots of others>

[snip]

Mike
Please don't top-post.

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.


YOU ARE A LEGEND - thank you - I am stoked.


Almost there!

Please have a look at www.rakau.com/test3.html

I would like to do two more things:

1. add a test that tells the user when he or she enters a date before or
after the date range. I can enter the start and end date manually each time
I update the page. Right now you just get an error message.

2. Allow a user to enter a number of days he or she wants to stay and
subsequently show the relevant days (i.e. a little loop - I have NO idea on
how to make that).

Please just keep in mind that this is one of my first JavaScripts.

Thanks a lot

Nicolaas
Jul 23 '05 #15

P: n/a
On Wed, 10 Nov 2004 08:58:39 +1300, WindAndWaves <ac****@ngaru.com> wrote:

[snip]
Please have a look at www.rakau.com/test3.html
A few points, first:

1) I do hope you took to heart Fred's warning about depending on
Javascript. This looks like a page for public access, so relying on
Javascript isn't wise. I appreciate that you don't currently know PHP (or
some other server-side language), but do consider it something to look
into.

2) Do you really need to know the booker's Web site address? I can't think
of any reason for someone to provide it.

3) Validating fields based on the blur event is generally unwise. Use
change, instead. It's not much of an issue here, but bear it in mind for
the future.

4) I wouldn't display error messages using dialog boxes, or if you must,
either show all errors together, or only prompt one error in any
submission sequence. Having to go through repeated alerts is tedious. The
best approach would be to annotate the inputs with error messages.

5) On your "Check availability" button, it's strictly better to use
"this.form", not just "form". You're relying on unspecified behaviour,
otherwise.
I would like to do two more things:

1. add a test that tells the user when he or she enters a date before or
after the date range. I can enter the start and end date manually each
time I update the page. Right now you just get an error message.
If this range will only be used for this purpose, you could just generate
a string of the format yymmdd. You can then concatenate the values the use
enters and perform a string comparison. You *must* use that order, though.

If you have other uses, construct a couple of Date objects from the range
data and the user input, and perform a similar comparison.
2. Allow a user to enter a number of days he or she wants to stay and
subsequently show the relevant days (i.e. a little loop - I have NO idea
on how to make that).


Construct a Date object (dt) based on the start date, then perform

dt.setDate(dt.getDate() + days);

You can then interrogate the object for the new date/month/year.

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #16

P: n/a
WindAndWaves wrote:
I replaced the style.display = "visible"
Yeah, sorry about that. I hope you use style.display = "" to make them
display.

I'm learning quickly that various browsers have their foibles that
allow erroneous code to run (that one came from Safari).

The value, visible, is not valid for the display property. You (or Fred)
It was *meeeee*.....
are confusing it with the visibility property.

visibility: hidden / visible / collapse
display: none / inline / block / <lots of others>

Why the same keywords couldn't have been used for both display and
visibility in regard to showing/hiding beats me...

1. add a test that tells the user when he or she enters a date before or
after the date range. I can enter the start and end date manually each time
I update the page. Right now you just get an error message.
In regard to dates, a low-tech approach is to create some option lists
for day/month/year that contain only the date ranges you want to
support. Date validation is made much simpler (though you still have
to check for 31 Nov, 29/30/31 Feb, etc.) and you are in control of the
date format.

2. Allow a user to enter a number of days he or she wants to stay and
subsequently show the relevant days (i.e. a little loop - I have NO idea on
how to make that).


Follow Mike's advice, or use a start date and length of stay. When you
get your row to display, get its rowIndex property, then iterate for
the number of days to show them too.

Here's a modified showRows():

function showRow(d,m,y,len) {
if (document.getElementById) {
var z = document.getElementById('D'+y+m+d)

// If an in-range date is entered
if (z){
hideRows();
z.style.display = ''
var j = z.rowIndex;

// Show as many rows as the length of stay
for (var i=0; i<len-1; i++) {

// As long as there are rows to show, show 'em
if (z.parentNode.rows[j+i]) {
z.parentNode.rows[j+i].style.display='';

// If the length of stay goes past the end
// of the table, stop trying to show more rows
} else {
alert('You\'ve reached the end of the booking period')
return;
}
}

// otherwise the date is out of range
} else {
alert('You can\'t book for this date');
hideRows('all');
}
}
}
Note the the hideRows() function is now in here because then if the
user selects an out-of-range date, you just tell them and do nothing.
The relevant search range should be noted in your page, e.g. "Booking
information only available for 20 November, 2004 to 30 June, 2005" or
similar.

This new function will just stop at the end of the table if the user
puts in a stay that is too long.

Here is the changed call from the page:

<input type="button" value="Search" onclick="
showRow(this.form.dA.value,this.form.mA.value,this .form.yA.value,this.form.lA.value);">

and there is an extra input for the length of stay - set it to 1 by
default - you should probably also check that it is not negative.
Maybe a select list for it with a range of 1 to 30 days.

<form action="">
Day&nbsp;<input type="text" class="ta" name="dA" value="14">&nbsp;
Month&nbsp;<input type="text" class="ta" name="mA" value ="11">&nbsp;
Year&nbsp;<input type="text" class="ta" name="yA" value="04">&nbsp;
length of stay&nbsp;<input type="text" class="ta" name="lA"
value="1">&nbsp;
<input type="button" value="Search" onclick="

showRow(this.form.dA.value,this.form.mA.value,this .form.yA.value,this.form.lA.value);">
<input type="button" value="Clear" onclick="
hideRows('all');">
</form>
Note this is all sample code to show how to do stuff, you still need to
ensure you validate input and handle any errors gracefully. At
present, if the user has JS turned off they still see the table and can
make a booking.

As a last suggestion, you may want to hide the date selector and search
button by default and use JS to display them when the page loads. If a
user has JS off, then they just get the table and aren't encouraged to
use a non-functioning search utility.

Cheers, Fred.
Jul 23 '05 #17

P: n/a

"WindAndWaves" <ac****@ngaru.com> wrote in message
news:iz*******************@news.xtra.co.nz...
Hi Gurus

I was wondering if you can send me in the right direction:

...... snip .... big snip

to see the final results, please have a look at
www.corstorphinehouse.com/d/avail.html

Thank you all for your comments and great help.

- Nicolaas
Jul 23 '05 #18

P: n/a
"WindAndWaves" <ac****@ngaru.com> wrote in message
news:B2******************@news.xtra.co.nz...

"WindAndWaves" <ac****@ngaru.com> wrote in message
news:iz*******************@news.xtra.co.nz...
Hi Gurus

I was wondering if you can send me in the right direction:

..... snip .... big snip

to see the final results, please have a look at
www.corstorphinehouse.com/d/avail.html

Thank you all for your comments and great help.

- Nicolaas


Visitor's can still see all of your data:

ccyymmdd = mm-dd-yy D1K D1Q D2Q
---------------------------------------
20041121 = 21-Nov-04 5 1 1
20041122 = 22-Nov-04 5 1 1
20041123 = 23-Nov-04 5 0 1
20041124 = 24-Nov-04 5 0 1
20041125 = 25-Nov-04 4 1 1
20041126 = 26-Nov-04 3 1 1
20041127 = 27-Nov-04 4 1 1
20041128 = 28-Nov-04 5 1 1
20041129 = 29-Nov-04 5 1 1
20041130 = 30-Nov-04 5 1 1
20041201 = 01-Dec-04 5 1 1
20041202 = 02-Dec-04 5 1 1
20041203 = 03-Dec-04 5 1 1
20041204 = 04-Dec-04 4 1 1
20041205 = 05-Dec-04 6 1 1
20041206 = 06-Dec-04 6 1 1
20041207 = 07-Dec-04 6 1 1
20041208 = 08-Dec-04 6 1 1
20041209 = 09-Dec-04 4 1 1
20041210 = 10-Dec-04 3 1 1
20041211 = 11-Dec-04 5 1 1
20041212 = 12-Dec-04 6 1 1
20041213 = 13-Dec-04 5 1 0
20041214 = 14-Dec-04 5 1 0
20041215 = 15-Dec-04 6 0 1
20041216 = 16-Dec-04 5 0 1
20041217 = 17-Dec-04 5 1 1
20041218 = 18-Dec-04 5 1 1
20041219 = 19-Dec-04 6 1 1
20041220 = 20-Dec-04 6 1 1
20041221 = 21-Dec-04 5 1 1
20041222 = 22-Dec-04 4 1 1
20041223 = 23-Dec-04 0 0 0
20041224 = 24-Dec-04 0 0 0
20041225 = 25-Dec-04 0 0 0
20041226 = 26-Dec-04 1 0 0
20041227 = 27-Dec-04 0 0 0
20041228 = 28-Dec-04 5 1 1
20041229 = 29-Dec-04 2 0 0
20041230 = 30-Dec-04 0 0 0
20041231 = 31-Dec-04 1 0 1
20050101 = 01-Jan-05 0 0 0
20050102 = 02-Jan-05 4 0 0
20050103 = 03-Jan-05 5 0 1
20050104 = 04-Jan-05 6 1 1
20050105 = 05-Jan-05 4 1 0
20050106 = 06-Jan-05 4 1 0
20050107 = 07-Jan-05 5 1 1
20050108 = 08-Jan-05 6 1 1
20050109 = 09-Jan-05 6 1 1
20050110 = 10-Jan-05 6 1 1
20050111 = 11-Jan-05 4 1 1
20050112 = 12-Jan-05 3 1 1
20050113 = 13-Jan-05 3 1 1
20050114 = 14-Jan-05 4 1 1
20050115 = 15-Jan-05 3 1 1
20050116 = 16-Jan-05 5 1 1
20050117 = 17-Jan-05 4 1 1
20050118 = 18-Jan-05 5 1 1
20050119 = 19-Jan-05 6 1 1
20050120 = 20-Jan-05 6 1 1
20050121 = 21-Jan-05 6 1 1
20050122 = 22-Jan-05 3 0 1
20050123 = 23-Jan-05 3 0 1
20050124 = 24-Jan-05 6 1 1
20050125 = 25-Jan-05 6 1 1
20050126 = 26-Jan-05 5 0 1
20050127 = 27-Jan-05 4 0 1
20050128 = 28-Jan-05 4 1 1
20050129 = 29-Jan-05 6 1 1
20050130 = 30-Jan-05 1 0 1
20050131 = 31-Jan-05 1 0 1
20050201 = 01-Feb-05 5 1 1
20050202 = 02-Feb-05 3 1 1
20050203 = 03-Feb-05 2 1 1
20050204 = 04-Feb-05 3 1 1
20050205 = 05-Feb-05 2 1 1
20050206 = 06-Feb-05 2 0 1
20050207 = 07-Feb-05 4 0 1
20050208 = 08-Feb-05 3 1 1
20050209 = 09-Feb-05 4 1 1
20050210 = 10-Feb-05 3 1 1
20050211 = 11-Feb-05 5 1 1
20050212 = 12-Feb-05 2 0 1
20050213 = 13-Feb-05 0 0 0
20050214 = 14-Feb-05 2 0 1
20050215 = 15-Feb-05 0 0 1
20050216 = 16-Feb-05 1 0 1
20050217 = 17-Feb-05 5 1 1
20050218 = 18-Feb-05 5 1 1
20050219 = 19-Feb-05 5 1 1
20050220 = 20-Feb-05 5 1 1
20050221 = 21-Feb-05 5 0 1
20050222 = 22-Feb-05 5 1 1
20050223 = 23-Feb-05 0 0 0
20050224 = 24-Feb-05 0 0 0
20050225 = 25-Feb-05 0 0 1
20050226 = 26-Feb-05 5 0 1
20050227 = 27-Feb-05 5 0 1
20050228 = 28-Feb-05 6 1 1
20050301 = 01-Mar-05 5 1 1
20050302 = 02-Mar-05 3 0 1
20050303 = 03-Mar-05 3 0 1
20050304 = 04-Mar-05 5 1 1
20050305 = 05-Mar-05 6 1 1
20050306 = 06-Mar-05 6 1 1
20050307 = 07-Mar-05 5 1 1
20050308 = 08-Mar-05 1 1 1
20050309 = 09-Mar-05 1 1 1
20050310 = 10-Mar-05 5 0 1
20050311 = 11-Mar-05 6 0 1
20050312 = 12-Mar-05 5 0 1
20050313 = 13-Mar-05 4 0 1
20050314 = 14-Mar-05 5 0 1
20050315 = 15-Mar-05 5 1 1
20050316 = 16-Mar-05 5 1 1
20050317 = 17-Mar-05 6 1 1
20050318 = 18-Mar-05 6 1 1
20050319 = 19-Mar-05 6 1 1
20050320 = 20-Mar-05 6 1 1
20050321 = 21-Mar-05 6 1 1
20050322 = 22-Mar-05 6 1 1
20050323 = 23-Mar-05 6 1 1
20050324 = 24-Mar-05 6 1 1
20050325 = 25-Mar-05 6 1 1
20050326 = 26-Mar-05 6 1 1
20050327 = 27-Mar-05 6 1 1
20050328 = 28-Mar-05 4 1 1
20050329 = 29-Mar-05 4 1 1
20050330 = 30-Mar-05 6 1 1
20050331 = 31-Mar-05 5 1 1
20050401 = 01-Apr-05 5 1 1
20050402 = 02-Apr-05 1 0 0
20050403 = 03-Apr-05 4 1 1
20050404 = 04-Apr-05 6 1 1
20050405 = 05-Apr-05 2 1 1
20050406 = 06-Apr-05 1 1 1
20050407 = 07-Apr-05 4 1 1
20050408 = 08-Apr-05 6 1 1
20050409 = 09-Apr-05 6 1 1
20050410 = 10-Apr-05 6 1 1
20050411 = 11-Apr-05 6 1 1
20050412 = 12-Apr-05 6 1 1
20050413 = 13-Apr-05 6 1 1
20050414 = 14-Apr-05 6 1 1
20050415 = 15-Apr-05 6 1 1
20050416 = 16-Apr-05 6 1 1
20050417 = 17-Apr-05 6 1 1
20050418 = 18-Apr-05 6 1 1
20050419 = 19-Apr-05 6 1 1
20050420 = 20-Apr-05 6 1 1
20050421 = 21-Apr-05 6 1 1
20050422 = 22-Apr-05 6 1 1
20050423 = 23-Apr-05 6 1 1
20050424 = 24-Apr-05 6 1 1
20050425 = 25-Apr-05 6 1 1
20050426 = 26-Apr-05 6 1 1
20050427 = 27-Apr-05 4 1 1
20050428 = 28-Apr-05 5 1 1
20050429 = 29-Apr-05 6 1 1
20050430 = 30-Apr-05 6 1 1
20050501 = 01-May-05 6 1 1
20050502 = 02-May-05 6 1 1
20050503 = 03-May-05 6 1 1
20050504 = 04-May-05 6 1 1
20050505 = 05-May-05 6 1 1
20050506 = 06-May-05 6 1 1
20050507 = 07-May-05 6 1 1
20050508 = 08-May-05 6 1 1
20050509 = 09-May-05 6 1 1
20050510 = 10-May-05 6 1 1
20050511 = 11-May-05 6 1 1
20050512 = 12-May-05 6 1 1
20050513 = 13-May-05 6 1 1
20050514 = 14-May-05 6 1 1
20050515 = 15-May-05 6 1 1
20050516 = 16-May-05 6 1 1
20050517 = 17-May-05 6 1 1
20050518 = 18-May-05 6 1 1
20050519 = 19-May-05 6 1 1
20050520 = 20-May-05 5 1 1
20050521 = 21-May-05 5 1 1
20050522 = 22-May-05 6 1 1
20050523 = 23-May-05 6 1 1
20050524 = 24-May-05 6 1 1
20050525 = 25-May-05 6 1 1
20050526 = 26-May-05 6 1 1
20050527 = 27-May-05 6 1 1
20050528 = 28-May-05 6 1 1
20050529 = 29-May-05 6 1 1
20050530 = 30-May-05 6 1 1
20050531 = 31-May-05 6 1 1
20050601 = 01-Jun-05 6 1 1
20050602 = 02-Jun-05 6 1 1
20050603 = 03-Jun-05 6 1 1
20050604 = 04-Jun-05 6 1 1
20050605 = 05-Jun-05 6 1 1
20050606 = 06-Jun-05 6 1 1
20050607 = 07-Jun-05 6 1 1
20050608 = 08-Jun-05 6 1 1
20050609 = 09-Jun-05 6 1 1
20050610 = 10-Jun-05 6 1 1
20050611 = 11-Jun-05 6 1 1
20050612 = 12-Jun-05 6 1 1
20050613 = 13-Jun-05 6 1 1
20050614 = 14-Jun-05 6 1 1
20050615 = 15-Jun-05 6 1 1
20050616 = 16-Jun-05 0 0 1
20050617 = 17-Jun-05 0 0 1
20050618 = 18-Jun-05 0 0 1
20050619 = 19-Jun-05 2 1 1
20050620 = 20-Jun-05 2 1 1
20050621 = 21-Jun-05 6 1 1
20050622 = 22-Jun-05 6 1 1
20050623 = 23-Jun-05 6 1 1
20050624 = 24-Jun-05 6 1 1
20050625 = 25-Jun-05 6 1 1
20050626 = 26-Jun-05 6 1 1
20050627 = 27-Jun-05 6 1 1
20050628 = 28-Jun-05 6 1 1
20050629 = 29-Jun-05 6 1 1
20050630 = 30-Jun-05 6 1 1
20050701 = 01-Jul-05 6 1 1
20050702 = 02-Jul-05 6 1 1
20050703 = 03-Jul-05 6 1 1
20050704 = 04-Jul-05 6 1 1
20050705 = 05-Jul-05 6 1 1
20050706 = 06-Jul-05 6 1 1
20050707 = 07-Jul-05 6 1 1
20050708 = 08-Jul-05 6 1 1
20050709 = 09-Jul-05 2 0 1
20050710 = 10-Jul-05 2 0 1
20050711 = 11-Jul-05 2 0 1
20050712 = 12-Jul-05 2 0 1
20050713 = 13-Jul-05 2 0 1
20050714 = 14-Jul-05 2 0 1
20050715 = 15-Jul-05 2 0 1
20050716 = 16-Jul-05 2 0 1
20050717 = 17-Jul-05 2 0 1
20050718 = 18-Jul-05 6 1 1
20050719 = 19-Jul-05 6 1 1
20050720 = 20-Jul-05 6 1 1
20050721 = 21-Jul-05 6 1 1
20050722 = 22-Jul-05 6 1 1
20050723 = 23-Jul-05 6 1 1
20050724 = 24-Jul-05 6 1 1
20050725 = 25-Jul-05 6 1 1
20050726 = 26-Jul-05 3 1 1
20050727 = 27-Jul-05 3 1 1
20050728 = 28-Jul-05 6 1 1
20050729 = 29-Jul-05 6 1 1
20050730 = 30-Jul-05 6 1 1
20050731 = 31-Jul-05 6 1 1
20050801 = 01-Aug-05 6 1 1
20050802 = 02-Aug-05 6 1 1
20050803 = 03-Aug-05 6 1 1
20050804 = 04-Aug-05 6 1 1
20050805 = 05-Aug-05 6 1 1
20050806 = 06-Aug-05 6 1 1
20050807 = 07-Aug-05 6 1 1
20050808 = 08-Aug-05 6 1 1
20050809 = 09-Aug-05 6 1 1
20050810 = 10-Aug-05 6 1 1
20050811 = 11-Aug-05 6 1 1
20050812 = 12-Aug-05 6 1 1
20050813 = 13-Aug-05 6 1 1
20050814 = 14-Aug-05 6 1 1
20050815 = 15-Aug-05 6 1 1
20050816 = 16-Aug-05 6 1 1
20050817 = 17-Aug-05 6 1 1
20050818 = 18-Aug-05 6 1 1
20050819 = 19-Aug-05 6 1 1
20050820 = 20-Aug-05 6 1 1
20050821 = 21-Aug-05 6 1 1
20050822 = 22-Aug-05 6 1 1
20050823 = 23-Aug-05 6 1 1
20050824 = 24-Aug-05 6 1 1
20050825 = 25-Aug-05 6 1 1
20050826 = 26-Aug-05 6 1 1
20050827 = 27-Aug-05 6 1 1
20050828 = 28-Aug-05 6 1 1
20050829 = 29-Aug-05 6 1 1
20050830 = 30-Aug-05 6 1 1
20050831 = 31-Aug-05 6 1 1
20050901 = 01-Sep-05 6 1 1
20050902 = 02-Sep-05 6 1 1
20050903 = 03-Sep-05 6 1 1
20050904 = 04-Sep-05 6 1 1
20050905 = 05-Sep-05 6 1 1
20050906 = 06-Sep-05 6 1 1
20050907 = 07-Sep-05 6 1 1
20050908 = 08-Sep-05 6 1 1
20050909 = 09-Sep-05 6 1 1
20050910 = 10-Sep-05 6 1 1
20050911 = 11-Sep-05 6 1 1
20050912 = 12-Sep-05 6 1 1
20050913 = 13-Sep-05 6 1 1
20050914 = 14-Sep-05 6 1 1
20050915 = 15-Sep-05 6 1 1
20050916 = 16-Sep-05 6 1 1
20050917 = 17-Sep-05 6 1 1
20050918 = 18-Sep-05 6 1 1
20050919 = 19-Sep-05 6 1 1
20050920 = 20-Sep-05 2 1 1
20050921 = 21-Sep-05 2 1 1
20050922 = 22-Sep-05 6 1 1
20050923 = 23-Sep-05 6 1 1
20050924 = 24-Sep-05 6 1 1
20050925 = 25-Sep-05 6 1 1
20050926 = 26-Sep-05 6 1 1
20050927 = 27-Sep-05 6 1 1
20050928 = 28-Sep-05 6 1 1
20050929 = 29-Sep-05 6 1 1
20050930 = 30-Sep-05 6 1 1
20051001 = 01-Oct-05 6 1 1
20051002 = 02-Oct-05 6 1 1
20051003 = 03-Oct-05 6 1 1
20051004 = 04-Oct-05 6 1 1
20051005 = 05-Oct-05 6 1 1
20051006 = 06-Oct-05 6 1 1
20051007 = 07-Oct-05 6 1 1
20051008 = 08-Oct-05 6 1 1
20051009 = 09-Oct-05 6 1 1
20051010 = 10-Oct-05 0 0 0
20051011 = 11-Oct-05 0 0 0
20051012 = 12-Oct-05 6 1 1
20051013 = 13-Oct-05 6 1 1
20051014 = 14-Oct-05 6 1 1
20051015 = 15-Oct-05 6 1 1
20051016 = 16-Oct-05 6 1 1
20051017 = 17-Oct-05 6 1 1
20051018 = 18-Oct-05 6 1 1
20051019 = 19-Oct-05 6 1 1
20051020 = 20-Oct-05 3 1 1
20051021 = 21-Oct-05 6 1 1
20051022 = 22-Oct-05 6 1 1
20051023 = 23-Oct-05 6 1 1
20051024 = 24-Oct-05 6 1 1
20051025 = 25-Oct-05 2 1 1
20051026 = 26-Oct-05 2 1 1
20051027 = 27-Oct-05 6 1 1
20051028 = 28-Oct-05 6 1 1
20051029 = 29-Oct-05 6 1 1
20051030 = 30-Oct-05 6 1 1
20051031 = 31-Oct-05 0 0 0
20051101 = 01-Nov-05 0 0 0
20051102 = 02-Nov-05 6 1 1
20051103 = 03-Nov-05 6 1 1
20051104 = 04-Nov-05 6 1 1
20051105 = 05-Nov-05 6 1 1
20051106 = 06-Nov-05 6 1 1
20051107 = 07-Nov-05 6 1 1
20051108 = 08-Nov-05 6 1 1
20051109 = 09-Nov-05 6 1 1
20051110 = 10-Nov-05 6 1 1
Jul 23 '05 #19

P: n/a
On Tue, 16 Nov 2004 12:12:48 GMT, McKirahan wrote:
Visitor's can still see all of your data:

ccyymmdd = mm-dd-yy D1K D1Q D2Q
---------------------------------------
20041121 = 21-Nov-04 5 1 1

....(etcetera)

You thought it would require posting 350+ lines of it
to prove the point?

That seems quite excessive.

--
Andrew Thompson
http://www.PhySci.org/codes/ Web & IT Help
http://www.PhySci.org/ Open-source software suite
http://www.1point1C.org/ Science & Technology
http://www.LensEscapes.com/ Images that escape the mundane
Jul 23 '05 #20

P: n/a

"Andrew Thompson" <Se********@www.invalid> wrote in message
news:1w******************************@40tude.net.. .
On Tue, 16 Nov 2004 12:12:48 GMT, McKirahan wrote:
Visitor's can still see all of your data:

ccyymmdd = mm-dd-yy D1K D1Q D2Q
---------------------------------------
20041121 = 21-Nov-04 5 1 1

...(etcetera)

You thought it would require posting 350+ lines of it
to prove the point?

That seems quite excessive.

--
Andrew Thompson
http://www.PhySci.org/codes/ Web & IT Help
http://www.PhySci.org/ Open-source software suite
http://www.1point1C.org/ Science & Technology
http://www.LensEscapes.com/ Images that escape the mundane

Yes, people can still see all the data if they want to, but only if they
want to - and then they may as well call us and ask us. The idea is not to
publish say all of April in one big hit to show that there is no-one staying
with us in April - that would look bad. It is not really about security,
just about perception in this case. I hope that makes sense

Thank you all once more for all your comments.

- Nicolaas

Jul 23 '05 #21

This discussion thread is closed

Replies have been disabled for this discussion.