How to call a function with parameters from another function that has parameters?

Question

Im using D3 and JS.

I have a function that creates buttons and one of the parameters is onClick which runs when the buttons is clicked (obviously).

For example:

simpleButton(imageURL, width, height, title, onClick){
.attr("xlink:href", imageUrl) //-original image
    .attr( "width", width) //-icon width
    .attr( "height", height) //-icon height
    .on("click", onClick)
    .append("svg:title")
    .text(title); //-give the button a title
}

Now one of my buttons I'm going to use to hide some shapes (i.e. set visibility:hidden).

So I have created another function to hide the selection, something like:

hideSelection(selection){
    selection.classed("hidden", true);
}

This function takes on one parameter so that I can pass through what I want to hide.

So for example what I thought would work looks like this:

simpleButton("\images\dog", 100, 100, "dog", hideSelection(dog));

Now, this does work, but it works straight away without me clicking. I know it's because I'm calling the hideSelection straight away because of the parenthesis-().

But my question is, how do I stop calling this function straight away when running it ? How do I run a function with parameters via another function that has parameters (if that makes any sense at all)?

ah I didn't know, but now I do :) Thanks

rekoDolph
– rekoDolph

2015-01-08 10:53:49 +00:00
Commented Jan 8, 2015 at 10:53 — rekoDolph
– rekoDolph, Commented Jan 8, 2015 at 10:53

joews · Accepted Answer · 2015-01-07 16:16:15Z

2

You should wrap it in an anonymous function:

simpleButton("\images\dog",100,100, "dog", function() {
  hideSelection(dog)
});

This function has access to the dog variable because it's a closure - a function that has access to the parent scope at the time it was created.

answered Jan 7, 2015 at 16:16

joews

30.4k11 gold badges82 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

rekoDolph Over a year ago

closures !! was reading about that last week, totally forgot. Thank you, all working perfectly :)) Ill choose this as the answer once it lets me

Rhumborl · Accepted Answer · 2015-01-07 16:18:21Z

2

You are indeed calling hideSelection(dog) immediately and passing the result of that to simpleButton - you need to pass a reference to a function. The easiest way to do that is to wrap it in another function:

simpleButton("\\images\\dog", 100, 100, "dog", function() {
    hideSelection(dog)
});

(P.S.You probably want to escape the \s in the image path too)

answered Jan 7, 2015 at 16:18

Rhumborl

16.7k4 gold badges41 silver badges47 bronze badges

1 Comment

rekoDolph Over a year ago

@joews beat you to it im afraid :L thank you though, understand it now :) and the link to the image was just an example, thanks again :)

Collectives™ on Stack Overflow

How to call a function with parameters from another function that has parameters?

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related