pqscrollbarcreate pqscrollbarscroll callback don't work

[twoer]

Code: [Select]

var data = [[1, 'Exxon Mobil', '339,938.0', '36,130.0'],
            [2, 'Wal-Mart Stores', '315,654.0', '11,231.0'],
[3, 'Royal Dutch Shell', '306,731.0', '25,311.0'],
[4, 'BP', '267,600.0', '22,341.0'],
[5, 'General Motors', '192,604.0', '-10,567.0'],
[6, 'Chevron', '189,481.0', '14,099.0'],
[7, 'DaimlerChrysler', '186,106.3', '3,536.3'],
[8, 'Toyota Motor', '185,805.0', '12,119.6'],
[9, 'Ford Motor', '177,210.0', '2,024.0'],
[10, 'ConocoPhillips', '166,683.0', '13,529.0'],
[11, 'General Electric', '157,153.0', '16,353.0'],
[12, 'Total', '152,360.7', '15,250.0'],
[13, 'ING Group', '138,235.3', '8,958.9'],
[14, 'Citigroup', '131,045.0', '24,589.0'],
[15, 'AXA', '129,839.2', '5,186.5'],
[16, 'Allianz', '121,406.0', '5,442.4'],
[17, 'Volkswagen', '118,376.6', '1,391.7'],
[18, 'Fortis', '112,351.4', '4,896.3'],
[19, 'Crédit Agricole', '110,764.6', '7,434.3'],
[20, 'American Intl. Group', '108,905.0', '10,477.0']];




        var obj = { width: 700, height: 400, title: "ParamQuery Grid Example",resizable:true,draggable:true };
        obj.colModel = [{ title: "Rank", width: 100, dataType: "integer" },
        { title: "Company", width: 200, dataType: "string" },
        { title: "Revenues ($ millions)", width: 150, dataType: "float", align: "right" },
        { title: "Profits ($ millions)", width: 150, dataType: "float", align: "right"}];
        obj.dataModel = { data: data };
        var $grid = $("#grid_array").pqGrid(obj);


        var $pqScrollbar = $grid.find("div.pq-sb-vert").pqScrollBar();


        $pqScrollbar.on( "pqscrollbarcreate", function( event, ui )
        {
        alert('create');
        } );


        $pqScrollbar.on( "pqscrollbarscroll", function( event, ui )
        {
        alert('scroll');        } );







pqscrollbarcreate [/size]pqscrollbarscroll  callback don't work?

[paramvir]

1) create event is not fired in your case because the scrollbar is already created before you listen to the event. Since the create event bubbles to the grid element, you can listen it on the grid element before creation of grid.

$("#grid_array").on("pqscrollbarcreate", function(evt){             
               if($(evt.target).hasClass('pq-sb-vert')){
                   alert('vertical scrollbar created');
               }
           });

2) scroll event is fired in virtual mode scrolling. drag event is fired in non virtual mode.

$pqScrollbar.on("pqscrollbardrag", function (event, ui) {
               alert('scroll');
           });


http://jsfiddle.net/zy9vqx41/

[twoer]

Code: [Select]


$pqScrollbar.on("pqscrollbardrag", function (event, ui)
{
       $(this).pqScrollBar('option', 'cur_pos', 100);
       
       var  curPos = $(this).pqScrollBar('option', 'cur_pos');     
 
});



get  curPos always 0 ?

set curPos don't work ?

[twoer]

I want to achieve two grid linkage rolling.

1) create event is not fired in your case because the scrollbar is already created before you listen to the event. Since the create event bubbles to the grid element, you can listen it on the grid element before creation of grid.

$("#grid_array").on("pqscrollbarcreate", function(evt){             
               if($(evt.target).hasClass('pq-sb-vert')){
                   alert('vertical scrollbar created');
               }
           });

2) scroll event is fired in virtual mode scrolling. drag event is fired in non virtual mode.

$pqScrollbar.on("pqscrollbardrag", function (event, ui) {
               alert('scroll');
           });


http://jsfiddle.net/zy9vqx41/