multiple functions onClick not working reactJs

Question

I am trying to call two multiple functions onClick.It doesn't work when i try to do it.But it works in single function.these are the two functions.

   //first function
saveValue = (e) => {
    // console.log('savecategory', e.target.innerHTML);

    this.setState({
        category: e.target.innerHTML
    }, this.makeAxiosRequest);

};

//second function

goToLastPage = () => {
    const {currentPage, pages, end} = this.state;
};

This is the onClick event i am trying to work.

<button   onclick={()=>{this.saveValue();this.goToLastPage()}}>Residence</button>

But it doesn't work.It only works if i call it as a single function like this.

<button onClick={this.saveValue}>Residence</button>

<button onClick={this.goToLastPage}>Residence</button>

How can i make it work?

Possible duplicate of [Call multiple functions onClick ReactJS](https://stackoverflow.com/questions/26069238/call-multiple-functions-onclick-reactjs) — thmsdnnr, Jun 14 '19 at 18:56
It would be nice if you expanded on "it doesn't work" do you get an error? are your functions called at all? — Andrew Lohr, Jun 14 '19 at 18:58
i don't get any error.this functions do not execute i call multiple functions. — ariful Islam, Jun 14 '19 at 19:02

m51 · Answer 1 · 2019-06-14T19:00:36.503

1

saveValue function needs event argument. So try this:

<button onClick={(e) => { this.saveValue(e); this.goToLastPage(); }}>Residence</button>

Also, instead onclick should be onClick

edited Jun 14 '19 at 19:00

answered Jun 14 '19 at 18:55

m51

1,950
16
25

score 1 · Answer 2 · answered Jun 14 '19 at 19:01

1

It's because in your first example you typed onclick instead of onClick. Notice the capitalization of C. React event handlers are camel-cased.

answered Jun 14 '19 at 19:01

The Qodesmith

3,205
4
32
45

1

I did that part right on my code.sorry for that unwanted error here.The problem was with event argument. First reply answers my questions.Thank you – ariful Islam Jun 14 '19 at 19:11

score 1 · Answer 3 · answered Jun 14 '19 at 19:14

You need to use onClick instead of onclick. This is a difference in HTML and Reactjs.

For more details follow this link: https://reactjs.org/docs/handling-events.html

Also check this out: Call multiple functions onClick ReactJS

<button onClick={()=>{this.saveValue();this.goToLastPage()}}>Residence</button>

multiple functions onClick not working reactJs

3 Answers3