Navigation

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

    Symorp

    @Symorp

    0
    Reputation
    5
    Posts
    555
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online

    Symorp Follow

    Posts made by Symorp

    • RE: Dynamically create tabbar in page of navigator

      Hello,
      so this is something that may be result https://codepen.io/symorp/pen/bGbWEeW but I wanna pages in tab bar create dynamically by some conditions. Currently, I am using jQuery but in the future, we wanna migrate to Vue so is here a way how to render tabs in tab bar with jQuery or Vue?

      posted in Onsen UI
      Symorp
    • Dynamically create tabbar in page of navigator

      Hello,
      i am trying to generate tabbar on page, based on some data from API.

      So I created this:

          let data = [];
          let onsEle = document.createElement('ons-tab');
          onsEle.setAttribute('id', 'rdMainTab');
          onsEle.setAttribute('page', 'rdMain.html');
          onsEle.setAttribute('label', 'Main');
          onsEle.setAttribute('icon', 'ion-home, material:md-home');
          onsEle.setAttribute('active', '');
      
          data.push(onsEle);
      
          if (showData1) {
            let onsMapEle = document.createElement('ons-tab');
            onsMapEle.setAttribute('id', 'rdMapTab');
            onsMapEle.setAttribute('page', 'rdDetailMap.html');
            onsMapEle.setAttribute('label', 'Map');
            onsMapEle.setAttribute('icon', 'ion-home, material:md-home');
            data.push(onsMapEle);
          }
      
          if (showData2) {
            let onsInvEle = document.createElement('ons-tab');
            onsInvEle.setAttribute('id', 'rdInvoiceTab');
            onsInvEle.setAttribute('page', 'rdInvoiceTab.html');
            onsInvEle.setAttribute('label', 'Invoice');
            onsInvEle.setAttribute('icon', 'ion-home, material:md-home');
            data.push(onsInvEle);
          }
      
          if (showData3) {
            let onsTriEle = document.createElement('ons-tab');
            onsTriEle.setAttribute('id', 'rdTripsTab');
            onsTriEle.setAttribute('page', 'rdTripsTab.html');
            onsTriEle.setAttribute('label', 'Trips');
            onsTriEle.setAttribute('icon', 'ion-home, material:md-home');
            data.push(onsTriEle);
          }
      
          let wrap = document.createElement('ons-tabbar');
          wrap.setAttribute('swipeable', '');
          wrap.setAttribute('position', 'auto');
          wrap.setAttribute('id', 'reservation-detail-tabbar');
          wrap.setAttribute('class', 'x-margin-top');
      
          let l = data.length;
          for (let a = 0; a < l; a++) {
            wrap.appendChild(data[a]);
          }
      
          $page.find('#tabbarPlaceholder')[0].appendChild(wrap);
      

      The tabbar renders ok. But, when I click at another tab it is showing this error:

      Uncaught (in promise) TypeError: page._show is not a function
          at HTMLElement._onPostChange (index.js:264)
          at swiper.js:343
      

      And when I try to go back it is showing this:

      index.js:281 Uncaught (in promise) TypeError: prevTab.pageElement._hide is not a function
          at HTMLElement._onPreChange (index.js:281)
          at Swiper._changeTo (swiper.js:335)
          at Swiper.setActiveIndex (swiper.js:183)
          at index.js:459
      

      Can you please tell me how to generate tabbar dynamicaly? Or where I made mistake? Many thanks and have a nice day.

      posted in Onsen UI
      Symorp
    • Onsen with Vue and TypeScript?

      Hello I am wondering how to use Onsen UI with VueJS and TypeScript, I tried your bundle https://github.com/OnsenUI/vue-cordova-webpack, but It is not prepared for use with TypeScript.

      Do you have some tips how to change your boilerplate to work with TypeScript?

      EDIT: I forgot, I wanna to build cordova app. And I don’t know how to use this plugin (vue-cli-plugin-cordova) which is refferenced in you doc. But why it is creating folder src-cordova, when I already have src folder?

      posted in Onsen UI
      Symorp
    • RE: Monaca Build - Cocoapod settings for Google maps cordova plugin

      Here is error from logs:

      - postBuild -
      
      Remove DerivedData files...
      
      Remove IB Support files...
      Change Xcode Version to 10.1
      Build Error: Error: Sandbox Exec Error: [ Ignoring configuration file '=NONE' because it could not be loaded.
      Reason: File could not be parsed due to preprocessing errors:
          The file “=NONE” couldn’t be opened because there is no such file. (/tmp/monaca/5cee380de78885ef23242c67/project/platforms/ios/=NONE)Error: ENOENT: no such file or directory, open '/private/tmp/monaca/5cee380de78885ef23242c67/project/platforms/ios/XXX.xcworkspace/project.pbxproj'
       ]
      
      posted in Monaca Tools
      Symorp
    • Monaca Build - Cocoapod settings for Google maps cordova plugin

      Hello,
      in my project i am using cordova-plugin-googlemaps for rendering google maps
      https://github.com/mapsplugin/cordova-plugin-googlemaps

      And this supporting plugin, that should install googlemaps-sdk for iOS
      https://github.com/mapsplugin/cordova-plugin-googlemaps-sdk

      When I am building app for Android, everything is Ok. But when I am building for iOS I am getting error, or Google maps did not install so I can’t use them.

      I was lookig how to solve this. I thing it have something with CocoaPods or some dependencies when building app. I wrote to developer. He told that I must set cordova-cli@9 and cordova-ios@8. But I don’ know how to setup this when building app on Monaca.

      Can you please help me?

      Many Thanks

      posted in Monaca Tools
      Symorp