Hybrid View

  1. #1
    Ext User
    Join Date
    Jul 2007
    Posts
    24
    Vote Rating
    -1
    xiexueze has a little shameless behaviour in the past

      -1  

    Default [3.0]Ext.ux.tree.PagingTreeLoader

    [3.0]Ext.ux.tree.PagingTreeLoader


    HI,I rewrite the Ext.ux.tree.PagingTreeLoader to support the ext3.0 rc1

    this PagingTreeLoader has been tested in IE6/firefox3/chrome1/safari4

    PagingTreeLoader suports client paging and server paging:

    1.client paging uages:
    HTML Code:
    var tree = new Ext.tree.TreePanel({
        applyTo:'tree-ct', 
        width:300, 
        height:400, 
        autoScroll:true, 
        plugins: new Ext.ux.tree.TreeNodeMouseoverPlugin(),//must use the plugin 
        loader: new Ext.ux.tree.PagingTreeLoader({         //use the extend TreeLoader 
          dataUrl:'getNodes.jsp', 
          pageSize:10,                                    //the count of the childnode to show every time,default 20
          enableTextPaging:true,                          //whether to show the pagination's text 
          pagingModel:'local'                             //local means client paging ,remote means server paging,default local
        }), 
        root: new Ext.tree.AsyncTreeNode({ id:'0',text:'root' }) 
    });
    the server just get the 'node' parameter value,and return the JSON like this:
    HTML Code:
    [{id:1,text:'node1',leaf:false,children:[{...},...{...}]},{id:1,text:'node2',leaf:true},...,{id:100,text:'node100',leaf:true}]

    2.server paging uages:
    the js code just change the pagingModel value to 'remote'.
    the server will receive some parameters:
    node : the id of the node which is expending or paging
    start : the start index of the children,when the node first expends,the start value is 0
    limit : equals the jscode's pageSize,means the count of the node to show ervery time
    total : the total count of the node's children,when the node first expends,the total parameter dosen't exist.

    the server return the JSON like this:
    HTML Code:
    {total:200,nodes:[{id:1,text:'node1',leaf:false},...,{id:100,text:'node100',leaf:false}]}
    Attached Images
    Attached Files

  2. #2
    Ext User
    Join Date
    Mar 2009
    Posts
    17
    Vote Rating
    0
    binod dokania is on a distinguished road

      0  

    Default


    Hi xiexueze,

    i am facing one issue in IE6. I tried resolving it but couldn't do that.
    Although I am not able to reproduce this on the example you have attached.
    Following is snapshot when I tried the plugin without any changes (in IE6).

    1.gif

    When I commented out following line.
    Code:
    autoCreate: {style:(Ext.isIE ? 'display: inline;white-space:nowrap;margin:-2px 0px;vertical-align:middle':'')},
    I got following.Please refer the next screenshot.

    2.gif

    I have attached the IE6 toolbar snapshot as well in case of 2nd scenario.

    3.gif

    Although the container Div has style as inline but still it is not able to align after root node.
    Looking at the IE devtoolbar div is appened to anchor tag as per the logic in (Ext.isIE)
    Please help me to resolve this or provide some guidance to resolve this.
    This is working fine in FF3.
    Attached Images

  3. #3
    Ext User
    Join Date
    Jul 2007
    Posts
    24
    Vote Rating
    -1
    xiexueze has a little shameless behaviour in the past

      0  

    Default


    HI binod dokania:
    thanks for report.
    this is odd! It is working fine in my IE6.
    could you post your code on here?
    or you can try to increase the 100 corresponding in the code:
    HTML Code:
     config.width = (Ext.isIE ? 100 : this.width);
    luck!

  4. #4
    Sencha User
    Join Date
    Nov 2007
    Posts
    294
    Vote Rating
    0
    Sesshomurai is on a distinguished road

      0  

    Default


    This is a good idea, but I think the presentation is a little awkward. All those floating paging bars looks a little clunky. So here's what I would do.

    1. Put a node at the end of the page of nodes that is a paging node, this way its contained within the parent of the nodes being paged and doesn't have to always be visible.
    2. Or put a single paging bar at the bottom of the tree control and have it page whatever parent node is selected.

    Either of those approaches would be cosmetically more concise and aesthetic so I will find some time to modify this in that way so y'all can see if it works for you.

  5. #5
    Ext User
    Join Date
    Mar 2009
    Posts
    17
    Vote Rating
    0
    binod dokania is on a distinguished road

      0  

    Default


    Hi,

    I am able to reproduce this in the example you attached.
    If you add this line in the html, you can see this behavior (i.e. paging bar appear under root group in IE7)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    I need this line to make other functionality working and make my code w3c compliance.

  6. #6
    Ext User
    Join Date
    Mar 2009
    Posts
    17
    Vote Rating
    0
    binod dokania is on a distinguished road

      0  

    Default


    I have managed to fix this issue by modifying following lines:
    Code:
    if(Ext.isIE){
    el = Ext.DomHelper.append(el,{tag:'div',style:'display: inline;white-space:nowrap;position:absolute'},true);
    and

    Code:
    autoCreate: {style:(Ext.isIE ? 'display: inline;white-space:nowrap;position:absolute;margin:-2px 0px;vertical-align:middle':'')},
    Hope it helps someone who faced similar issue.
    Last edited by mystix; 21 Jun 2009 at 11:06 PM. Reason: removed [SIZE=2][/SIZE] tags to avoid going blind while reading code

  7. #7
    Sencha User
    Join Date
    Mar 2008
    Posts
    129
    Vote Rating
    0
    art.home.ext is on a distinguished road

      0  

    Default


    Hi all !
    Thanks for this nice and helpful extension.

    I'm interested in displaying toolbar the way Sesshomurai described (in the last node of the paged node).
    Quote Originally Posted by Sesshomurai View Post
    This is a good idea, but I think the presentation is a little awkward. All those floating paging bars looks a little clunky. So here's what I would do.

    1. Put a node at the end of the page of nodes that is a paging node, this way its contained within the parent of the nodes being paged and doesn't have to always be visible.
    Unfortunately the toolbar is displayed before (I think and I can be wrong) children are rendered.
    How can I workaround this problem ?
    Thanks.

  8. #8
    Sencha User
    Join Date
    Mar 2008
    Posts
    129
    Vote Rating
    0
    art.home.ext is on a distinguished road

      0  

    Default [3.1.1] Compatibility

    [3.1.1] Compatibility


    Buttons are now too big
    Using :
    Code:
    .x-btn-icon .x-btn-small .x-btn-text{
    	height: 13px;
    	width: 13px;
    }
    fixes the problem.


    I've also added some treepanel listeners to hide pagingtoolbar on collapsed nodes :
    Code:
    'expandnode':function(sNode){if (sNode.attributes.ptb)sNode.attributes.ptb.show();this.body.unmask();},
    'collapsenode':function(sNode){if (sNode.attributes.ptb)sNode.attributes.ptb.hide();}

  9. #9
    Ext User
    Join Date
    Jul 2009
    Posts
    2
    Vote Rating
    0
    Jacky1234 is on a distinguished road

      0  

    Default


    Quote Originally Posted by xiexueze View Post
    HI,I rewrite the Ext.ux.tree.PagingTreeLoader to support the ext3.0 rc1

    this PagingTreeLoader has been tested in IE6/firefox3/chrome1/safari4

    PagingTreeLoader suports client paging and server paging:

    1.client paging uages:
    HTML Code:
    var tree = new Ext.tree.TreePanel({
        applyTo:'tree-ct', 
        width:300, 
        height:400, 
        autoScroll:true, 
        plugins: new Ext.ux.tree.TreeNodeMouseoverPlugin(),//must use the plugin 
        loader: new Ext.ux.tree.PagingTreeLoader({         //use the extend TreeLoader 
          dataUrl:'getNodes.jsp', 
          pageSize:10,                                    //the count of the childnode to show every time,default 20
          enableTextPaging:true,                          //whether to show the pagination's text 
          pagingModel:'local'                             //local means client paging ,remote means server paging,default local
        }), 
        root: new Ext.tree.AsyncTreeNode({ id:'0',text:'root' }) 
    });
    the server just get the 'node' parameter value,and return the JSON like this:
    HTML Code:
    [{id:1,text:'node1',leaf:false,children:[{...},...{...}]},{id:1,text:'node2',leaf:true},...,{id:100,text:'node100',leaf:true}]

    2.server paging uages:
    the js code just change the pagingModel value to 'remote'.
    the server will receive some parameters:
    node : the id of the node which is expending or paging
    start : the start index of the children,when the node first expends,the start value is 0
    limit : equals the jscode's pageSize,means the count of the node to show ervery time
    total : the total count of the node's children,when the node first expends,the total parameter dosen't exist.

    the server return the JSON like this:
    HTML Code:
    {total:200,nodes:[{id:1,text:'node1',leaf:false},...,{id:100,text:'node100',leaf:false}]}
    Hello,

    I also have a similair requirement about tree pagination, your demo looks good, but unfortunantly, the zip file you uploaded is invalid file, I can't extract it.
    Could you please upload it again? Many Thanks!

  10. #10
    Ext User
    Join Date
    Jul 2007
    Posts
    24
    Vote Rating
    -1
    xiexueze has a little shameless behaviour in the past

      0  

    Default


    hi Jacky1234
    I have download it again, the file can be extracted,and works fine, can you try again?
    thanks

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar