Calender is showing twice

Questions
1

I’m using framework7 for creating a form using framewok7.It appears that the init event is being fired twice , even though i have only a single view for each route.

$$(document).on('page:init','.page[data-name="addtask"]',function(e,page){
  console.log(page);
  var calendarDateFormat = app.calendar.create({
  inputEl: '#demo-calendar-date-format',
    dateFormat: { month: 'long', day: '2-digit', year: 'numeric' },
 });
});

image
image.png1366×768 120 KB

from console output, it’s clear that event is being fired for a page.

2

trigger when the page you need is built => pageMounted

Take a look here : https://framework7.io/docs/view.html

Basic example:

 <script>
    return {
         // Page Events
        on: {
            pageMounted: function(e, page) {
                var calendarDefault = app.calendar.create({
                 inputEl: '#demo-calendar-default',
               });
            },

        }
    }

</script>
1 Like
4

It looks like i’m misunderstooding the concepts.It would be helpful if someone may clearify it.Till now, in order to create a new page, i’m following the steps:-
1)First i create route in routes.js
2)next, i would create corresponding page in /pages directory.
3)In order to add events, i would do following in my app.js:-

$$(document).on('page:init','.page[data-name="data-name"]',function(e,page){
    //add events here
});

I don’t understand when i would need to create a view? As far as i understood init must run only once, then,why it’s runing twice? Is it runing twice because all routes are in default view?
In my application, i have three routes which are:-
1)/memo_list/
2)’/edit/’
3)’/addtask’
Should i make a single route with all these routes or one view for each route
The solution you provided in not working