We Keep Coding

Javascript / jQuery basic function issue

I am trying to display a div on click. The function that is supposed to make the magic happen is:
$(document).ready(function showGogoasa() {
$('.gogoasa-newsletter').show();
});
Unfortunately, it does nothing. Which makes me scratch my head for hours as I have done small things like this in the past and they worked. I am trying to make this modification on the website of a client.
When I check the firebug console it says the following: ReferenceError: showGogoasa is not defined
I tried looking on Google for this kind of error but the similar cases had this kind of issue for not declaring a variable. Well, I do not have any variables.

I am trying to display a div on click.
Your code is running the function on a ready event and doesn't give the error you describe.
Presumably (it would have helped if you had provided a complete test case) you are also trying to bind the function as a click handler, but you can't do that because you have defined it using a function expression and not a function declaration (so it doesn't create a variable called showGogoasa outside of its own scope).
Define the function separately, then assign call it and bind it as a click event handler on the ready event.
$(document).ready(function ready_handler() {
function showGogoasa() { // Define it as a variable in the current scope
$('.gogoasa-newsletter').show();
}
showGogoasa(); // call it now
$("button").on("click", showGogoasa); // call it then
});
Well, I do not have any variables.
That's the problem :)
Functions are first class objects and when you say showGogoasa() that means "Get the value of showGogoasa and call it as a function".

Using jsfiddle or providing more code would have been helpful.
One issue is that you are missing the click event handler. For example when the user clicks on X then Y should happen/show. The following simple example may help you to see how it works:
http://jsfiddle.net/fionaredmond/1vbagj12/
$(document).ready(function(){
$("#showGogoasa").click(function(){
$(".gogoasa-newsletter").show();
});
});

$(document).ready(function() {
$('#idOfYourClickerElement').on('click', function(){
$('.gogoasa-newsletter').show();
});
});

Trouble with calling javascript function within another using D3

I'm learning to use D3.js for some visualization ideas I have and I'm running into something that is probably quite easy and perhaps solely a javascript thing.
I want to call a function from within another function. I have created a basic scatter plot and want to reload it with new data points. Here is the JSFiddle. I'm really quite stumped!
I think in it's simplest form it looks like this:
function firstFunction() {
var something;
}
function secondFunction() {
firstFunction();
}
But it seems to sometimes works sometimes not and can't figure out why.

What's happening is that, in jsfiddle, the default is to encapsulate everything in a function that runs on window load. The code looks like this: window.onload=function(){your stuff}
When you try to set the onload, the code structure is then structured like this:
function firstFunction(){
function secondFunction(){
do stuff
}
}
onload = secondFunction;
The issue is that secondFunction is not accessible outside the scope of firstFunction. This is called variable scoping, and coding would suck without it.
The way to solve this issue is to move your onload assignment to the javascript block. I'd recommend the built in d3 way of doing this: d3.select('button').on('click',newScatter); here I'm selecting the button and adding a click event handler. This works because there is only one button, but it would be better to give the button a class or id and use that in d3.select().
If you do that, your code will still not work, but that's because you delete the SVG element that's supposed to contain the scatter plot in newScatter() (this line: elem.parentNode.removeChild(elem);). The button, however, will successfully do what you told it to do and delete your scatter plot.
I've created a working version of your fiddle here.

How does this piece of code function?

I was looking over some code a few minutes ago and this confuses me.
$("nav a").mouseenter(function() {
audio.play();
});
I know '$' is jQuery for document.getElementById(""); and mouseEnter is an event handler for 'nav a' but how is the function assigned to the event? It doesn't have any assignment operator '='?
I don't know to much about jQuery right now as I'm trying to completely get JavaScript down. So when I went to modify the code to be pure JavaScript it doesn't seem to work...
document.getElementById("playAudio").onclick(function () {
audio.play();
});
I don't understand why? I figured it was the same code?...

mouseenter is a function. Similar to:
var element = {elm: document.getElementById('test')};
element.mouseenter = function(func) {
element['elm'].addEventListener('mouseenter', func);
};
element.mouseenter(function() {});

The function is passed, and the function is anonymous (doesn't have a name).
You could also do:
function foo() { audio.play(); }
$('nav a').mouseenter(foo);

The dollar symbol is not just limited to getElementById(), it the the jQuery object and in your case, is calling the nav element then grabbing the a tags within the nav. After grabbing the element(s), it then attaches the event anonymously, allowing the function to run whenever the event is fired.

You're passing a function object (created with a function expression) to jQuery.mouseenter, and jQuery takes it from there.
FYI, part of what you're trying to get down here is the Document Object Model (DOM). You're trying to make the code pure JavaScript + DOM API. It's good to learn the fundamentals of both JS and the DOM, but be aware that jQuery smoothes out many inconsistencies in browsers' implementations of the DOM, such as registering event listeners.

jQuery swfobject AS3 ExternalInterface not working

As you can tell by the title, I am having some trouble with AS3 ExternalInterface and jQuery / swfobject.
ActionScript :
if (ExternalInterface.available) {
ExternalInterface.call('init');
ExternalInterface.addCallback('testFunc', returnFunc)
}
function returnFunc():void {
ExternalInterface.call('alertFunc');
}
jQuery:
function init() {
alert('init');
$('#swf_object').testFunc();
}
function alertFunc() {
alert('finished');
}
Obviously that implies the object has the id 'swf_object'
I have also tried getting the object by the following:
document.getElementById('swf_object')
document.getElementById('swf_object')[0]
$('#swf_object')[0]
To no avail.
It's giving the first alert ('init') but then not doing the last one. I'm completely baffled and hope someone can point out my mistakes! (there's bound to be a massively obvious one somewhere)

The problem is that you're calling out to the JavaScript init() which calls the Flash testFunc() before you're made testFunc available (which happens only after the call out to init() completes).
To fix this, simply swap the two lines to this:
ExternalInterface.addCallback('testFunc', returnFunc); // Needs to be available before it's used
ExternalInterface.call('init');
As for getting the Flash object in JavaScript, you can do it directly with document.getElementById('swf_object'), but it's possible using jQuery too:
var swf = $('#swf_object').get(0); // Get the actual object without the jQuery wrapper

How to call a function(only one not all) inside a plugin from outside in jQuery?

I need to call a function i.e.
SFProductFilter.prototype.filter = function () {
//Some Code which also interact with some of other plugin functions
}
From outside of the plugin. Is it possible if yes how?

unless I'm totally missing something:
SFProductFilter.prototype.filter()