Including .asp that contains JavaScript code - javascript

I have two files A.asp and B.asp . The B.asp contains long javascript function that i want to use in A.asp. To include it, i used:
<!--#include file="lib/B/B.asp"-->
...in the head of A.asp I added:
<script>
function use(){
try{
test = new FPDF();
}catch(err){
document.write(err);
}
}
new FPDF() is an object reference to function FPDF() in B.asp file that looks like this:
<script>
function FPDF(){
var x;
this.x = function x(){
...
}
}
</script>
I get an error message: "ReferenceError: FPDF is not defined"... How can i properly do this?
What i want to do is to call the function in FPDF() like this:
<script>
function use(){
try{
test = new FPDF();
test.x(); //!!!!
}catch(err){
document.write(err);
}
}

Create an external javascript file like (myscript.js) and keep all your javascript code there.In a.asp reference that javascript file similary in b.asp reference the same javascript file.
Example --- in a.asp
<html>
<head></head>
<body>
<script src="/myscript.js"></script>
</body>
</html>
Simiraly in b.asp-----
<html>
<head></head>
<body>
<script src="/myscript.js"></script>
</body>
</html>

The "runat=server" instruction does precisely that, it tells the server to execute the code rather than serve it as is for the web browser to interpret. To give you a very simple example:
<html>
<head>
<script language="Jscript" runat="server">
var helloworld = "Hello World";
</script>
</head>
<body>
<%= helloworld %>
</body>
</html>
When this page is requested the server will send the following to the browser
<html>
<head>
</head>
<body>
Hello World
</body>
</html>
So the reason your onclick button doesn't work is that there's no JS on the page which it can see. If you want to send variables to a server side function then you'll need to post them to the page in a form and then use Request.Form to retrieve them.
I hope this helps

Related

html not responding to outside js file changes

//index.php
<head>
<script src="/js/test.js"></script>
<style></style>
</head>
<body>
<script>
callalert();
</script>
</body>
//test.js
function callalert() {
alert('Allertt');
}
eg: i change the fn completely to: callalert(msg) {
var msg;
alert(msg);
}
//and html to:
callalert('Hello!');
//and it wont change, it still says "Allertt"
Anything would be appreciated!
So recently i've tried to implement some javascript libraries to a webpage. But html wont call anything from other js files. I tried many things, calling simple functions from js files, and somtimes it works but when I delete the test, function the page will display the same result as the functions is still there. It will take a long time for it to respond to the changes of the js.
I even tried from diffrent devices.
Anything would be appreciated!
Edit: When i posted this i modified the function from 'Allertt' to 'Hello!'.
Now, that I checked after 5hrs the script is updated. Also, yes this is running online on a server.
I have prepared an example for you, which works perfectly:
HTML FILE
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
<script>
myFun();
</script>
</body>
</html>
External JS
function myFun(){
alert('test');
}
This calls myFun from external file, on every refresh, like it should.

Calling a javascript function in another javascript file without include

I have a question about javascript function flow. I am building a chrome extension where one javascript file creates a popup window using window.open. Based on the button selected in the popup, a variable is set and a function in the original javascript function should be called. But, it doesn't recognize that function from the original javascript file. I don't want to include file1 in file2's header, because other functions that I don't need would be called within file2. How do I handle this case?
A snippet of my code is the following:
in default_popup.html
<html
<head>
<script type="text/javascript" src="login.js"></script>
</head>
</html>
in login.js
function login() {
if (token === null) {
var url = chrome.extension.getURL('options.html');
window.open(url);
}
else {....}
function auth(url) {
............
}
//other functions here
in options.html
<html>
<head>
<script type="text/javascript" src="redirect.js"></script>
</head>
<body>
<button id="button1">Option1</button>
<button id="button2">Option2</button>
</body>
</html>
in redirect.js
var url;
document.getElementById('button1').onclick = function() {
url = 'url_one.com';
auth(url)
}
document.getElementById('button2').onclick = function() {
url = 'url_two.com';
auth(url);
}
Create a different JS file and you can call it common.js.
Transfer all the functions that needs to be accessed by both files there.
It is possible passing a function in the window reference, however chrome security setting may interfere that with local files because of the "same origin security principal", it works in other browsers on local, not sure in server pages and extension, so worth the test, follow the example:
html1:
<html>
<head>
<script type="text/javascript">
function test(){
var windowRef = window.open('test2.html');
windowRef['auth'] = function(){windowRef.document.write('property transferred')}
}//here you'll reference your auth function.
</script>
</head>
<body>
<input type="button" value="test" onclick="test()" >
</body>
</html>
html2:
<html>
<head>
<script type="text/javascript">
window['auth']() //the function to call, window.auth() should work too.
</script>
</head>
<body>
new window
</body>
</html>
The output will be a new window with "property transferred" in it.

How to call a function from javascript file and save the return value as global

Inside an HTML I have a script:
<script src="info.js" type="text/javascript"></script>
Inside info.js there is a function, lets say getInfo(key) which returns info.
How can I call a function located inside info.js from my html, so that I can use this variable inside the whole html document?
w3schools does not explain how to do this
Something like this:
var global; // global var
// js code...
// function
function myFunc(){
global = getInfo(key);
}
This might help you understand what's going on.
Let's say the code below is located inside info.js
function getSomething(){
return "something";
}
Now your HTML might look like this
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="info.js" type="text/javascript"></script>
</head>
<body>
<span id="mySpan"></span>
<script>
var myText = getSomething();
$('#mySpan').text(myText); //this uses jQuery so you'll need to include that
</script>
</body>
</html>
If I got you correctly, that you want to use that info in all your html file, here's my answer. Let me know if it helps or if you meant anything else, I'll think accordingly.
<html>
<head>
<script src="info.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var info = getInfo(key);
$('div.myinfo').html(info);
});
</script>
</head>
<div class="myinfo"></div>
</html>
You have the desired information in a javascript var and you can assign it as value to a input/select element or copy it as html to a div/td/p/h1 etc.
Just use it like this:
var info = getInfo(key);
As long as your calling script follows the method in info.js (and assuming the function is not private) it should be accessible in any script

What is wrong with this ajax code

Why does it not print "Hello" in my browser?
I have this code in a file called index.html
<!DOCTYPE html>
<html>
<head>
<title>Learning Ajax</title>
</head>
<body>
<h1>Learning Ajax</h1>
Load Ajax Text File
<script src="js/main.js"></script>
</body>
</html>
and also this code in a file called main.js
var message = "Hello";
$(function() {
var message = "Goodbye";
})();
alert(message);
its a self invoking anonymous function
Because of error: you use $, but there is no such function you have defined.
There's no AJAX in the code above. I recommend visiting jQuery's learning website and finding out what AJAX is all about and how it works: http://learn.jquery.com/ajax/.

Access JavaScript function in a programatically iFrame

I am trying to access a JavaScript function in a programatically created iFrame from a JavaScript function outside. I tried several ways, but was not successful. L ike window.frames['frameid'], etc.
Could you please provide me the correct syntax?
Yes, they are in the same domain. Actually, I am using ExtJS framework. I have a JSP inside an iFrame, I would like to call the javascript functions in the JSP from the a javascript function outside which is basically in a JS file.
Here's a more appropriate example based on your comments ;)
The main page
<html>
<head>
<title>Main Page</title>
</head>
<body>
<iframe src="iframe.html"></iframe>
<script>
var receiver = {
listen:function(msg){
alert(msg);
}
};
</script>
</body>
</html>
The iframe page: iframe.html, but can be a JSP with similar output
<html>
<head>
<title>iframe page</title>
<script src="external.js"></script>
</head>
<body>
<!-- some content here -->
<script>
externalFunction('hello', window);
</script>
</body>
</html>
And the JS file: external.js
function externalFunction(msg, w){
w.parent.receiver.listen(msg);
}
Place those 3 files in the same directory and open the main page.
You should get a popup with "hello".

Categories

Resources