Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Paul on Oct 08, 2008 01:13
open dhtmlx forum
splitAt(1) not working

Hi,

We're evaluating the TreeGrid control and cannot get the splitAt component to work.

Any ideas?

function doSetupGridHeaders(grid, headers, oncelledithandler) {

grid.clearAll();
// Prepare header and column details
var headerLine1 = "Tree,WorkItemId";
var colWidths = "120,80";
var colAlignments = "left,left";
var colTypes = "tree,ro";

for (var i = 0; i < headers.length; i++) {
headerLine1 += "," + headers[i];
colWidths += ",120";
colAlignments += ",center";
colTypes += ",co";
}

//Create headers & set column details
grid.setHeader(headerLine1);
grid.setInitWidths(colWidths);
grid.setColAlign(colAlignments);
grid.setColTypes(colTypes);
grid.setColumnHidden(1, true);
grid.attachEvent("onEditCell", oncelledithandler);
grid.setSkin("light");
grid.splitAt(1);
grid.init();
}


Thanks, Paul.
Answer posted by Support on Oct 08, 2008 01:34
- be sure that dhtmlxgrid_splt.js included in html page
- splitAt must be executed only after grid initialization 
            grid.init();
            grid.splitAt(1); 

Answer posted on Oct 08, 2008 01:59

I've added the missing script reference and rejigged my code, and now get:

'this.obj.firstChild' is null or not an object

Any ideas?

Thanks, Paul.

Answer posted by Support on Oct 08, 2008 04:07
The code snippet, posted above, works correctly in local samples ( sample sent by email )

Please check that container DIV of grid has not any inner content on moment of grid initialization, also, beware that splitAt command can be aplied to the grid only once, you can't apply it to the same grid, second time. 


Answer posted on Oct 08, 2008 04:57

Hi,

I still can't get it to run. Could you take a look at this page and tell me why the splitAt fails?

 

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <!-- dhtmlx Grid -->
    <link rel="STYLESHEET" type="text/css" href="/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.css">
    <script src="/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
    <script src="/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
    <script src="/Scripts/dhtmlx/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
    <script src="/Scripts/dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_splt.js"></script>

    <!-- dhtmlx TreeGrid Extension -->
    <script src="/Scripts/dhtmlx/dhtmlxTreeGrid/codebase/dhtmlxtreegrid.js"></script>

    <script type="text/javascript">
        var mygrid;
        function doInitGrid() {
            mygrid = new dhtmlXGridObject('mygrid_container');
            mygrid.setImagePath("codebase/imgs/");
            mygrid.setHeader("Model,Qty,Price");
            mygrid.setInitWidths("*,150,150");
            mygrid.setColAlign("left,right,right");
            mygrid.setSkin("light");
            mygrid.init();

            mygrid.splitAt(1);

            mygrid.addRow(1, ['111', '222', '333']);
            mygrid.addRow(1, ['aaa', 'bbb', 'ccc']);

        }
    </script>

    <title></title>
</head>
<body onload="doInitGrid();">
    <form id="form1" runat="server">
    <div>
           <div id="mygrid_container" style="width:600px;height:150px;"></div> 
    </div>
    </form>
</body>
</html>

 

Answer posted by Support on Oct 08, 2008 06:54
>>mygrid.setInitWidths("*,150,150");
You can't use * in left part of splitted grid, it must be some fixed value. 

Except of that - sample is fully correct, and works without problems ( sent by email )
If problem still occurs for you - please try to use dhtmlxgrid_splt.js from the sample instead of original one.