call other function in toaster onShown event

Question

I have below code to for toaster

    toastr.success("<br /><br /><button type='button' id='confirmationRevertYes' class='btn clear'>Yes</button>",'delete item?',
      {
          closeButton: false,
          allowHtml: true,
          onShown: function (toast) {
              $("#confirmationRevertYes").click(function(){
                hidepanel(); // not working
                this.hidepanel(); // not working
              });
            }
      });

I have one function outside

hidepanel(){
}

When trying to call inside toaster onShown method it throws error

hidepanel does not exist on type 'HTMLElement'.

How can this work?

Thanks

What I think that happen is you are using some third party component. What will happen if you use a third party component is that `this` will be used inside that component. So to solve this you can put this `let me = this` above the toastr and then `me.hidepanel()` — Swoox, Sep 26 '18 at 12:20
You're welcome :) Wasn't sure about the third party thing but I know this solution will work. — Swoox, Sep 26 '18 at 12:47

score 2 · Answer 1 · answered Sep 26 '18 at 12:01

2

Assuming you have a function call hidepanel, use the => expression

toastr.success("<br /><br /><button type='button' id='confirmationRevertYes' class='btn clear'>Yes</button>",'delete item?',
  {
      closeButton: false,
      allowHtml: true,
      onShown: (toast) => {
          $("#confirmationRevertYes").click(() =>{ 
            this.hidepanel();  
          });
        }
  });

answered Sep 26 '18 at 12:01

Sachila Ranawaka

39,756
7
56
80

it is not showing error on compile time, but when clicking but throws error _this.hidepanel is not a function – Md. Parvez Alam Sep 26 '18 at 12:05
you need to define the `hidepanel` function – Sachila Ranawaka Sep 26 '18 at 12:06
function is there, if it is not there it would be throwing at compile time also – Md. Parvez Alam Sep 26 '18 at 12:07
one more note. its typescript file so its defined like hidepanle() {} .. only no function keyword is there – Md. Parvez Alam Sep 26 '18 at 12:08
Typescript file – Md. Parvez Alam Sep 26 '18 at 12:10
do you need to use the jquery code in here. try to call the function outside of the jquery parts – Sachila Ranawaka Sep 26 '18 at 12:12
Could you please help me writting this – Md. Parvez Alam Sep 26 '18 at 12:29
ahh, right of course. you need to store the this into a variable so that state will not get change. – Sachila Ranawaka Sep 26 '18 at 12:33

call other function in toaster onShown event

1 Answers1