Telekrik SideDrawer issue - Cannot read property ‘showDrawer’ of undefined



I was implementing Telerik’s SideDrawer component and got a error JS: ERROR TypeError: Cannot read property ‘showDrawer’ of undefined

My XML is ,

<Page xmlns:lv="nativescript-telerik-ui/listview" xmlns:sd="nativescript-telerik-ui/sidedrawer" loaded="pageLoaded" unloaded="pageUnloaded" xmlns="" navigatedTo="onNavigatedTo" >
       <ActionBar title="RadSideDrawer Demo" class="action-bar" >
<ActionItem tap="toggleDrawer" ios.systemIcon="4" android.systemIcon="ic_menu_btn_add" ios.position="left" />
    <sd:RadSideDrawer id="sideDrawer" drawerLocation="Left">

        <!-- side drawer content -->
            <StackLayout class="sidedrawer-left">
                <StackLayout class="sidedrawer-header">
                    <Label text="Hello RadSideDrawer!" class="sidedrawer-header-brand" />
                <StackLayout class="sidedrawer-content">
                    <Label text="Home" class="sidedrawer-list-item-text" />
                    <Label text="Basics" class="sidedrawer-list-item-text" />
                    <Label text="Options" class="sidedrawer-list-item-text" />
                    <Label text="Help" class="sidedrawer-list-item-text" />
                    <Label text="Advanced" class="sidedrawer-list-item-text" />

        <!-- The main content -->


and javascript file is

var view = require("ui/core/view");
var drawer="";
exports.toggleDrawer = function() {
exports.onNavigatedTo = function() {
    drawer = view.getViewById(page, "sideDrawer");

Using Latest version tns-android,tns-core-mocules,telekriki-ui…
What am I missing? Any help will be appreciated…


Hi @DeepakG,

You had a few minor syntactical issues in your code sample, mostly noticeably in your main-page.js file. You need to get a reference to the Page before using it, so the code should look something like this.

var drawer;

exports.toggleDrawer = function () {
exports.onNavigatedTo = function (args) {
  var page = args.object;
  drawer = page.getViewById("sideDrawer");

I put together a functioning version of this in NativeScript Playground so you can take a look:


Thanks tjvan ,it solved my problem