This discussion is archived
1 3 4 5 6 7 Previous Next 93 Replies Latest reply: Jan 13, 2011 3:24 AM by ATD Go to original post RSS
  • 75. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    I did fixed DIV IDs because it was "doing my head in just to get the thing to work" :D

    Certainly change these to include region IDs if you want.
  • 76. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    Thanks Andy for your tips.

    Finally =)
    http://actionet.homelinux.net/htmldb/f?p=100:502

    I post code later



    Regards,
    Jari

    Edited by: jarola on Jan 11, 2011 9:57 PM
    wrong page id corrected
  • 77. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    Oh dear!

    IE7 works (OMG), sort of - the row heights are a bit funny. They start ok before the code kicks in and then double in size - though they are consistent down the report, so maybe ok.

    Chrome/Iron now doesn't work - column widths are all over the place!

    I've uploaded a couple of screenshots (images 116 and 117) into: http://apex.oracle.com/pls/otn/f?p=267:11

    Andy
  • 78. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    :( Always some problem

    I also noticed that this is not so performance friendly.
    If you have e.g 200 rows, browser hangs and page loading take long.

    And I have manage get it work only with my custom theme. Some style from theme css affect.

    Here is what I have done

    Report template before rows
    <style>#report_#REGION_STATIC_ID# table *{white-space:nowrap!important}</style>
    <table cellpadding="0" border="0" cellspacing="0" summary="" #REPORT_ATTRIBUTES# id="report_#REGION_STATIC_ID#">#TOP_PAGINATION#
    <tr><td><div id="lh_#REGION_STATIC_ID#">
    <table cellpadding="0" border="0" cellspacing="0" summary="" class="t110standard"></table>
    </div></td><td><div id="rh_#REGION_STATIC_ID#">
    <table cellpadding="0" border="0" cellspacing="0" summary="" width="100%" class="t110standard"></table>
    </div></td></tr><tr><td><div id="lb_#REGION_STATIC_ID#">
    <table cellpadding="0" border="0" cellspacing="0" summary="" class="t110standard"></table>
    </div></td><td><div id="rb_#REGION_STATIC_ID#">
    <table cellpadding="0" border="0" cellspacing="0" summary="" width="100%" class="t110standard">
    After Rows
    </table></div></td></tr>
    #PAGINATION#
    <tr><td class="t110bottom" colspan="99">#EXTERNAL_LINK##CSV_LINK#</td></tr>
    </table>
    And JavaScript
    ;(function($){$.fn.htmldbDscroll=function(opt){
     opt=$.extend({
      width:400,
      height:200,
      freezeColumns:1,
      freezeRows:1
     },opt);
     return this.each(function(i){
    
      var lId=this.id.substr(6)
    
      /* styles */
      $("#lh"+lId).css({"right":"0","bottom":"0"}).parent().css({"right":"0","bottom":"0"});
      $("#rh"+lId).css({"overflow-x":"hidden","width":opt.width-17,"left":"0","bottom":"0"}).parent().css({"bottom":"0"});
      $("#lb"+lId).css({"overflow-y":"hidden","height":opt.height-17,"right":"0","top":"0"}).parent().css({"right":"0","top":"0","vertical-align":"top"});
      $("#rb"+lId).css({"overflow":"scroll","width":opt.width,"height":opt.height});
      
      /* report cell width */
      $("#rb"+lId).find("th,td").each(function(){
       var n=$(this).width();
       $(this).width(n);
      });
      
      /* row process */
      $("#rb"+lId).find("tr").each(function(j){
       if(opt.freezeColumns>0){
        var t1=$(this);
        var h=t1.height();
        t1.height(h);
        var t2=t1.clone();
        t1.children(":lt("+opt.columns+")").remove();
        t2.children(":gt("+(opt.columns-1)+")").remove();
       }
       if(opt.freezeRows>0){
        if(j>(opt.freezeRows-1)){
         $("#lb"+lId).children().append(t2);
        }else{
         $("#rh"+lId).children().append(t1);
         $("#lh"+lId).children().append(t2);
        }
       }
      });
    
      /* table width */
      if($("#lh"+lId).children().width()>$("#lb"+lId).children().width()){
       $("#lb"+lId).children().width($("#lh"+lId).children().width());
       $("#lh"+lId).children().width($("#lh"+lId).children().width());
      }else{
       $("#lh"+lId).children().width($("#lb"+lId).children().width());
       $("#lb"+lId).children().width($("#lb"+lId).children().width());
      }
      $("#rh"+lId).children().css({"width":"100%","table-layout":"fixed"});
      $("#rb"+lId).children().css({"width":"100%","table-layout":"fixed"});
      
      /* scroll */
      $("#rb"+lId).scroll(function(){
       $("#rh"+lId).scrollLeft(this.scrollLeft);
       $("#lb"+lId).scrollTop(this.scrollTop);
      });
     })
    
    }})(jQuery);
    Regards,
    Jari
  • 79. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    Hi,

    FireFox is fine, IE7 is ok (still has issues with line heights, but the heights are the same across the entire row, so that's okish - and, of course, IE7 takes ages to load but I think that's due to the styles as IE is notoriously slow when a lot of styling is involved).

    Chrome/Iron definitely has problems. Text overlaps column boundaries and using the sorting option makes the header widths different from the data column widths.

    Andy
  • 80. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    Ok, need install Chrome and check.
    Or place project on hold as this start look impossible =)


    Regards,
    Jari
  • 81. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    Might be worth taking a break!

    I think that one thing I did at one point was to ask the user to set the columns widths as an array (or a comma-separate string). That's a possibility, though does, of course, mean that the user has to do more things! That way, it is their problem if the columns don't line up ;)

    Andy
  • 82. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    Hmm, maybe hook some jQuery UI Resizable to columns so user can resize using mouse?
    http://jqueryui.com/demos/resizable/

    I have hook that to IR columns once, and user can resize columns, but again IE ....

    Anyway, I take break on this

    Regards,
    Jari
  • 83. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    That might confuse the poor users!

    I'd take a break and revisit this tomorrow or something

    Andy
  • 84. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,


    Well, it might. And always is user that can not understand even simplest page =)
    But if do not apply nowrap to all cells. Instead overflow hiden.
    It might columns line up nice. Then user can expand columns width like in excel.
    I did mean that kind thing.

    Regards,
    Jari
  • 85. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    Users!!! Can't live with them, can't live without them :(

    I would expect, though, that the user would get annoyed with having to expand a column every time the report refreshed?

    Andy
  • 86. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    You are correct, it might be so.
    But for session you could store widths e.g. to collection.

    OK, that was maybe bad idea =)

    Regards,
    Jari
  • 87. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    It doesn't have to be a collection, you could just store them in a javascript variable?
  • 88. Re: horizontal bar Scrolling.
    jariola Guru
    Currently Being Moderated
    Hi,

    But, is that only for that page?
    Meaning if user visit other page, they need again set widths ?



    Regards,
    Jari
  • 89. Re: horizontal bar Scrolling.
    ATD Guru
    Currently Being Moderated
    If they move to another page and back again, I would expect the report to be re-rendered from scratch anyway? If so, the javascript array/string/whatever would be for that page only and would be recreated on a full page reload

    Andy
1 3 4 5 6 7 Previous Next

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points