How to synchronize the time line to scroll?

4 posts, 0 answers
  1. Igor
    Igor avatar
    12 posts
    Member since:
    Nov 2014

    Posted 05 Nov 2014 Link to this post

    If I have one page Gant  and Scheduler (or Gant  and Gant ) . How can I synchronize the move  time lines to scroll?

    <div id="example" ng-app="KendoDemos" combine-horizontal-scrolls="k-grid-content">      
        <div ng-controller="MyCtrl" >      
            <div kendo-grid class="k-grid-content" options="mainGridOptions"></div> 
        </div>     
              <div ng-controller="twoCtrl" >       
            <div kendo-grid class="k-grid-content" options="mainGridOptions"></div> 
        </div>
    </div>

    myApp.directive('combineHorizontalScrolls', [function(){
    var scrollLeft = 0;
    function combine(elements){
    elements.on('scroll', function(e){
    if(e.isTrigger){
      e.target.scrollLeft = scrollLeft;
    }else {
    scrollLeft = e.target.scrollLeft;
    elements.each(function (element) {
    if( !this.isSameNode(e.target) ){$(this).trigger('scroll');}
    });
    }
    });
    }

    return {
    restrict: 'A',
    replace: false,
    compile: function(element, attrs){        
    combine(element.find('.'+attrs.combineHorizontalScrolls));
    }
    };    
    }]);

    That's because only works in the Grid, but does not work in the Gantt



  2. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 07 Nov 2014 Link to this post

    Hi Igor,

    in general, that approach should work for the gantt too, since it uses the same class for its scrollable content. Can you present your implementation in a runnable sample in our dojo? We may be able to help further. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Igor
    Igor avatar
    12 posts
    Member since:
    Nov 2014

    Posted 10 Nov 2014 in reply to Petyo Link to this post

    I am interested time lines to timelines scroll, but does not work with it.

    if you look at the source code there Gantt, class="k-grid-content", but it does not work

    http://dojo.telerik.com/aWeGI
  5. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 11 Nov 2014 Link to this post

    Hello,

    the gantt scroller is not yet instantiated by the time the directive is compiled. Linking the scrolls with timeout resolves the issue

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready