Navigation

    Monaca & Onsen UI
    • Register
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. Guille270
    G
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    Guille270

    @Guille270

    0
    Reputation
    4
    Posts
    654
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online

    Guille270 Follow

    Posts made by Guille270

    • How I can know when all the elements are ready when I use the navigator to change screen?

      Hello, I have a very big problem. When I change the screen of my app I need to play with DOM, but the elements aren’t load yet. How I can know when elements are ready?

      Thanks!

      posted in Onsen UI
      G
      Guille270
    • RE: Events as ng-click or css :active are not working properly

      @emccorson said in Events as ng-click or css :active are not working properly:

      What is fn.load? My guess is that fn.load calls ons-navigator.pushPage which loads a new page even if the page is already on the page stack. Instead you should use ons-navigator.bringPageTop which will check if the page is already on the page stack.

      By the way, you can inspect the pages in your browser’s dev tools to see what pages are in the page stack. Just look at the child elements of the navigator.

      If changing to bringPageTop doesn’t solve the problem then you might have run into this bug, which I am working on fixing: https://github.com/OnsenUI/OnsenUI/issues/2604

      You’re right, all my problems are solved!!!

      Thanks you so much!

      posted in Onsen UI
      G
      Guille270
    • RE: Events as ng-click or css :active are not working properly

      @emccorson This are all my navigator functions

      window.fn = {};

          window.fn.open = function() {
              var menu = document.getElementById('menu');
              menu.open();
          };
      
          window.fn.close = function() {
              var menu = document.getElementById('menu');
              menu.close();
          }
      
          window.fn.load = function(page, data) {
              var content = document.getElementById('myNavigator');
              var menu = document.getElementById('menu');
              content.pushPage(page, data)
                  .then(menu.close.bind(menu));
          };
      
          window.fn.pop = function() {
              var content = document.getElementById('myNavigator');
              content.popPage();
          };
      
          document.addEventListener('init', function(event) {
              var page = event.target;
      
              if (page.id === 'page1') {
                  page.querySelector('#push-button').onclick = function() {
                      document.querySelector('#myNavigator').pushPage('page3.html', {
                          data: {
                              title: 'Page 3'
                          }
                      });
                  };
              } else if (page.id === 'page2' || page.id === 'page3') {
                  page.querySelector('ons-toolbar .center').innerHTML = page.data.title;
              }
          });
      

      In this days I was found that if instead of fn.load i use content.popPage(); i can click well

      posted in Onsen UI
      G
      Guille270
    • Events as ng-click or css :active are not working properly

      Hello guys,

      I’m a newbie hybrid apps developer and I’m having problems with onsen ui, maybe for my lack of experience and I need a little help.

      I’m doing and app that has a list. My idea is detect when user clicks on one item and open an ons-action-sheet (https://onsen.io/v2/api/js/ons-action-sheet.html), because is so beautiful and useful. All works well when I enter in the page for first time, but when i move to another page and I click this page in the menu i can do nothing with click not even css :active. I think that the last page opened is already opened in some way and for this the click events are not working,

      Do you have any idea?

      My action sheet:

      <ons-action-sheet id="tasacionOptions" cancelable title="Tasación">
           <ons-action-sheet-button icon="md-square-o" ng-click="delete()">Borrar</ons-action-sheet-button>
            <ons-action-sheet-button icon="md-square-o" ng-click="modification()">Modificar </ons-action-sheet-button>
            <ons-action-sheet-button icon="md-close" ng-click="unselectTasacion()">Cancelar</ons-action-sheet-button>
       </ons-action-sheet>
      

      My menu:

      <ons-page>
              <ons-splitter>
                  <ons-splitter-side id="menu" side="right" width="220px" collapse>
                      <ons-page>
                          <ons-list>
                              <ons-list-item>
                                  <ons-icon icon="fa-times" onclick="fn.close()"></ons-icon>
                              </ons-list-item>
                              <!-- FALTA PONER ng-show="auth" -->
                              <ons-list-item tappable onclick="fn.load('login.html', {data: {title: 'Login'}})">
                                  Login
                              </ons-list-item>
                              <ons-list-item tappable ng-show="permissions.getTasaciones" onclick="fn.load('tasaciones.html', {data: {title: 'Tasaciones'}})">
                                  Tasaciones
                              </ons-list-item>
                              <ons-list-item tappable onclick="fn.load('debugZone.html', {data: {title: 'DebugZone'}})">
                                  Debug Zone
                              </ons-list-item>
                          </ons-list>
                      </ons-page>
                  </ons-splitter-side>
                  <ons-splitter-content id="content" page="homePage.html"></ons-splitter-content>
              </ons-splitter>
          </ons-page>
      

      Thanks to all for your help.

      posted in Onsen UI
      G
      Guille270