Troubleshooting Javascript

  • Thread starter Thread starter jobs
  • Start date Start date
J

jobs

I've got some javascript that works great in some old asp.net 1.0
inline code. I'm attempting to move the javascript to a masterpage
and use it in a content page.

I understand that this might result in control names changes in the
rendered page and I've hard coded the destination control
accordingly.

I'm looking at the rendered page and am not sure why i'm getting that
common Object expected message.

But mainly my question is about troubleshooting javascript in general.
What tools do you use? is there a console of IE?

I know this is not the javascript discussion group, but since i
suspect my issue might have to do with javascript on a master page,
used in a content page:

What it's suppose to do is display an image, and then do a slideshow
(blending) of 5 images. It only shows the first image and then chokes.

Thank you for any help!


My error: reads

Line 27 (which appears to be my body tag)
Char1
Error: object expected


Note I refer to : ctl00_Content1_cool which was not the original name
of the control on the content page which is "cool". This code (minus
that control name change) works fine before the master page asp.net
2.0 upgrade.


Rendered HTML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
Untitled Page
</title><style type="text/css">
.ctl00_Menu1_0 { background-
color:white;visibility:hidden;display:none;position:absolute;left:
0px;top:0px; }
.ctl00_Menu1_1 { color:#666666;font-family:Verdana;font-size:
0.8em;text-decoration:none; }
.ctl00_Menu1_2 { color:#666666;background-color:#E3EAEB;font-
family:Verdana;font-size:0.8em; }
.ctl00_Menu1_3 { }
.ctl00_Menu1_4 { padding:2px 5px 2px 5px; }
.ctl00_Menu1_5 { }
.ctl00_Menu1_6 { padding:2px 5px 2px 5px; }
.ctl00_Menu1_7 { background-color:#E3EAEB; }
.ctl00_Menu1_8 { }
.ctl00_Menu1_9 { background-color:#1C5E55; }
.ctl00_Menu1_10 { }
.ctl00_Menu1_11 { background-color:#1C5E55; }
.ctl00_Menu1_12 { color:White; }
.ctl00_Menu1_13 { color:White;background-color:#666666; }
.ctl00_Menu1_14 { color:White; }
.ctl00_Menu1_15 { color:White;background-color:#666666; }

</style></head>
<body id="ctl00_Body" onload="SetTimeout('slideit()',5000);">

<div style="font-size: 20pt; left: 74px; width: 722px; color:
navy; font-family: Georgia;
position: absolute; top: 12px; height: 132px">
some content here</div>
<br />
<br />
<br />
<br />
<br />
<br />
<form name="aspnetForm" method="post" action="Default.aspx"
id="aspnetForm">
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT"
value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/
wEPDwUJLTI0MTM1MTE4D2QWAmYPZBYCAgMPFgIeBm9ubG9hZAUdU2V0VGltZW91dCgnc2xpZGVpdCgpJyw1MDAwKTtkZMeWyaebL7+2mGx5IlUTJG74K3K/" /</div>

<script type="text/javascript">
<!--
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
// -->
</script>


<script src="/Ruben/WebResource.axd?
d=4U6X6OcF978CdaNo3fWogA2&amp;t=633042420571718750" type="text/
javascript"></script>


<script src="/Ruben/WebResource.axd?
d=nm6ynZk2X7rH-6bHnDMszQ2&amp;t=633042420571718750" type="text/
javascript"></script>
<a href="#ctl00_Menu1_SkipLink"><img alt="Skip Navigation Links"
src="/Ruben/WebResource.axd?
d=L7v_eVgTP2teHMJYvWOWpQ2&amp;t=633042420571718750" width="0"
height="0" style="border-width:0px;" /></a><table id="ctl00_Menu1"
class="ctl00_Menu1_2" cellpadding="0" cellspacing="0" border="0"
style="left: 11px; position: absolute; top: 15px">
<tr onmouseover="Menu_HoverStatic(this)"
onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" title="Home"
id="ctl00_Menu1n0">
<td><table class="ctl00_Menu1_4" cellpadding="0" cellspacing="0"
border="0" width="100%">
<tr>
<td style="white-space:nowrap;width:100%;"><a class="ctl00_Menu1_1
ctl00_Menu1_3" href="default.aspx">Home</a></td>
</tr>
</table></td>
</tr><tr onmouseover="Menu_HoverStatic(this)"
onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)"
id="ctl00_Menu1n1">
<td><table class="ctl00_Menu1_4" cellpadding="0" cellspacing="0"
border="0" width="100%">
<tr>
<td style="white-space:nowrap;width:100%;"><a class="ctl00_Menu1_1
ctl00_Menu1_3" href="photos.aspx">Photos</a></td>
</tr>
</table></td>
</tr>
</table><a id="ctl00_Menu1_SkipLink"></a>
<div style="width:720px;height:400px; left: 77px; position:
absolute; top: 154px;">


<img id="ctl00_Content1_cool" src="medium.aspx?src=images/c1.jpg"
style="height:400px;width:400px;border-width:0px;WIDTH:400px;Height:
400px;filter:blendTrans(duration=3)" />

</div>


<script type="text/javascript">
<!--
var ctl00_Menu1_Data = new Object();
ctl00_Menu1_Data.disappearAfter = 500;
ctl00_Menu1_Data.horizontalOffset = 2;
ctl00_Menu1_Data.verticalOffset = 0;
ctl00_Menu1_Data.hoverClass = 'ctl00_Menu1_15';
ctl00_Menu1_Data.hoverHyperLinkClass = 'ctl00_Menu1_14';
ctl00_Menu1_Data.staticHoverClass = 'ctl00_Menu1_13';
ctl00_Menu1_Data.staticHoverHyperLinkClass = 'ctl00_Menu1_12';
// -->
</script>
</form>
</body>
</html>

<script type="text/javascript">

<!--
var step=1
var whichimage=1
//preload images
var image1=new Image()
image1.src="medium.aspx?src=images/c1.JPG"
var image2=new Image()
image2.src="medium.aspx?src=images/c2.JPG"
var image3=new Image()
image3.src="medium.aspx?src=images/c3.JPG"
var image4=new Image()
image4.src="medium.aspx?src=images/c4.JPG"
var image5=new Image()
image5.src="medium.aspx?src=images/c5.jpg"


function slideit(){
if (!document.images)
return
//If the browser is IE 4.x
if (document.all)
ctl00_Content1_cool.filters.blendTrans.apply()
document.images.ctl00_Content1_cool.src=eval("image"+step+".src")
//If the browser is IE 4.x
if (document.all)
ctl00_Content1_cool.filters.blendTrans.play()
whichimage=step
if (step<8)
step++
else
step=1
setTimeout("slideit()",5000)
}
//-->
</script>
 
I've got some javascript that works great in some old asp.net 1.0
inline code. I'm attempting to move the javascript to a masterpage
and use it in a content page.

I understand that this might result in control names changes in the
rendered page and I've hard coded the destination control
accordingly.
Click to expand...

Which is almost certainly your problem! Under no circumstances should you do
this... Instead, get ASP.NET to tell your JavaScript what the IDs of the
controls are.

E.g. if you have an <asp:TextBox> called MyTextBox, reference it like this
client-side:

var myTextBox = document.getElementById(' said:
But mainly my question is about troubleshooting javascript in general.
What tools do you use? is there a console of IE?
Click to expand...

<script type="text/javascript">
function myFunction()
{
debugger; // execution will break here
/*
rest of code
*/
}
</script>
 
to debug javascript in IE you can use visual studio. in IE you have to
enable debugging (off by default - see option). in visul studio enable
script debugging, or attach to IE running the javascript you wish to
debug. you probably want the IE dev toolbar so you can examine the dom.

firefox also has good debugging tools.

-- bruce (sqlwork.com)
I've got some javascript that works great in some old asp.net 1.0
inline code. I'm attempting to move the javascript to a masterpage
and use it in a content page.

I understand that this might result in control names changes in the
rendered page and I've hard coded the destination control
accordingly.

I'm looking at the rendered page and am not sure why i'm getting that
common Object expected message.

But mainly my question is about troubleshooting javascript in general.
What tools do you use? is there a console of IE?

I know this is not the javascript discussion group, but since i
suspect my issue might have to do with javascript on a master page,
used in a content page:

What it's suppose to do is display an image, and then do a slideshow
(blending) of 5 images. It only shows the first image and then chokes.

Thank you for any help!


My error: reads

Line 27 (which appears to be my body tag)
Char1
Error: object expected


Note I refer to : ctl00_Content1_cool which was not the original name
of the control on the content page which is "cool". This code (minus
that control name change) works fine before the master page asp.net
2.0 upgrade.


Rendered HTML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
Untitled Page
</title><style type="text/css">
.ctl00_Menu1_0 { background-
color:white;visibility:hidden;display:none;position:absolute;left:
0px;top:0px; }
.ctl00_Menu1_1 { color:#666666;font-family:Verdana;font-size:
0.8em;text-decoration:none; }
.ctl00_Menu1_2 { color:#666666;background-color:#E3EAEB;font-
family:Verdana;font-size:0.8em; }
.ctl00_Menu1_3 { }
.ctl00_Menu1_4 { padding:2px 5px 2px 5px; }
.ctl00_Menu1_5 { }
.ctl00_Menu1_6 { padding:2px 5px 2px 5px; }
.ctl00_Menu1_7 { background-color:#E3EAEB; }
.ctl00_Menu1_8 { }
.ctl00_Menu1_9 { background-color:#1C5E55; }
.ctl00_Menu1_10 { }
.ctl00_Menu1_11 { background-color:#1C5E55; }
.ctl00_Menu1_12 { color:White; }
.ctl00_Menu1_13 { color:White;background-color:#666666; }
.ctl00_Menu1_14 { color:White; }
.ctl00_Menu1_15 { color:White;background-color:#666666; }

</style></head>
<body id="ctl00_Body" onload="SetTimeout('slideit()',5000);">

<div style="font-size: 20pt; left: 74px; width: 722px; color:
navy; font-family: Georgia;
position: absolute; top: 12px; height: 132px">
some content here</div>
<br />
<br />
<br />
<br />
<br />
<br />
<form name="aspnetForm" method="post" action="Default.aspx"
id="aspnetForm">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT"
value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/
wEPDwUJLTI0MTM1MTE4D2QWAmYPZBYCAgMPFgIeBm9ubG9hZAUdU2V0VGltZW91dCgnc2xpZGVpdCgpJyw1MDAwKTtkZMeWyaebL7+2mGx5IlUTJG74K3K/" /
</div>

<script type="text/javascript">
<!--
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
// -->
</script>


<script src="/Ruben/WebResource.axd?
d=4U6X6OcF978CdaNo3fWogA2&amp;t=633042420571718750" type="text/
javascript"></script>


<script src="/Ruben/WebResource.axd?
d=nm6ynZk2X7rH-6bHnDMszQ2&amp;t=633042420571718750" type="text/
javascript"></script>
<a href="#ctl00_Menu1_SkipLink"><img alt="Skip Navigation Links"
src="/Ruben/WebResource.axd?
d=L7v_eVgTP2teHMJYvWOWpQ2&amp;t=633042420571718750" width="0"
height="0" style="border-width:0px;" /></a><table id="ctl00_Menu1"
class="ctl00_Menu1_2" cellpadding="0" cellspacing="0" border="0"
style="left: 11px; position: absolute; top: 15px">
<tr onmouseover="Menu_HoverStatic(this)"
onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" title="Home"
id="ctl00_Menu1n0">
<td><table class="ctl00_Menu1_4" cellpadding="0" cellspacing="0"
border="0" width="100%">
<tr>
<td style="white-space:nowrap;width:100%;"><a class="ctl00_Menu1_1
ctl00_Menu1_3" href="default.aspx">Home</a></td>
</tr>
</table></td>
</tr><tr onmouseover="Menu_HoverStatic(this)"
onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)"
id="ctl00_Menu1n1">
<td><table class="ctl00_Menu1_4" cellpadding="0" cellspacing="0"
border="0" width="100%">
<tr>
<td style="white-space:nowrap;width:100%;"><a class="ctl00_Menu1_1
ctl00_Menu1_3" href="photos.aspx">Photos</a></td>
</tr>
</table></td>
</tr>
</table><a id="ctl00_Menu1_SkipLink"></a>
<div style="width:720px;height:400px; left: 77px; position:
absolute; top: 154px;">


<img id="ctl00_Content1_cool" src="medium.aspx?src=images/c1.jpg"
style="height:400px;width:400px;border-width:0px;WIDTH:400px;Height:
400px;filter:blendTrans(duration=3)" />

</div>


<script type="text/javascript">
<!--
var ctl00_Menu1_Data = new Object();
ctl00_Menu1_Data.disappearAfter = 500;
ctl00_Menu1_Data.horizontalOffset = 2;
ctl00_Menu1_Data.verticalOffset = 0;
ctl00_Menu1_Data.hoverClass = 'ctl00_Menu1_15';
ctl00_Menu1_Data.hoverHyperLinkClass = 'ctl00_Menu1_14';
ctl00_Menu1_Data.staticHoverClass = 'ctl00_Menu1_13';
ctl00_Menu1_Data.staticHoverHyperLinkClass = 'ctl00_Menu1_12';
// -->
</script>
</form>
</body>
</html>

<script type="text/javascript">

<!--
var step=1
var whichimage=1
//preload images
var image1=new Image()
image1.src="medium.aspx?src=images/c1.JPG"
var image2=new Image()
image2.src="medium.aspx?src=images/c2.JPG"
var image3=new Image()
image3.src="medium.aspx?src=images/c3.JPG"
var image4=new Image()
image4.src="medium.aspx?src=images/c4.JPG"
var image5=new Image()
image5.src="medium.aspx?src=images/c5.jpg"


function slideit(){
if (!document.images)
return
//If the browser is IE 4.x
if (document.all)
ctl00_Content1_cool.filters.blendTrans.apply()
document.images.ctl00_Content1_cool.src=eval("image"+step+".src")
//If the browser is IE 4.x
if (document.all)
ctl00_Content1_cool.filters.blendTrans.play()
whichimage=step
if (step<8)
step++
else
step=1
setTimeout("slideit()",5000)
}
//-->
</script>
Click to expand...
 
Back
Top