please help with a nullor object error

J

James Walker

Can some one help I get an error of 'checkIndate' is null or not an object

can someone please help. I can't work out why

Thanks in advance

James
<form>

<td height="24" colspan="7" valign="top"><form name="booknow"><select
name="checkInDate" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18 </option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21">21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24">24</option>
<option value="25" >25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28" >28</option>
<option value="29 ">29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
<select id="month" class="f11">
<option value="1" >Jan</option>
<option value="2" >Feb</option>
<option value="3">Mar</option>
<option value="4" >Apr</option>
<option value="5" >May</option>
<option value="6" >Jun</option>
<option value="7" >Jul</option>
<option value="8" >Aug</option>
<option value="9" >Sep</option>
<option value="10" >Oct</option>
<option value="11" >Nov</option>
<option value="12" >Dec</option>
</select>
<select id="year" class="f11">
<option value="03" >2003</option>
<option value="04" >2004</option>
<option value="05" >2005</option>
<option value="06" >2006</option>
</select>
</td>
</tr>
<tr>
<td width="44" height="15" valign="top"><strong>Adults</strong></td>
<td width="15"></td>
<td width="50" valign="top"><strong>Nights</strong></td>
<td width="15"></td>
<td colspan="2" valign="top"><strong>Rooms</strong></td>
<td width="11"></td>
</tr>
<tr>
<td height="29" colspan="2" valign="top"><select id="adults"
class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td valign="top"><select id="nights" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td>&nbsp;</td>
<td colspan="2" valign="top"><select id="rooms" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
</form>
<td></td>
</tr>
<tr>
<td height="20"></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td width="42" valign="top"><input type=submit value="Go!"
onclick="doURL()">

<script language="JavaScript">

function doURL()
{
var theForm=document.booknow;
var checkInDate=theForm.checkIndate[checkInDate.selectedIndex].value;
var checkInMonth=theForm.month[month.selectedIndex].value;
var checkInYear=theForm.year[year.selectedIndex].value;
var
numberOfNights=theForm.nights[nights.selectedIndex].value;
var numberOfAdults=theForm.adults[adults.selectedindex].value;
var numberOfRooms=theForm.rooms[rooms.selectedIndex].value;
t= "http://www.ichotelsgroup.com/redirect?checkInDatebrandCode=6c"+
"&path=asearch&city=London&countryId=0925&rateTypeCodes=6CBARC"+
"&checkInDate="+checkInDate+
"&checkInMonth="+month+
"&checkInYear="+year+
"&numberOfNights="+nights+
"&numberOfAdults="+adults+
"&numberOfRooms="+rooms+
"&hotelCode=LONLH"
window.open(t,"_blank","")
}

//-->
</script>
 
P

Paul

<form>

<td height="24" colspan="7" valign="top"><form name="booknow"><select
name="checkInDate" class="f11">
(...)

var theForm=document.booknow;
Click to expand...

this should not work, because 'booknow' is not inside the document but
inside an other form. In general you should work with
id="sameNameAsNameAttribute" and getElementById('...')


Paul
 
M

Michael Winter

James Walker wrote on 15 Dec 2003 at Mon, 15 Dec 2003 22:08:15
GMT:
Can some one help I get an error of 'checkIndate' is null or not
an object

can someone please help. I can't work out why
Click to expand...

You capitalised it incorrectly. The control's name is 'checkInDate':
note the capital 'D'. JavaScript is case-sensitive.

Now for some unrelated comments...

Don't use a FORM that you don't intend to submit. It's an abuse of
the element. Form controls can exist and be referenced outside of a
FORM element, so there is no reason to use it[1].

In the code below, you reference ID values. That will only work in IE
(and possibly Opera). Furthermore, using code like:

document.booknow

can mean that your page will not work in some browsers. Instead, use:

document.forms['booknow']

and when accessing form elements:

document.forms['booknow'].elements['checkInDate']

In the future, if you use code like this, use name and id attributes
with the same values.

To access a form element without an enclosing form, use the
document.getElementById method (NS, Mozilla, Opera) or document.all
collection (IE, Opera). For example:

var checkInDate = null;

if (document.getElementById) {
checkInDate = document.getElementById('checkInDate');
} else if (document.all) {
checkInDate = document.all['checkInDate'];
}

if (checkInDate) {
// continue...
}
<script language="JavaScript">
Click to expand...

The type attribute is *required* in HTML. When used, it renders the
deprecated language redundant.

function doURL()
{
var theForm=document.booknow;
var checkInDate =
theForm.checkIndate[checkInDate.selectedIndex].value;
Click to expand...

You should be consistent with qualifying object references. This like
will probably produce unexpected results as you have a variable named
checkInDate and an object named checkInDate. However, as you don't
qualify the object properly, the variable will take presidence (not
what you want). This could be another source of the error.
You should have at least used theForm.checkInDate.selectedIndex,
though preferably you should use the methods I presented above. The
same applies to the next five lines.
var checkInMonth=theForm.month[month.selectedIndex].value;
var checkInYear=theForm.year[year.selectedIndex].value;
var numberOfNights=theForm.nights[nights.selectedIndex].value;
var numberOfAdults=theForm.adults[adults.selectedindex].value;
var numberOfRooms=theForm.rooms[rooms.selectedIndex].value;
t =
"http://www.ichotelsgroup.com/redirect?checkInDatebrandCode=6c"+
"&path=asearch&city=London&countryId=0925&rateTypeCodes=6CBARC"+
"&checkInDate="+checkInDate+
"&checkInMonth="+month+
"&checkInYear="+year+
"&numberOfNights="+nights+
"&numberOfAdults="+adults+
"&numberOfRooms="+rooms+
"&hotelCode=LONLH"
Click to expand...

You missed the semi-colon here...
window.open(t,"_blank","")
Click to expand...

....and here. Also, you declared 't' above globally. Use var like the
other declarations.
}

//-->
Click to expand...

Why is this here?

1) There isn't a starting comment sequence.
2) There is no longer a need to 'hide' scripts from browsers with
SGML comments, so it shouldn't be present anyway.
</script>
Click to expand...


Mike


[1] Old browsers don't support DOM or DHTML, one of which is required
to access HTML elements that are not accessible through
collections, like document.forms.
 
J

Juliette

James said:
Can some one help I get an error of 'checkIndate' is null or not an object

can someone please help. I can't work out why

Thanks in advance

James
Click to expand...

<snip><snip>


Hi James,

Please find below a working version of the script and code.
Even when the mentioned problem had been solved, the function still
contained quite some problems most of which would "break" the function
as well.
I'll summarize them for you:

* You open the form twice
* The input button which called the js function was outside of the form
* The form fields had id's however, they should be named ( i.e.
name="adults"). Good guideline: use non-capitalized words only. (i.e.
checkindate in stead of checkInDate)
Preferably you should then use the id's to attach the labels to the
field so that the form will be better accessible - using tabindex would
help too, but that's of course off topic.
* The onClick function wasn't passing the form and for some reason the
"theForm" variable wasn't picking it up either
* Javascript is case-sensitive so (please note that the astrixes have
only been added to point out the problem letter):
"theForm.checkIndate[checkInDate.selectedIndex].value" will never work
when you mean "theForm.checkIn*D*ate[checkInDate.selectedIndex].value.
Similar: "theForm.adults[adults.selectedindex].value" can't work when
you mean "theForm.adults[adults.selected*I*ndex].value"
* The syntax for getting the value of a selected option in a selectlist
is:
form.field.options[form.field.selectedindex].value
So missing out the "options" part and the second "form" will also make
sure your function won't work
* The last part where you are stringing text together, you are referring
to for instance "month" and "year" while the variables you created are
named differently, i.e. "checkInMonth" and "checkInYear".
Again, obviously the function will break on that too.

Please note: I haven't cleaned up your code, only adjusted it to make it
work.
Tested & working in IE6 and NS7.

Good luck,
Juliette


<HTML><HEAD></HEAD><BODY>
<TABLE>
<td height="24" colspan="7" valign="top"><form
name="booknow"><select
name="checkindate" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18 </option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21">21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24">24</option>
<option value="25" >25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28" >28</option>
<option value="29 ">29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
<select name="month" id="month" class="f11">
<option value="1" >Jan</option>
<option value="2" >Feb</option>
<option value="3">Mar</option>
<option value="4" >Apr</option>
<option value="5" >May</option>
<option value="6" >Jun</option>
<option value="7" >Jul</option>
<option value="8" >Aug</option>
<option value="9" >Sep</option>
<option value="10" >Oct</option>
<option value="11" >Nov</option>
<option value="12" >Dec</option>
</select>
<select name="year" id="year" class="f11">
<option value="03" >2003</option>
<option value="04" >2004</option>
<option value="05" >2005</option>
<option value="06" >2006</option>
</select>
</td>
</tr>
<tr>
<td width="44" height="15" valign="top"><strong>Adults</strong></td>
<td width="15"></td>
<td width="50" valign="top"><strong>Nights</strong></td>
<td width="15"></td>
<td colspan="2" valign="top"><strong>Rooms</strong></td>
<td width="11"></td>
</tr>
<tr>
<td height="29" colspan="2" valign="top"><select name="adults"
id="adults" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td valign="top"><select name="nights" id="nights" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td>&nbsp;</td>
<td colspan="2" valign="top"><select name="rooms" id="rooms"
class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>

<td></td>
</tr>
<tr>
<td height="20"></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td width="42" valign="top"><input type=submit value="Go!"
onclick="doURL(this.form)"></form></TD>
</TR>
</TABLE>

<script language="JavaScript">

function doURL(form) {
var
checkInDate=form.checkindate.options[form.checkindate.selectedIndex].value;
var checkInMonth=form.month.options[form.month.selectedIndex].value;
var checkInYear=form.year.options[form.year.selectedIndex].value;
var
numberOfNights=form.nights.options[form.nights.selectedIndex].value;
var
numberOfAdults=form.adults.options[form.adults.selectedIndex].value;
var
numberOfRooms=form.rooms.options[form.rooms.selectedIndex].value;
var t =
"http://www.ichotelsgroup.com/redirect?checkInDatebrandCode=6c"+
"&path=asearch&city=London&countryId=0925&rateTypeCodes=6CBARC"+
"&checkInDate="+checkInDate+
"&checkInMonth="+checkInMonth+
"&checkInYear="+checkInYear+
"&numberOfNights="+numberOfNights+
"&numberOfAdults="+numberOfAdults+
"&numberOfRooms="+numberOfRooms+
"&hotelCode=LONLH";
window.open(t,"_blank","");
}

//-->
</script>

</BODY>
</HTML>
 
C

Chris

James,

Quite a few problems here.

I took out the two <FORM> tags and the one closing </FORM> tag then adjusted
the function below to take out references to the form.
Not quite sure why the script doesn't like the pulldowns being on a form.
Your table was incomplete (maybe a cut and paste problem)
The checkInDate the error message was moaning about was misspelled
checkIndate (case sensitive name).
You had a selectedIndex down as selectedindex (another case error)

Otherwise it seems to work OK on IE6.

<script language="JavaScript">
function doURL()
{
var checkInDate2=checkInDate[checkInDate.selectedIndex].value;
var checkInMonth=month[month.selectedIndex].value;
var checkInYear=year[year.selectedIndex].value;
var numberOfNights=nights[nights.selectedIndex].value;
var numberOfAdults=adults[adults.selectedIndex].value;
var numberOfRooms=rooms[rooms.selectedIndex].value;

t= "http://www.ichotelsgroup.com/redirect?checkInDatebrandCode=6c"+
"&path=asearch&city=London&countryId=0925&rateTypeCodes=6CBARC"+
"&checkInDate="+checkInDate+
"&checkInMonth="+month+
"&checkInYear="+year+
"&numberOfNights="+nights+
"&numberOfAdults="+adults+
"&numberOfRooms="+rooms+
"&hotelCode=LONLH"
window.open(t,"_blank","")
}
</script>



Regards and good luck,
Chris.


James Walker said:
Can some one help I get an error of 'checkIndate' is null or not an object

can someone please help. I can't work out why

Thanks in advance

James
<form>

<td height="24" colspan="7" valign="top"><form name="booknow"><select
name="checkInDate" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18 </option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21">21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24">24</option>
<option value="25" >25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28" >28</option>
<option value="29 ">29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
<select id="month" class="f11">
<option value="1" >Jan</option>
<option value="2" >Feb</option>
<option value="3">Mar</option>
<option value="4" >Apr</option>
<option value="5" >May</option>
<option value="6" >Jun</option>
<option value="7" >Jul</option>
<option value="8" >Aug</option>
<option value="9" >Sep</option>
<option value="10" >Oct</option>
<option value="11" >Nov</option>
<option value="12" >Dec</option>
</select>
<select id="year" class="f11">
<option value="03" >2003</option>
<option value="04" >2004</option>
<option value="05" >2005</option>
<option value="06" >2006</option>
</select>
</td>
</tr>
<tr>
<td width="44" height="15" valign="top"><strong>Adults</strong></td>
<td width="15"></td>
<td width="50" valign="top"><strong>Nights</strong></td>
<td width="15"></td>
<td colspan="2" valign="top"><strong>Rooms</strong></td>
<td width="11"></td>
</tr>
<tr>
<td height="29" colspan="2" valign="top"><select id="adults"
class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td valign="top"><select id="nights" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
<td>&nbsp;</td>
<td colspan="2" valign="top"><select id="rooms" class="f11">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
</select></td>
</form>
<td></td>
</tr>
<tr>
<td height="20"></td>
<td></td>
<td></td>
<td>&nbsp;</td>
<td width="42" valign="top"><input type=submit value="Go!"
onclick="doURL()">

<script language="JavaScript">

function doURL()
{
var theForm=document.booknow;
var checkInDate=theForm.checkIndate[checkInDate.selectedIndex].value;
var checkInMonth=theForm.month[month.selectedIndex].value;
var checkInYear=theForm.year[year.selectedIndex].value;
var
numberOfNights=theForm.nights[nights.selectedIndex].value;
var numberOfAdults=theForm.adults[adults.selectedindex].value;
var numberOfRooms=theForm.rooms[rooms.selectedIndex].value;
t= "http://www.ichotelsgroup.com/redirect?checkInDatebrandCode=6c"+
"&path=asearch&city=London&countryId=0925&rateTypeCodes=6CBARC"+
"&checkInDate="+checkInDate+
"&checkInMonth="+month+
"&checkInYear="+year+
"&numberOfNights="+nights+
"&numberOfAdults="+adults+
"&numberOfRooms="+rooms+
"&hotelCode=LONLH"
window.open(t,"_blank","")
}

//-->
</script>
Click to expand...
 
R

Richard Cornford

Good guideline: use non-capitalized words only. (i.e.
checkindate in stead of checkInDate)
Click to expand...

Why? Camel case is a normal variable naming convention and considerably
easier to read than multiple words joined together but written only in
lowercase.

Please note: I haven't cleaned up your code, only adjusted
it to make it work.
Tested & working in IE6 and NS7.
Click to expand...

That may be the case but the results retain an unnecessary reliance on
undocumented and non-standardised error correcting behaviour because:-
<td height="24" colspan="7" valign="top"><form
name="booknow"><select
Click to expand...
<snip>

-HTML has a tree structure, an element must completely contain its
descendants so an opening FORM tag contained within an TD element, as it
<option value="06" >2006</option>
</select>
</td>
Click to expand...
<snip>

That leaves the rest of the form elements on the page outside of the
form. For this HTML to allow functional interaction with the "form" the
browser has to second guess the author's intentions and juggle the
resulting DOM to compensate, some browsers do that but there is no
reason to expect them to, or that those that do will produce results
that are consistent with the results on any other browsers.

A consistent and reliable HTML structure could easily be achieved by
moving the form element so that it contains the entire table.

Richard.
 
R

Richard Cornford

Don't use a FORM that you don't intend to submit. It's an
abuse of the element. Form controls can exist and be
referenced outside of a FORM element, so there is no
reason to use it[1].
Click to expand...
<snip>

Another approach to this problem is to abandon the JavaScript and just
use a form and have the submit button submit the form using method="get"
and target="_blank".

What the code attempts is to construct a query string based on the
selected values of form elements, add some constant name/value pairs and
target the result of a GET request made using the resulting URL at a new
browser window.

So the only thing that the script attempts that is not already part of
the form is to add the constant name/value pairs, but the addition of a
few <input type="hidden"> fields would have an appropriate form making
exactly the Get request made by the script and without any dependence on
JavaScript at all (and, of course, fix the HTML so that it is valid and
makes sense).

Richard.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
How to create a JSON array with values from DOM(HTML TABLE) when I click a button using JQuery/Javascript? 0
Survey details won't go through using php, ajax, Mysql 0
I dont get this. Please help me!! 2
How do I get the if statement correct in the lines that has it in the program? 2
How can I calculate the last payment of the year to be the sum of all previous payments for that year and subtracting it from Research Costs value? 7
problem with form getting submitted 8

Members online

No members online now.
Total: 34 (members: 0, guests: 34)
Robots: 441

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,073
Latest member
DarinCeden

Latest Threads

Top