Javascript error - javascript

I am facing a error in javascript....
when the javascript function calling it is not working but if i set a alert('someting'); within the function then the script is running but if i comment off the alert within the script,
is not working.
what is the solution.......

put you code in try.. catch block and check is there any exception
try
{
//Run some code here
}
catch(err)
{
//Handle errors here
alert(err);
}

Try putting your code in load event:
window.onload = function(){
// your code...
};
Or put your js code at the end of the page.

if you're running with firefox, you won't know whether error occur in this function or not.

When you include the alert your most likely giving elements on the page you are loading time to appear which are probably required for you JS to actually run.
You could try using:
window.onload = function(){
//drop some code in here
}
or you could use jquery and wrap your code into a document.ready function like this:
$(document).ready(function() {
// put all your jQuery goodness in here.
});
You will need to load the latest version of jquery onto your page if you were to you this method.

Related

Catch plugin error javascript

I'm using a plugin and I want to handle the errors throws. In special occasions, my script gets error and the cause is a line of code in the plugin:
...
if (!element) {
throw new Error('Container does not exist: ' + container);
}
...
Plugin failing its function is not a problem, but it stops the rest of my script (which is a problem). So I wanted to use try{}catch(e){} to avoid my script stopping.
<script src="plugin.js"></script>
<script>
//This is my script structure
var object = $('#element');
doSomething();
function doSomething(){
try {
//Here I call the plugin function...
object.pluginAction(options);
} catch(err) {
//Here's the code I want to exec if plugin function fail
console.log('Plugin error: '+err);
}
</script>
But this doesn't work. I still get the error in chrome console and no log and script crashes... How can I handle that error without editing the plugin source?
Thank you

My $.extend does not seem to work when inside a function in javascript

I have the following code:
File 1:
$(document).ready(function () {
addDataTableExts();
}
File 2:
function addDataTableExts() {
$.extend($.fn.dataTableExt.oStdClasses, {
sWrapper: 'no-margin last-child'
}
}
This seems to work okay. I now tried to replace this with the following:
File 2:
(function () {
$.extend($.fn.dataTableExt.oStdClasses, {
sWrapper: 'no-margin last-child'
}
}
This doesn't work.
Is there some reason why it only seems to work if I do this the first way? I thought
that by changing the first line of File 2 then it would cause the code to get
executed without me calling it.
You changed the code from running in the ready event to running immediately. It seems that you are loading your datatable plugin after loading file 2, so the plugin doesn't exist yet when you try to use it.
If you put it back in the ready event, it should work:
File 2:
$(document).ready(function () {
$.extend($.fn.dataTableExt.oStdClasses, {
sWrapper: 'no-margin last-child'
}
});
Note: Events in jQuery are not exclusive, so you can have several ready event handlers in the same page without problems.
"I thought that by changing the first line of File 2 then it would cause the code to get executed without me calling it."
If you actually changed only the first line as shown then you've created a syntax error - you've added an opening ( without a closing ). But simply adding the closing ) won't cause the now anonymous function expression to be executed. If you want the code to get executed without being called from File 1 you need to add extra parentheses () on the end to actually invoke the function.
Also you had a missing closing ) after the } at the end of $.extend(..., though that was also a problem in the first version of your code (and also a problem with the document ready handler in File 1).
(function () {
$.extend($.fn.dataTableExt.oStdClasses, {
sWrapper: 'no-margin last-child'
}); // <-- add missing ); here
})(); // <-- add missing )(); here
But you don't need the containing function at all unless it also wraps other code that you don't show, because that $.extend() statement on its on doesn't have any deleterious effect on the global scope.
Finally, if you do need to run that $.extend() after the page is ready but don't want to have a dependency between your two files you can add a document ready handler directly in File 2. Multiple document ready handlers will all be executed.

js function not running on page load?

I apologize for this rather BASIC question, but I am at whits end here!
I have a javascript function that I want to run when the page loads... simple right? I have tried putting the function in doc readys, window readys, putting it before and after the main function, etc etc. NOTHING seems to work.
Code so far:
function calcme() {
DA FUNCTON
}
$(document).ready(function(){
calcme();
$("input").bind("keyup", calcme);
});
Please note... the keyup bind DOES work, but I need the calcme function to load on page load. Thoughts?
UPDATE: As per request, here is the full fiddle. http://jsfiddle.net/vpsSA/
Problem found: The calcme() function assumes it is called from the context of one of the inputs and uses this.value inside. So, when you call it without any arguments, it obviously fails. This can be solved by trigger the keyup of each of your inputs, instead of calling calcme() directly. See the fiddle below.
Working fiddle: http://jsfiddle.net/vpsSA/1/
In your ready() handler, the bind statement comes after the caclme() call. And as you mentioned the event binding worked. This means:
a) calcme() was definitely executed on load. There is no other way since you've mentioned that the binding statement which comes after the calcme() call worked as expected.
b) calcme() did not throw any JS errors - if so, it would have stopped at the error and the event binding would not have taken place. Maybe it threw a warning, which you'll be able to see in your JS console.
c) Since you haven't provided whats inside calcme(), we can't say for sure. But what it looks like is some sort of condition failure because of which you did not get the expected result from calcme() when running on load. Are you using anything inside calcme() thats initialized after running it on load. I would suggest putting in a debugger; statement as the first line in your ready() handler and tracing it in Firebug or Chrome.
try this:
function calcme() {
try {
//your code
}
catch(e) {
alert('error: ' + e);
}
}
if (typeof $ === undefined)) {
alert('not jquery');
}
$(document).ready(function(){
if (typeof calcme === undefined) {
alert('calcme not exist');
}
else {
calcme();
$("input").bind("keyup", calcme);
}
});

Javascript: Flash callback method produces error UNLESS alert() first?

Ok I have a flex app and I am adding a callback method like this:
private function init():void
{
ExternalInterface.addCallback( "playVideo", playVideo );
}
private function playVideo(videoSource:String):Boolean
{
videoDisplay.source = videoSource;
return true;
}
I am calling it with javascript like this:
function showVideo(video)
{
document.getElementById("video_overlay").style.display = "block";
//alert('no error');
document.getElementById("MiniMacVideoPreview").playVideo('https://www.kranichs.com/instore/minimac/videos/'+video);
}
I get this javascript error:
Object does not support this property
or method.
However if I uncomment and run the alert first. I get no error and it works perfectly.
My first thought was that the alert was buying time until the script could execute, so i tried to run the script inside a setTimeout() but did not work.
Any ideas?
Thanks!
I would try placing your code in something like jquery's
$(window).load function. I have a feeling that you are exactly right. By the time you close the alert, the dom and contents are finished loading and you can make your ExternalInterface callback method.
$(window).load
Otherwise, if you are using swfobject, you could do something like
swfobject.addLoadEvent(function() {
$("#swf_id").get(0).inited(callSomeOtherFunction());
});

JQuery error property for error handler

I'm just playing around for the first time with jQuery's ajax functionality. I wanted to add a function that could handle any errors. So, in one of my client javascript blocks, I added the following line:
<script type="text/javascript">
....
$.ajax({ error: function () { alert('boo'); } })
....
</script>
I expected that this would bind the error handler, so that when an error occurs, it would fire the anonymous function included.
What happens instead though, is that it immediately fires the function on page load, as soon as it parses this line of code.
What am I doing wrong? What is the proper way to bind the ajax error handler?
I'm not sure if I understood your question correctly, let me know if I've misunderstood.
I assume that you are trying to create a generic ajax call error handler? If that's the case, you have got the wrong idea.
Are you are just trying to bind the event handler? In this case, you are executing it.
I would recommend you read and check out the examples on these jQuery API reference docs:
API/1.3/Events
Ajax/jQuery.ajax
Also check out the post link provided by F.Aquino and this SO post: JavaScript Exception Handling.
This is could be helpful too: Handling AJAX Errors With jQuery.
You want to change the global settings. Check jQuery documentation.
$.ajaxSetup({
error: function () { alert('boo'); }
});

Categories