How can I use a Mobile Scheduler with Ionic app?

Webix JS
1

Hi, I am working with AngularJS and Ionic framework and going to add an events calendar to my app, I see Webix has a good one http://webix.com/scheduler/

Now I am trying to install it to my app, is there a sources sample for AngularJS (or maybe for Ionic?) like you already have for other components http://docs.webix.com/samples/33_angular/ ?

Now I am trying to add something like $$(“scheduler”).load(…) in my controller JS sources but it always attach webix scheduler to the end of , it looks like:

...app HTML sources...

and it is not visible in this case. How can I attach webix Mobile Scheduler to the particular div with custom ID or class?

2

You can wrap a scheduler in custom directive

http://webix.com/snippet/a8a40c7e

webixApp.directive("scheduler",[ function(){
  return {
    restrict:"A",
    scope:false,
    
    link:function($scope, $element){
      webix.ready(function(){
      	webix.ui({
        	view:"scheduler",
        	container:$element[0]
      	});
      }); 
    }
  }
}]);
3

Hi Maksim, I am trying to follow the snippet and add the scheduler to my ionic project by copying your example, but keep getting an error:

scheduler.js:7 Uncaught ReferenceError: webix is not defined

What am I missing, should there be additional includes in the index.html file? Currently I have these (from the snippet example):

Thanks!

4

oops - these are the includes that I have in index.html:

5

i guess you are eliminating the html tags. Anyhow I have the first two lines from your HTML section example.

6

Hi,

The right section of the “snippet” is the iframe with the html page that includes webix libs. “JS Code” section allows to put js code. And “HTML code” can be used to add some html contents if it’s needed.