Include .js in asp

**Rickkap** · 05-28-2010, 11:04 AM

Hi all

This is my first post on here and i've done some research in order to find a solution, but i feel this question relates only to my coding.

Please bear with me as i'm only a novice programmer!!!

I have an asp scroller with includes some javascript coding, which i would like to use on different pages. I thought the proper way would be to split the JS into a seperate .js file and the call it when needed.

I've tried this but for some reason i can't get it to work and not been very javascript orientated i'm having problems.

Here is the complete coding :

<%
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("data/news.mdb"))
set rs = Server.CreateObject("ADODB.recordset")

rs.Open "SELECT message_date, message FROM news", conn

If rs.EOF Then
wholemessage ="No news is good news"
Else

wholemessage = rs.GetString(,,"<br> ","<br>"," ")

rs.close
conn.close
set rs = Nothing
set conn = Nothing
End if
%>

<html>
<head>
<title>Scroller</title>

<SCRIPT LANGUAGE="JavaScript">

//scroller width
var swidth=190;

//scroller height
var sheight=150;

//background color
var sbcolor="#ffffff";

//scroller's speed
var sspeed=2;
var restart=sspeed;
rspeed=sspeed;

wholemessage ='<%=wholemessage%>';

//-- end Parameters and message -->

function goup()
{
if(sspeed!=rspeed*8)
{
sspeed=sspeed*2;restart=sspeed;
}
}

function start()
{
if(document.getElementById)ns6marquee(document.get ElementById('slider'));
else
if(document.all)iemarquee(slider);
else
if(document.layers)ns4marquee(document.slider1.doc ument.slider2);
}
function iemarquee(whichdiv){iediv=eval(whichdiv);
iediv.style.pixelTop=sheight;
iediv.innerHTML=wholemessage;
sizeup=iediv.offsetHeight;
ieslide();
}
function ieslide()
{
if(iediv.style.pixelTop>=sizeup*(-1)){iediv.style.pixelTop-=sspeed;
setTimeout("ieslide()",100);
}
else
{
iediv.style.pixelTop=sheight;
ieslide();
}
}
function ns4marquee(whichlayer)
{
ns4layer=eval(whichlayer);
ns4layer.top=sheight;
ns4layer.document.write(wholemessage);
ns4layer.document.close();
sizeup=ns4layer.document.height;ns4slide();
}
function ns4slide()
{
if(ns4layer.top>=sizeup*(-1))
{
ns4layer.top-=sspeed;
setTimeout("ns4slide()",100);
}
else
{
ns4layer.top=sheight;ns4slide();
}
}
function ns6marquee(whichdiv)
{
ns6div=eval(whichdiv);
ns6div.style.top=sheight;
ns6div.innerHTML=wholemessage;
sizeup=ns6div.offsetHeight;
ns6slide();
}
function ns6slide()
{
if(parseInt(ns6div.style.top)>=sizeup*(-1))
{
ns6div.style.top=parseInt(ns6div.style.top)-sspeed;
setTimeout("ns6slide()",100);
}
else{ns6div.style.top=sheight;ns6slide();
}
}
</script>

</head>

<body onload="start();">

<script language="JavaScript">

document.write('<table border="1" align="center"><tr><td width='+swidth+'>');if (document.getElementById || document.all)
{
document.write('<span style="height:'+sheight+';"><div style="position:relative;overflow:hidden;width:'+swidth+' ;height:'+sheight+';clip:rect(0 '+swidth+' '+sheight+' 0);background-color:'+sbcolor+';" onMouseover="sspeed=0;" onMouseout="sspeed=rspeed"><div id="slider" style="position:relative;width:'+swidth+';"></div></div></span>')
}
</script>
</td>
</tr>
</table>
</body>
</html>

The highlighted blue area is what i would like in a seperate .js file.

I do hope someone might be able to help me with this.

Kind regards

Rick

**JPnyc** · 05-28-2010, 04:22 PM

I don't see any highlighted blue area, but if you just copy the JS code put it into a separate file and include it on your page like this:

<script type="text/javascript" src="pathToFile.js"></script>

Should be fine

**Rickkap** · 05-28-2010, 06:20 PM

Hi

Thanks for getting back to me.

Sorry forgot to highlight the coding.

The blue area should be between <SCRIPT LANGUAGE="JavaScript"> and </script> at the top of the coding.

I have tried removing this part of the code and replacing it with <script type="text/javascript" src="pathToFile.js"></script> but it doesn't work!!!

Is there anything else i can try???

Kind regards

Rick

**JPnyc** · 05-28-2010, 06:38 PM

Copy everything between the script tags, but not the script tags themselves. Paste it into notepad and save it as whatever name you like but with a.JS extension. Then you reference it in the manner I posted.

**Rickkap** · 05-29-2010, 06:40 AM

ok

Again i've tried this, but it's not working!!!

I think the main problem is because i'm trying to read from a database. This part is not being displayed. The var wholemessage has not value.

The actual .js file is loading but without reading from the database!!!

Ive tried to change the var wholemessage to Session("wholemessage") in the .js file but i think it's because it reads the .js file first before reading information from the database, is this correct??

I've then changed the var wholemessage to wholemessage = "hello everyone"; in the .js file and every thing works ok!!!

Is there a way of either reading the database via the .js so the the var wholemessage has a value, or making the .asp file read the contents of the database first before .js again this way the var wholemessage will have a value?????

Here is the .js file

//scroller width
var swidth=190;

//scroller height
var sheight=150;

//background color
var sbcolor="#ffffff";

//scroller's speed
var sspeed=2;
var restart=sspeed;
rspeed=sspeed;

wholemessage ='<%=wholemessage%>';

//-- end Parameters and message -->

function goup()
{
if(sspeed!=rspeed*8)
{
sspeed=sspeed*2;restart=sspeed;
}
}

function start()
{
if(document.getElementById)ns6marquee(document.getElementById('slider'));
else
if(document.all)iemarquee(slider);
else
if(document.layers)ns4marquee(document.slider1.document.slider2);
}
function iemarquee(whichdiv){iediv=eval(whichdiv);
iediv.style.pixelTop=sheight;
iediv.innerHTML=wholemessage;
sizeup=iediv.offsetHeight;
ieslide();
}
function ieslide()
{
if(iediv.style.pixelTop>=sizeup*(-1)){iediv.style.pixelTop-=sspeed;
setTimeout("ieslide()",100);
}
else
{
iediv.style.pixelTop=sheight;
ieslide();
}
}
function ns4marquee(whichlayer)
{
ns4layer=eval(whichlayer);
ns4layer.top=sheight;
ns4layer.document.write(wholemessage);
ns4layer.document.close();
sizeup=ns4layer.document.height;ns4slide();
}
function ns4slide()
{
if(ns4layer.top>=sizeup*(-1))
{
ns4layer.top-=sspeed;
setTimeout("ns4slide()",100);
}
else
{
ns4layer.top=sheight;ns4slide();
}
}
function ns6marquee(whichdiv)
{
ns6div=eval(whichdiv);
ns6div.style.top=sheight;
ns6div.innerHTML=wholemessage;
sizeup=ns6div.offsetHeight;
ns6slide();
}
function ns6slide()
{
if(parseInt(ns6div.style.top)>=sizeup*(-1))
{
ns6div.style.top=parseInt(ns6div.style.top)-sspeed;
setTimeout("ns6slide()",100);
}
else{ns6div.style.top=sheight;ns6slide();
}
}

And here is the .asp file

<%
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("data/news.mdb"))
set rs = Server.CreateObject("ADODB.recordset")

rs.Open "SELECT message_date, message FROM news", conn

If rs.EOF Then
wholemessage ="No news is good news"
Else

wholemessage = rs.GetString(,,"<br> ","<br>"," ")

rs.close
conn.close
set rs = Nothing
set conn = Nothing
End if
%>

<html>
<head>
<title>Scroller</title>
<script type="text/javascript" src="news.js"></script>
</head>

<body onload="start();">

<script language="JavaScript">

document.write('<table border="1" align="center"><tr><td width='+swidth+'>');if (document.getElementById || document.all)
{
document.write('<span style="height:'+sheight+';"><div style="position:relative;overflow:hidden;width:'+swidth+';height:'+sheight+';clip:rect(0 '+swidth+' '+sheight+' 0);background-color:'+sbcolor+';" onMouseover="sspeed=0;" onMouseout="sspeed=rspeed"><div id="slider" style="position:relative;width:'+swidth+';"></div></div></span>')
}
</script>
</td>
</tr>
</table>
</body>
</html>

Kind regards

Rick

**JPnyc** · 05-29-2010, 08:05 AM

Sorry, I didn't realize that's what you were trying to do. No, JavaScript cannot read from a database. That would have to be done with the ASP, in which case you would not be able to put the JavaScript into a remote file. It would need to be embedded in the page.

**tkorsano** · 05-31-2010, 01:16 PM

hi there,

you need

wholemessage = '<= an.asp.session.variable>';

there is more than one way to accomplish this and still have a .js file.

for example, make your wholemessage variable the return value of a function, like this:

//whole message declared as a global variable like you did
wholemessage = '';

function WholeMessage(message_parameter) {
wholemessage = message_parameter;
}

my point is that in your asp or aspx web page, you can call this function like
for a button:

onclick='return WholeMessage(<%= session("my_variable")>);'
onblur='return WholeMessage(<%= session("my_variable")>);'

or from body tag:

onload='return WholeMessage(<%= session("my_variable")>);'

you can also write your own javascript class and make wholemessage a property. next, assign to this property your session variable from your asp or aspx web page during an event.

function myClass(myParameter) {
this.wholemessage = myParameter;
}

later in your asp or aspx web file,

cls = new myClass(<%=session("my_variable")%>);
document.write(cls.wholemessage);

which needs to happen in an event like onclick, onfocus, onload, etc.

i hope this sheds some lights into making you reuse later this .js file,

tonci korsano "a supercomputer is to a computer, what superman is to a man. wake up and smell power!"

**Rickkap** · 05-31-2010, 07:01 PM

Thank you for your reply

As i mentioned in my first post that i'm a novice programmer with very little JS experience.

I included in scroller.js the lines
//whole message declared as a global variable like you did
wholemessage = '';

function WholeMessage(message_parameter)
{
wholemessage = message_parameter;
}

And in news.asp i included the lines

<script type="text/javascript" src="scroller.js"></script>
</head>

<body>

<script language="JavaScript">
onclick='return WholeMessage(<%=Session("wholemessage")%>);'
onblur='return WholeMessage(<%=Session("wholemessage")%>);'

This isn't bring up and error's on loading but failed to display the news from the database??

Please help!!!

Rick

**tkorsano** · 06-01-2010, 01:11 PM

hi again,

let's change your javascript coding a little.
you have a body tag, maybe as simple as <body>, and by the end of your document </body>.
well, do the following:

<body onload='return WholeMessage('<%=Session("wholemessage")%>');'>

onload is an event, that in visual studio is visible through intellisense.
this means that when the body of your asp or asp.net page loads, it will run that javascript function.
i also recommend firebug for firefox as a javascript debugger.
you can activate internet explorer's javascript debugger in advanced options.
sometimes, a javascript script runs well in firefox and not in internet explorer or viceversa.

as far as i can see, the biggest problem you have with

onload='return WholeMessage('<%=Session("wholemessage")%>');'

is figuring out quotes and double-quotes, and i say this because you are sending a string, and at the same time you need double quotes for your session variable.

if this quotes give you an extremely hard time, before you need -wholemessage- do this in asp or asp.net

response.write("<script>return WholeMessage('" + <%=Session("wholemessage")%> + "');<script>")

again, be careful with these quotes and double-quotes.

i wish you luck,

tonci korsano.

Thread: Include .js in asp

Thread Tools

Display

Include .js in asp

you can still use and reuse your .js file

body onload event

Similar Threads

Can JavaScript files be included into ASP scripts using <- -! include directive

Include html or text file in ASP

Dunno how to include file like ASP does.

how do I use include files in ASP.net ( like ASP)

how do i include java applet in ASP?

Posting Permissions