# כיצד להשתמש ב-api.onPageChange עם api.createWidget?

**URL:** <https://meta.discourse.org/t/how-to-use-api-onpagechange-with-api-createwidget/242744>\
**Category:** Development\
**Tags:** ember\
**Created:** [24 באוקטובר,‏ 2022,‏ 2:55am UTC](https://meta.discourse.org/t/how-to-use-api-onpagechange-with-api-createwidget/242744 "2022-10-24T02:55:24Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [25 באוקטובר,‏ 2022,‏ 5:52pm UTC](https://meta.discourse.org/t/how-to-use-api-onpagechange-with-api-createwidget/242744/3 "2022-10-25T17:52:57Z")

</div>

I think the missing piece was to trigger a widget rerender… if I recall correctly widgets rerender on interaction, so I’ve added `this.scheduleRerender();` to make it rerender on page change.

This works for me locally:

```js
api.createWidget("top-banner-widget", {
    tagName: "div.top-banner",

    html() {
        let Number = Math.round(1 * Math.random());
        
        let banners = new Array();
        banners[0]="https://placekitten.com/500/500";
        banners[1]="https://placekitten.com/500/300";

        let GoTo = new Array();
        GoTo[0]="https://google.com";
        GoTo[1]="https://brave.com";
  
        let TheLink = GoTo[Number];
        let TheImage = banners[Number];
        
        api.onPageChange(() => {
            this.scheduleRerender();
        });
  
        return h("div#top-banner", [
          h(
            "a.custom-ad-link",
            { href: TheLink },
            h("img", { src: TheImage})
          )
        ]);
    }
});

```

---

_[View the full topic](https://meta.discourse.org/t/how-to-use-api-onpagechange-with-api-createwidget/242744)._