Checking for onScroll in moon.DataGridList

edited April 2014 in Newbie Questions
Is there a way to detect a scroll event in moon.DataGridList ? I've tried creating a handler for "onScroll", but that does not seem to be working..
components: [ 
        {kind: "view.TopNavigation", name: "navigation"},
        {kind :"moon.Image", name : "placeholderimage"},
        {
            kind: "moon.DataGridList", name: "repeater", 
            handlers : {
                "onScroll" : "initOnScrollListener"  //tried onscroll as well
            },
            fit: true, classes : "grid-style", components: [                
                { kind : "view.GridItemControl",classes: "item-style"}
            ],minWidth: 224, minHeight: 175, spacing: 20
        }
    ]

...

initOnScrollListener : function(){
        console.info("Onscroll init...");
        /*this.$.repeater.addListener('onScroll', function(){
            console.info("scrolling yoh");
        });*/
    }

Comments

  • edited April 2014
    The reason that onScroll does not bubble is that it is prevented from propagating at the enyo.DataList level: https://github.com/enyojs/enyo/blob/master/source/ui/data/DataList.js#L304

    You can implement a didScroll method in your subkind of moon.DataGridList. For a working example, something like this (based off of the Moonstone DataGridList Sample): http://jsfiddle.net/U7x8N/1/

    Using the sample code you provided:
    
    components: [ 
        {kind: "view.TopNavigation", name: "navigation"},
        {kind :"moon.Image", name : "placeholderimage"},
        {
            kind: "MyDataGridList", name: "repeater", 
            handlers : {
                "onScroll" : "initOnScrollListener"  //tried onscroll as well
            },
            fit: true, classes : "grid-style", components: [                
                { kind : "view.GridItemControl",classes: "item-style"}
            ],minWidth: 224, minHeight: 175, spacing: 20
        }
    ]
    
    ...
    
    enyo.kind({
        name: "MyDataGridList",
        kind: "moon.DataGridList",
        didScroll: function(inSender, inEvent) {
            this.inherited(arguments);
            // do something when list is scrolled
            this.initOnScrollListener();
        },
        initOnScrollListener : function(){
            console.info("Onscroll init...");
            /*this.$.repeater.addListener('onScroll', function(){
                console.info("scrolling yoh");
            });*/
        }
    })
    
Sign In or Register to comment.