DHTMLX Docs & Samples Explorer

### Drag-and-drop with auto scroll

Source

    <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:480px;height:396px;"></div>
        </td><td>
        </td><td>
            <div id="data_container2" style="border:1px solid #A4BED4;background-color:white;width:480px;height:396px;"></div>
        </td></tr>
    </table>
    <script>data1 = new dhtmlXDataView({
        container: "data_container1",
        auto_scroll: true,
        type: {
            template: "<span class='dhx_strong'>#Maintainer#</span>#Package# <span class='dhx_light'>#Version#</span>",
            height: 35;
        },
        drag: true;
    });
    data1.load("../common/data.xml");

    data2 = new dhtmlXDataView({
        container: "data_container2",
        type: {
            template: "<span class='dhx_strong'>#Maintainer#</span>#Package# <span class='dhx_light'>#Version#</span>",
            height: 35;
        },
        drag: true;
    });
    data2.add({
        Package: "Drop here",
        Version: "0.1",
        Maintainer: "dhtmlx";
    });</script>