Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by FelipeTv on Jun 09, 2009 08:41
open dhtmlx forum
Pagination in arquivo.xml

Dear,

I am beginner and I am in the process of learning.
How do paging loading XML?
Follow my example:

<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="dhtmlxSuite/dhtmlxAccordion/codebase/skins/dhtmlxaccordion_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxFolders/codebase/dhtmlxfolders.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxLayout/codebase/dhtmlxlayout.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxLayout/codebase/skins/dhtmlxlayout_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxTree/codebase/dhtmlxtree.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxMenu/codebase/skins/dhtmlxmenu_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxToolbar/codebase/skins/dhtmlxtoolbar_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxWindows/codebase/dhtmlxwindows.css">
<link rel="STYLESHEET" type="text/css" href="dhtmlxSuite/dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_blue.css">



    <script src="dhtmlxSuite/dhtmlxLayout/codebase/dhtmlxlayout.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxAccordion/codebase/dhtmlxaccordion.js"></script>
<script src="dhtmlxSuite/dhtmlxWindows/codebase/dhtmlxwindows.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxWindows/codebase/ext/dhtmlxwindows_wmn.js" type="text/javascript"></script>
    <script src="dhtmlxSuite/dhtmlxWindows/codebase/ext/dhtmlxwindows_sb.js"></script>
<script src="dhtmlxSuite/dhtmlxWindows/codebase/ext/dhtmlxwindows_wtb.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxAjax/codebase/dhtmlxcommon.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxFolders/codebase/dhtmlxfolders.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgrid.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgridcell.js" type="text/javascript"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_splt.js"></script>
<script src="dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_pgn.js"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_filter.js"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_srnd.js"></script>
<script src="dhtmlxSuite/dhtmlxTree/codebase/dhtmlxtree.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxMenu/codebase/dhtmlxmenu.js" type="text/javascript"></script>
<script src="dhtmlxSuite/dhtmlxToolbar/codebase/dhtmlxtoolbar.js" type="text/javascript"></script>


<head>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0px;
overflow: hidden;
}
</style>
</head>

<body onload="doOnLoad();">

<div id="4task" style="width:100%; height:100%; margin:0px; overflow:hidden;"></div>
<div id="div_padding">teste
<span id="pagingArea"></span>tes <span id="infoArea">gggg</span>
<span id="recfound">tessss</span>
</div>

<script>
function doOnLoad()
{
    var dhxLayout = new dhtmlXLayoutObject("4task", "3L");
    //var dhxGrid = dhxLayout.cells("a").attachGrid();
    //var dhxTreeGrid = dhxLayout.cells("a").attachGrid();
    //var dhxTabbar = dhxLayout.cells("a").attachTabbar();
    //var dhxAccord = dhxLayout.cells("a").attachAccordion();
    //var dhxFolders = dhxLayout.cells("a").attachFolders();
    //var dhxMenu = dhxLayout.cells("a").attachMenu();
    //var dhxBar = dhxLayout.cells("a").attachToolbar();
    //var dhxEditor = dhxLayout.cells("a").attachEditor();
    //var statusbar = dhxLayout.cells("a").attachStatusBar();

    dhxLayout.cells("a").setText("Menu");
    dhxLayout.cells("a").setWidth(200);
    dhxLayout.cells("a").fixSize(true, false);
    dhxLayout.cells("b").setText("Caixa Entrada");
    dhxLayout.cells("c").setText("Conteúdo");

    var dhxAccord = dhxLayout.cells("a").attachAccordion();
    dhxAccord.addItem("a1", "Caixas");
    dhxAccord.addItem("a3", "Email");
    dhxAccord.addItem("a2", "Agenda");
    dhxAccord.openItem("a1");

    var Menu = dhxLayout.attachMenu();
    Menu.setImagePath("dhtmlxSuite/dhtmlxMenu/codebase/imgs/");
    Menu.setIconsPath("icons/");
    Menu.loadXML("xml/fileExplorerMenu.xml");

    var myToolbar = dhxLayout.cells("b").attachToolbar();
    myToolbar.setIconsPath("icons/")
    myToolbar.loadXML("xml/fileExplorerToolbar.xml");
    myToolbar.attachEvent("onClick",function(id){if(id=="search"){alert('')}else{alert('Please, select any row');}});
    myToolbar.attachEvent("onClick",function(id){if(id=="refresh"){carrega_cx()}});
    myToolbar.setValue("teste", "1");


    var tree = dhxLayout.cells("a").attachTree(0);
    tree.setImagePath("dhtmlxSuite/dhtmlxTree/codebase/imgs/csh_bluebooks/");
    tree.loadXML("xml/tree.xml");
    
    var statusBar = dhxLayout.attachStatusBar();
    statusBar.setText("Simple Status Bar");


function carrega_cx(){
    var mygrid = dhxLayout.cells("b").attachGrid();
    mygrid.setImagePath("dhtmlxSuite/dhtmlxGrid/codebase/imgs/");
    mygrid.setHeader("id,Title,Author,Price,In Store,Shipping,Bestseller,Published");
    mygrid.setInitWidths("50,150,150,80,80,80,80,200")
    mygrid.setColAlign("right,left,left,right,center,left,center,center")
    mygrid.setColTypes("ed,ed,ed,price,ch,co,ra,ro");
    mygrid.attachHeader("#text_filter,#text_filter,#text_search, ,#cspan,#cspan,#cspan,#cspan");
    mygrid.enableEditEvents(false,false,true);
    mygrid.attachEvent("onRowSelect",doOnRowSelected);
    mygrid.getCombo(5).put(2,2);
    mygrid.setColSorting("int,str,str,int,str,str,str,str")
    mygrid.setColumnColor("white,#d5f1ff,#d5f1ff")
    mygrid.setColumnMinWidth(50,0);
    mygrid.enableColumnMove(true);
    mygrid.attachEvent("onBeforeSorting",sortGridOnServer);

    mygrid.enableSmartRendering(true);

    mygrid.loadXML("xml/grid.xml");
    mygrid.init();

/*mygrid.setSkin("light");mygrid.init();
mygrid.attachEvent("onBeforePageChanged",function(){if(!this.iD())return false;return true;});
mygrid.lL(true,50,10,"pagingArea",true,"infoArea");
mygrid.setPagingSkin("bricks");
mygrid.attachEvent("onXLE",kg);*/





    function doOnRowSelected(id){
        if(id=="575"){dhxLayout.cells("c").attachURL("http://www.uol.com.br/"); return false}
        }
    }
carrega_cx();

}
</script>

</body>
</html>
Answer posted by Alex (support) on Jun 09, 2009 08:59

Hello, 

attachGrid() method attaches grid  to the cell automatically and doesn't place paging area into the cell. 

The possible solution is to attach status bar to the cell with grid. The paging area  should be placed into the status bar. 

The details can be found in the answer http://www.dhtmlx.com/docs/products/kb/index.shtml?cat=search&page=1&q=8623&ssr=yes&s=status%20bar