Tabs-routable infinite-scroll-content not firing infinite function

Questions
1

i am working on cordova application.I am loading a tab content dynamically using route. infinite scroll unable to fire the tab_listMore method

please check the code below
page1.html
{{langPack.main.title.post}}

post_tab.html

  </ul>
</div>
<div class="preloader infinite-scroll-preloader">
  <span class="preloader-inner">
    <span class="preloader-inner-gap"></span>
    <span class="preloader-inner-left">
        <span class="preloader-inner-half-circle"></span>
    </span>
    <span class="preloader-inner-right">
        <span class="preloader-inner-half-circle"></span>
    </span>
  </span>
</div>

Please let me know what going wrong .unable to fire the tab_listMore

2

Hey Rajesh, where is your code?

3

Hi tiptronic,
Thanks for responding.

please find the code below.dont know how it was half pasted last time

Page1.html

          <div class="toolbar-inner"> 
            <a href="./tab_post/" data-route-tab-id="tab_post" class="tab-link">POST</a> 
          </div>
        </div>

  <div class="tabs-animated-wrap">
      <div class="tabs tabs-routable">
        
        <div id="tab_post" class="tab page-content"></div> 
      </div>
    </div>

tab_post.html

<div class="list timeList no-gap no-hairlines no-hairlines-between"> 
</div>
<div class="preloader infinite-scroll-preloader">
  <span class="preloader-inner">
    <span class="preloader-inner-gap"></span>
    <span class="preloader-inner-left">
        <span class="preloader-inner-half-circle"></span>
    </span>
    <span class="preloader-inner-right">
        <span class="preloader-inner-half-circle"></span>
    </span>
  </span>
</div>

and i have a method “tab_listMore” which loads the data from ajaxPreformatted text

4

Hi Rajesh,

this is not the code - it’s just the HTML- to see what’s going on it’s easiest to provide a small JSfiddle (https://jsfiddle.net)

5

Sample zip file

Please can u download this full file. i will setup jsfiddle if it does not work.dont know how cordova works in js fiddle

6

Sorry - I’m out and not at my machine - so I can’t check the file.
But you don’t need to put your Cordova app into a jsfiddle, just 1 page, showing the problem and how you initalize your page…

7

Thanks for the response .Below is the link for the js fiddle i think it will not work because the data is loading from ajax with token as security but the code is there .

I have a page1 with tabs html code given in above thread and when we click on tab below jsfiddle code loads using routers here the scroll event not firing the method.

https://jsfiddle.net/dbnay5co/

8

Hi @tiptronic

any luck for me .did you get chance to check the code.

Thanks,
Raj

9

Sorry … I’m away from my machine, so I can’t check thoroughly. Your fiddle looks okay (but doesn’t work). You should really create a short functional fiddle, which then will most likely expose the problem immediately.

I also looked at the files you sent - but honestly, for me this would take too much time to make it work, because I need to setup a new project…

Does the problem only appear in your routed tabs?
What happens if you put the code into a separate view/page?
Did you try to put the code of the ‘Infinite Example’ of KitchenSink into your project?

10

Thanks for your time its working on all other pages only routable tabs having issue.

11

Ah ok… then I think you need to wait until 14. Nov. when @nolimits4web is back :wink: - sorry

12

ok thanks for your valuable time will try different ways till then can you tell me one thing how we can initialize the infinite in dynamic ajax content .

13

app.infiniteScroll.create(el)

https://framework7.io/docs/infinite-scroll.html

14

ok thanks will try that now

15

Please create working JSFiddle, or share the minimal live example. It is not possible to say something by those peaces of code. You can start from forking this fiddle https://jsfiddle.net/nolimits4web/o2ejupu1/

16

ok thanks will do that and send you link.

17

Hi @nolimits4web

How we can load data for infinite in route content.we cannot use javascript in route content jsfiddle