AJAX returning Javascript functions - javascript

My AJAX returns a block of code in JS. I have tried converting this to a function that is then called AFTER the AJAX request returns, but for some reason in my FireBug console I am being told the function doesn't exist. The AJAX returns a block of JS and sets it into a div called "content". However, these functions do not appear to register and aren't called. Even when they aren't functions and are standard statements that would otherwise execute they still do nothing!
Absolutely everything is in place and works perfectly except this final part where the returned JS code doesn't execute.
Clearly, the JS code block isn't inside the <head> element, however, I am sure I've managed to execute JS code outside of that element before.
Is there anything I am doing majorly wrong, and is there a work around? The JavaScript code block edits the localStorage and so I cannot use another language instead, the code block is also generated using PHP and is dynamic as it changes variables depending on user input.

https://stackoverflow.com/a/10073403/2195574
Found my answer here! Simply added an id to the script and executed it that way with eval(). Looked at the default drop downs in DW and id wasn't among them otherwise I'd have tried this prior to posting!

Related

Inspecting console.log variables in Chrome

As a thought, i would like to know if is possible to inspect for log properties of any variable in the chrome or any other browsers within the console mode. As i already know that you can already inspect the DOM in inspector element and you can go through debugging mode also. I want to demonstrate my point and why i and most novice would benefit this.
So as you can see in the picture below:
So as you can see i am trying to access some element of Array[15] but in the end it always giving me undefined. It nice just to test out some code before recompiling it again which takes time. Plus sometime you don't always knows enough that the function you are calling in JS is compatible with what you trying to achieve.
Put your entire code inside:
$(document).ready (function (){
//Paste your code here
});
The whole point is you are trying to access an element in the DOM before it exists.
When your trying to access the class the item doesnot exist.
Alternative:
Move your script below the elements in the html.
This is a very generic solution I gave without seeing the code. Request you to post the code as well.
Hope it helps.
You need to add a debugger where you are outputting your array. It seems to me you are trying to access the variable after execution is over, so the variable value is lost, as it goes out of scope. When execution stops at the debugger, you can console.log your variable and properties. At that point the variable will be in scope.

What is wrong with executing the JavaScript function at the end of the HTML instead of using body onload?

This is about calling the initialize function for the Google Maps API. I would prefer to call it at the end of the HTML instead of putting it in the body onload. It appears to be working, but is there anything wrong with this approach?
The Google API code I am referring to can be viewed at Place Autocomplete Address Form.
This is not a duplicate of window.onload vs <body onload=""/>.
Or this closed one, Unobtrusive JavaScript onload function.
It is closest to this one: Initializing JS components at the end of HTML or on "onload"?
However, my question is not generic.
That's just personal preference. Both ways work fine.
They probably used the onload handler because it appears to be more foolproof.
If the code was at the end of the file, some people might copy it and happily edit around without fully understanding why it is written at the end of the file and then later on shoot out a bunch of posts asking why their code isn't working.

Cant get .innerHTML to work

I am working with ruby on rails and I want to test some things out.
I have used this simple code to change the innerHTML of my body:
document.body.innerHTML = "Work will you?";
It doesn't bring any results.
I know my javascript file works correctly because i tested it with the: alert() function
When i put the document.body.innerHTML into my file it breaks the javascript (the alert no longer works)
Anybody knows whats could cause this??
You must be running your code from within the <head> tag. document.body doesn't exist at that point. You have to wait for the DOM to be ready. You can do that using something like jQuery's $(document).ready() http://jsfiddle.net/L83mL/
Credit to https://stackoverflow.com/users/1013842/david and https://stackoverflow.com/users/400654/kevin-b

JQuery - Remove tag Script

I need to remove two <script> tags from a page dynamically, at the document ready.
Every tag has its own id;
I've tried to insert in the code:
$("#idPrimoScript").remove();
$("#idSecondoScript").remove();
but nothing happens...
Some ideas? Thanks
As I can understand from your question, you want to remove (actually disable) the scripts included in your 2 script tags.
a work around I usually used to make in these situations is to introduce a variable which will act as a flag or a passing signal.
let's say that I will create a global variable which will be the flage I will be using:
var enableMySpecialScript = true
as you can see, I initially set the value of this flag to true, and whenever I need to disable the special script inside my page, I set this flag to false, then inside my script file, i always check for the flag's value,so when it's only "true", the script will execute, meaning that when it's false the script will not run, which is exactly what you are asking for.
This way you don't have to mess up with removing stuff or altering functions, and from my experience with this solution, it's a clean and debuggable one :)
Apparently (having not tried this myself beyond a simple proof script) the way to do this is to create another function with the same name.
See:
How to override a function in another javascript file?
JavaScript: Overriding alert()
Override jQuery functions
Overriding a function in jQuery plugin

Calling js function in external js file

I'm trying to call a simple function with alert but it wont work when i try call the function (contained in an external js file) from my html page.
I have a import and the call is very simple. Any suggestions?
<head>
<script src="/js/jsFunctions.js" type="text/javascript"></script>
In my code I call
<a href="javascript:displayAlertText('someText');">
Inside the js I have some jquery followed by a function
function displayAlertText(someText)
{
alert('alert' + someText);
}
What you are doing looks like it should work. The problem is likely elsewhere.
Hrefs with "Javascript:" prefixes are really rather horrible. Instead, try rewriting that as:
<a href="#" onclick="displayAlertText('someText'); return false;">
Beyond that (which I don't think would actually be causing it), you've committed the cardinal sin of saying "It didn't work". Did you get any Javascript errors in the console? I suspect you would have, unless a valid function really was called.
Also, try calling the JS function explicitly from within a <script> block on your page, to see at what point it's failing.
Double-check as well that the external file really has been loaded at the time you click on the link - perhaps put a line at the bottom of the external script file to help check this, such as
alert('External file loaded.');
EDIT (based on comment): OK, so we've established you can call the method from "normal" JavaScript on your page. This means that the problem lies with the way that you're trying to call the script from your hyperlink.
Have you passed your HTML through a validator? If the syntax is invalid, then user agents can interpret it however they want, including ignoring it completely.
If the HTML does validate then at this point it might be useful to post a link to your full HTML, so that others can look over it and see where the problem lies. It's possibly something like another function overriding the onclick event for the link, and so your event handler gets lost.
In pure jQuery you would do this like:
$(document).ready(function(){
$('a').click(function(){
alert('here');
})
})
try this instead...
<a href="#" onclick="displayAlertText('someText');">
If that does not help, I would start making sure that your javascript file is loading correctly and doesn't contains some simple syntax error somewhere. View your page with Firebug on in Firefox and look for warnings and errors.
You mentioned jQuery. Is the function standalone or inside a jQuery object (i.e. wrapped inside another function)? This makes difference.
Apart from this problem, the way you invoke the function isn't clean. Move it to the onclick attribute or better make use of jQuery.

Categories

Resources