I have been through 3 simple tutorials on how to get started with JavaScript using VS 2010 and they all unanimously describe the basic steps of creating a project through File, New, Project, ASP.NET Empty Web Application and then adding a JavaScript file through Add, New Item and finally adding an HTML page to the project.
The contents of my two files are as follows, as described in all basic tutorials, like a HelloWorld program:
JScrip1.js
function add(a, b)
{
return a + b;
}
HTMLPage1.htm
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My page title!</title>
<script type="text/javascript" src="JScript1.js" />
</head>
<body>
<script type="text/javascript" >
alert("Sum of 3 and 4 = " + add(3, 4));
</script>
</body>
</html>
In all the tutorials, upon doing a right-click on the HTML component and choosing View in Browser, it compiles and shows an alert window with the result (7) but mine only shows the tab with the title, and a pop-up message saying that ASP.NET Development Server is running on port 56044
The page that opens has the following URL: http://localhost:56044/HTMLPage1.htm
What am I missing? Why is my html page completely blank?
RESOLVED by changing my HTML script to the following, thanks to Jared
<!DOCTYPE html PUBLIC>
<html>
<head>
<title>My page title!</title>
<script type="text/javascript" src="JScript1.js"></script>
</head>
<body>
<script type="text/javascript" >
alert("Sum of 3 and 4 = " + add(3, 4));
</script>
</body>
</html>
The final answer was that <script type="text/javascript" src="JScript1.js" /> needed changed to <script type="text/javascript" src="JScript1.js"></script>. Script tags are not self closing. Apparently browsers don't complain and just silently ignore the tag. :P
Is your browser blocking popups? If so, you can change the alert() command to console.log() command. That should be safer. (Press F12 to open the browsers developer tools and look for a console tab to see the console.log() output)
FYI: The console log will also show javascript errors and such. Like if it can't load the JScrip1.js file.
Related
I am trying to make a very simple thing work:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<script src="js/test.js" type="text/js"></script>
<button onclick="test()" type="submit">Test</button>
</body>
</html>
With js/test.js being found by the browser and containing:
function test() {
alert("test");
}
When opening the page and clicking the button, nothing happens and I can see in the console:
Uncaught ReferenceError: test is not defined
at HTMLButtonElement.onclick (test:7)
I have tried to move the script import above or under the button, or in the header.
I have tried to use "window.setlocale = function" in my js file.
I have tried to put nothing in the test method.
I checked for errors with JSLint (there is no error).
When I check the source, I can see the js file and the browser opens it when I click on it.
The only way I can get the Javascript to work is to write it inline...
Maybe the issue is with my environment?
In order to run this, I use an Apache server, and it is configured to serve this on localhost:8077. I works fine so far.
I use Laravel 7.10, PHP 7.4... working fine. To run this I created a simple route, that shows the view (a simple index.blade.php) with the HTML content copy/pasted above. It displays fine on "http://localhost:8077/test", no problem.
I also tried to use the laravel notation
<script src="{{ asset('js/test.js') }}" type="text/js"></script>
but it gives the same result.
I also have the PHP debugbar (a Laravel plugin) active, and it does not show any error. The view is properly loaded and displayed.
Also, I use PHPStorm, and it does not detect any issue.
It's been 2 days and I cannot makes this seemingly extremely basic thing to work, please help me m(_ _)m
Your script type is wrong. Use application/javascript in your script element to make your javascript work - or better yet, remove the type attribute and let browsers auto-detect the type:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<script src="js/test.js" type="application/javascript"></script>
<button onclick="test()" type="submit">Test</button>
</body>
</html>
Without type attribute:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<script src="js/test.js"></script>
<button onclick="test()" type="submit">Test</button>
</body>
</html>
you can try to add script tag to header tag. like this
<head>
<script type="text/javascript" src="path/to/script.js"></script>
<!--other script and also external css included over here-->
</head>
Try removing the function name in js/test.js
function() {
alert("test");
}
Please add the js file as a reference in the header section of your core file. External referencing.
I'm trying to make a simple page with JS which generates Batch Scrips based on user input.
This is the prototype code and works fine with Chrome, but clicking on link with Firefox downloads the file as .txt (e.g.: file.bat.txt) and IE is completey unresponsive to the link
Where am i going wrong?
Any issues with "data:text/plain;base64,"?
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
</head>
<body>
click here
<script>
var bat_source = "#echo off\necho Hello world\npause";
document.querySelector("a").href = 'data:text/plain;base64,' + btoa(bat_source);
</script>
</body>
</html>
So classic problem, but having a horrible time on finding the actual cause. Typically when I see this error it's because the jQuery reference is after code requiring it, or back jQuery link, or jQuery conflict, etc... so far none of those appear to be the case. Unfortunately seeking out the solution to this problem has lead me to post after post of such cases. I'm sure my problem here is equally as simple, but over an hour of hunting, still no luck...
Edit: Additional information...
The solution file (which I've recreated multiple times trying to figure this out. Is a JavaScript Windows Store Blank App template and I'm doing this in Visual studio. The only references files is Windows Library for javascript 1.0, I have tried deleting this to test as well.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>HTML5 Canvas Template</title>
<style>
/* styles here */
</style>
</head>
<body>
<canvas id="myCanvas" width="500" height="500">
<p>Canvas not supported.</p>
</canvas>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var canvas = $("#myCanvas").get(0);
var context = canvas.getContext("2d");
function renderContent()
{
// we'll do our drawing here...
}
renderContent();
});
</script>
</body>
</html>
It's states that JQuery referred URL is not correct
Try this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
I tried everything listed above and nothing seems to work until I put this string
<script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>
in the head section of the HTML file. So here's how it looks:
<!DOCTYPE html>
<html>
<head>
<!-- jQuery Reference -->
<script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>some title</title>
</head>
<body>
...
And the js file is located at a level below in the folder 'scripts'.
Finally, the error is gone and what a relief!
In my case, the problem was that I was rendering my page over https but I was trying to request the JQuery file over http, which is blocked by many browsers for security reasons.
My fix was to change this...
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
...to this...
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
This causes the browser to download JQuery using the same protocol (http or https) as the page being rendered.
Some of my clients had this problem, because apparently they blocked loading Javascript from 3rd party sites. So now I always use the following code to include jQuery:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
window.jQuery ||
document.write('<script type="text/javascript" src="/js/jquery-1.9.1.min.js">\x3C/script>')
</script>
This makes sure, that even if my client blocks loading the Javascript file from the CDN domain, the client still downloads the file from my own server, which is not blocked by the browser.
Anover variant, in my case - I was forced to use proxy. So - IE11--> InternetOptions --> Connections-->LANSettings-Proxy Server--> UseProxyServer - should be checked.
Also check awailability of jQUery script source, my worked variant in VS2012 - -just like in top example
I was getting this same error code:
(Error: 'generateText' is undefined)
...on the code
var bodyText=["The....now."]
I discovered on my text-editor(Notepad++), when typing many lines of text in the directly above the variable bodyText, if I didn't hit return carriage (enter==>WordWrap is off) just kept typing w/o return carriage and let the editor adjust text it worked?
Must be in the settings of Notepad++??
So classic problem, but having a horrible time on finding the actual cause. Typically when I see this error it's because the jQuery reference is after code requiring it, or back jQuery link, or jQuery conflict, etc... so far none of those appear to be the case. Unfortunately seeking out the solution to this problem has lead me to post after post of such cases. I'm sure my problem here is equally as simple, but over an hour of hunting, still no luck...
Edit: Additional information...
The solution file (which I've recreated multiple times trying to figure this out. Is a JavaScript Windows Store Blank App template and I'm doing this in Visual studio. The only references files is Windows Library for javascript 1.0, I have tried deleting this to test as well.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>HTML5 Canvas Template</title>
<style>
/* styles here */
</style>
</head>
<body>
<canvas id="myCanvas" width="500" height="500">
<p>Canvas not supported.</p>
</canvas>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var canvas = $("#myCanvas").get(0);
var context = canvas.getContext("2d");
function renderContent()
{
// we'll do our drawing here...
}
renderContent();
});
</script>
</body>
</html>
It's states that JQuery referred URL is not correct
Try this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
I tried everything listed above and nothing seems to work until I put this string
<script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>
in the head section of the HTML file. So here's how it looks:
<!DOCTYPE html>
<html>
<head>
<!-- jQuery Reference -->
<script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>some title</title>
</head>
<body>
...
And the js file is located at a level below in the folder 'scripts'.
Finally, the error is gone and what a relief!
In my case, the problem was that I was rendering my page over https but I was trying to request the JQuery file over http, which is blocked by many browsers for security reasons.
My fix was to change this...
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
...to this...
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
This causes the browser to download JQuery using the same protocol (http or https) as the page being rendered.
Some of my clients had this problem, because apparently they blocked loading Javascript from 3rd party sites. So now I always use the following code to include jQuery:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
window.jQuery ||
document.write('<script type="text/javascript" src="/js/jquery-1.9.1.min.js">\x3C/script>')
</script>
This makes sure, that even if my client blocks loading the Javascript file from the CDN domain, the client still downloads the file from my own server, which is not blocked by the browser.
Anover variant, in my case - I was forced to use proxy. So - IE11--> InternetOptions --> Connections-->LANSettings-Proxy Server--> UseProxyServer - should be checked.
Also check awailability of jQUery script source, my worked variant in VS2012 - -just like in top example
I was getting this same error code:
(Error: 'generateText' is undefined)
...on the code
var bodyText=["The....now."]
I discovered on my text-editor(Notepad++), when typing many lines of text in the directly above the variable bodyText, if I didn't hit return carriage (enter==>WordWrap is off) just kept typing w/o return carriage and let the editor adjust text it worked?
Must be in the settings of Notepad++??
Following up from my solved [previous issue][1], I'm having trouble building a simple HTML Web resource containing some basic javascript, page is rendered correctly but script doesn't seem to work properly.
My HTML resource is very basic:
<html>
<head>
<script src="ClientGlobalContext.js.aspx" />
<script type="text/javascript" src="new_jquery_1.7.2.min" />
<script type="text/javascript">
function buttonClick() { alert('Yo !'); }
</script>
</head>
<body>
<input type="button" value="Test" onclick="javascript: buttonClick();" />
</body>
</html>
Although the page shows up fine, clicking the button yields The value of the property is null or undefined not a function object error like the functions wasn't there, but I checked via F12 console that the code is rendered correctly.
I also tried invoking the web resource via the direct url, in the form of
http://mycrmserver/myorg/WebResources/new_myResource
But (as I expected) the behavior of the page was the same.
I checked Google, I surfed a couple of other SO questions and MSDN and all state this is the right way to do it, what's wrong with my code ?
Other (not sure if useful) details:
If the F12 tool is open the error comes up as a SCRIPT5007 javascript runtime error in the console. If it's not, I get the usual script error notify popup if I browse to the webresource direct url, or nothing happens at all if I try to open the resource inside the CRM.
The CRM environment is updated to Rollup 3 (updating it is not an option unfortunately)
I'm using IE 9 (Remember: Dynamics CRM can't be used in non-IE browsers yet)
UPDATE
Shorthand tags confuse the CRM.
Basically this syntax sometimes gets messed up:
<script src="ClientGlobalContext.js.aspx" />
But this works perfectly:
<script src="ClientGlobalContext.js.aspx"></script>
Root cause is a missing script tag, despite the code you posted being correct.
CRM does some messing about with the HTML you post into the script editor window. What is rendered in the browser is this (note that the ClientGlobalContext.js.aspx tag is not closed in the same way as your pasted code):
<HTML><HEAD>
<SCRIPT src="ClientGlobalContext.js.aspx">
<script type="text/javascript" src="new_jquery_1.7.2.min" />
<script type="text/javascript">
function buttonClick() { alert('Yo !'); }
</SCRIPT>
<META charset=utf-8></HEAD>
<META charset=utf-8></HEAD>
<BODY><INPUT onclick=javascript:buttonClick(); value=Test type=button></BODY></HTML>
Resolution:
Add full "close" tags to each opening script tag (rather than using "/>").