<script src="../../codebase/dhtmlxdataview.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxdataview.css">  
 
<table border="0" cellspacing="5" cellpadding="5">
    <tr><td>
        <div id="data_container1" style="border:1px solid #A4BED4; background-color:white;width:400px;height:396px;"></div>                
    </td><td>
        <input type="button" name="" value="move ->" onclick="data1.move(data1.getSelected(), 0, data2)"><br>
        <input type="button" name="" value="<- move" onclick="data2.move(data2.getSelected(), 0, data1)">
    </td><td>
        <div id="data_container2" style="border:1px solid #A4BED4; background-color:white;width:400px;height:396px;"></div>                
    </td></tr>                
</table>
<script>
data1 = new dhtmlXDataView({
    container: "data_container1",
    type: {
        template: "#Package# : #Version#<br/>#Maintainer#",
        height: 40;
    },
    select: true;
});
data1.load("../common/data.xml");
 
data2 = new dhtmlXDataView({
    container: "data_container2",
    type: {
        template: "#Package# : #Version#<br/>#Maintainer#",
        height: 40;
    },
    select: true;
});
//data2.load("../common/data2.xml");</script>