scrollbar to grid object

Hello,

I have a grid with 3 rows, every row with 1 cell. In the second row there is a table. I want put a vertical scroll bar to this row / table. I want maintain fixed position to the first and to the third row.

 

I go to the properties tab of second row -> advanced -> overflow -> scroll, but it doesn't works.

I try, also, properties tab of the cell of second row -> advanced -> overflow -> scroll and properties tab of the table of the cell of the second row -> advanced -> overflow -> scroll.

 

I have Actuate BIRT Designer Professional Version: 3.7.2 Build id: 20130129

How can I resolve my problem?

Comments

  • kclarkkclark BIRT Guru EM

    There is a bug open for this here.  Can you add your details?  In the meantime you might be able to create an HTML table in a text box and add a scroll bar that way, let me know if you need an example.

    Kristopher Clark

    Actuate Corporation – The BIRT Company™

    http://www.actuate.com | http://birtondemand.com

     

    My Blog

    Twitter

    LinkedIn
    Facebook
     

  • edited June 4, 2014

    Hi Kristopher,

    thank you for your answer. Can I have an example please?

     

    When I follow your link, there is another link (http://www.birt-exchange.org/org/devshare/designing-birt-reports/1558-howto-add-scroll-bars-to-a-table/), but I don't found the post from the devShare.

  • kclarkkclark BIRT Guru EM

    Sorry for the slow repose, I've attached an example.  I used the Data Engine API in the onRender of a text item.  Then iterated over the results and built an html table inside a div that includes scroll bars.

    //**********************************************************// Get the data//**********************************************************importPackage( Packages.org.eclipse.birt.report.model.api );importPackage(Packages.java.lang);importPackage(Packages.java.util);importPackage(Packages.org.eclipse.birt.data.engine.api);importPackage(Packages.org.eclipse.birt.report.model.api);importPackage(Packages.org.eclipse.birt.data.engine.api.querydefn);importPackage(Packages.org.eclipse.birt.data.engine.core);importPackage(Packages.org.eclipse.birt.core.data);var myconfig      = reportContext.getReportRunnable().getReportEngine().getConfig();var de            = DataEngine.newDataEngine( myconfig, null );var dsrc          = reportContext.getDesignHandle().findDataSource("Data Source");var dset          = reportContext.getDesignHandle().findDataSet("Data Set");var odaDataSource = new OdaDataSourceDesign( "DSource" );var odaDataSet    = new OdaDataSetDesign( "DSet" );odaDataSource.setExtensionID( "org.eclipse.birt.report.data.oda.jdbc" );odaDataSource.addPublicProperty( "odaURL", dsrc.getProperty("odaURL").toString() );odaDataSource.addPublicProperty( "odaDriverClass", dsrc.getProperty("odaDriverClass").toString());odaDataSource.addPublicProperty( "odaUser", dsrc.getProperty("odaUser").toString() );odaDataSource.addPublicProperty( "odaPassword", "" );  odaDataSet.setDataSource( odaDataSource.getName( ) );odaDataSet.setExtensionID( "org.eclipse.birt.report.data.oda.jdbc.JdbcSelectDataSet" );odaDataSet.setQueryText( dset.getQueryText() ); de.defineDataSource( odaDataSource );de.defineDataSet( odaDataSet );queryDefinition = new QueryDefinition( );queryDefinition.setDataSetName( odaDataSet.getName() );queryDefinition.setAutoBinding(true);var pq = de.prepare( queryDefinition );var qr = pq.execute( null );var qr = pq.execute( null );rowcount=0;  var ri = qr.getResultIterator( );  var customerNumber = new java.util.ArrayList();var checkNumber    = new java.util.ArrayList();var paymentDate    = new java.util.ArrayList();var amount         = new java.util.ArrayList();while (  ri.next( ) ) {    customerNumber.add(ri.getInteger("CUSTOMERNUMBER"));  checkNumber.add(ri.getString("CHECKNUMBER"));  paymentDate.add(ri.getDate("PAYMENTDATE"));  amount.add(ri.getBigDecimal("AMOUNT"));}this.text = customerNumber.size();ri.close( );qr.close( );de.shutdown( );//****************************************************// Build the table//****************************************************var table = "<div style="width: 600px; height: 100px; overflow-y: scroll;"><table>";for(i=0;i<customerNumber.size();i++) {  table += "<tr><td>" + customerNumber.get(i) + "</td><td>" + checkNumber.get(i) + "</td><td>" + paymentDate.get(i) + "</td><td>" + amount.get(i) + "</td></tr>";}table += "</table></div>";this.text = table;

    Let me know if this helps.  It's more manual, but it should get the job done.

    Kristopher Clark

    Actuate Corporation – The BIRT Company™

    http://www.actuate.com | http://birtondemand.com

     

    My Blog

    Twitter

    LinkedIn
    Facebook
     

  • Hi Clark,

    thank you for the report. Is it possible to put inside the div a table object (report item) insted of the html table?

  • kclarkkclark BIRT Guru EM

    I haven't tried it yet but you could bookmark your table which is like giving it a div name.  Then in a text item (make sure it's before the table) you would use something like this

    <script>  function loadScript() {    var mytable  = document.getElementById('mytable');    var newtable = document.getElementById('newtable');    var contents = mytable.innerHTML;    mytable.style.display = 'none';    newtable.innerHTML    = contents;  }    window.onload = loadScript();</script><body><div id="newtable" style="width: 800px; height: 100px; overflow-y: scroll;"></div></body></html>

    Where "mytable" is the bookmark name you gave the table.  let me know if this works!

    Kristopher Clark

    Actuate Corporation – The BIRT Company™

    http://www.actuate.com | http://birtondemand.com

     

    My Blog

    Twitter

    LinkedIn
    Facebook
     

  • I tryed your suggestion, but it doesn't works. I attached my report. Please can you help me?

  • You have to add one grid(1X1) and set the required width and height. then for 3 times you have to set the overflow property to scroll.


     


    1. select the grid and set the overflow property(properties --> advanced --> overflow --> set scroll).


    2. select the grid's row and set the same again.


    3. select the grid's cell and set the same.


     


    Now add the content what you want to show like grid,table, image any thing in the grid.


     


    it will work


  • Hello Ahamed,

    It worked good. I would like to scroll the grid data vertically automatically. Could you please help how to fix that.
    Thanks in advance.

    Thanks & Regards,
    Sai
Sign In or Register to comment.