Having trouble binding CFTREE to CFGRID

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

EvolvedDSM - 31 May 2006 14:21 GMT

I have a CFTREE and CFGRID, both format=flash that I'm using to create an
inventory application for the purchased equipment that we have at my agency. I
populate both the tree and grid from an SQL database table. The tree consists
of 4 branches: Tree1->BuildingID->Room Number->ItemID. The grid has several
columns. What I would like to do is be able to click an item in the tree and
have it filter in the grid.

For example, if I click on "Building 1" in Tree1 (the top tier), I want the
CFGRID to list all items of Building 1. If I choose the room number 302
located in Building 1, I want all the items of room 302 to populate the CFGRID.
If I select a specific ItemID in room 302 of Building 1, I want to only see
that ItemID in the grid.

I'm having troubles understanding onChange and Bind objects. I don't know
which to use, and where to use them. Could someone help me with what I'm
looking for? My tree looks like this:

<cftree format="flash" name="tree1" height="420" width="240" appendkey="yes">
<cftreeitem
        query="Locations"
        value="Building, Room_Number, ItemID"
        display="Building, Room_Number, ItemID"
        expand="yes,no,no"
        img="file,file,document"
        imgopen="file,file,document"
        queryasroot="yes">
</cftree>

Reply to this Message

rmorgan - 31 May 2006 15:54 GMT

Not a complete answer, but may get you going. I use this for a single tree and
grid:

<cfform format="flash" preloader="true" width="550" height="635"
timeout="1000" skin="halosilver">
<cfformitem type="script">
    function applyFilter( term:String, grid:mx.controls.DataGrid, columns:Array
):Void
    {

    var filterTerm:String = term.toString().toLowerCase();
    if(filterTerm.length > 0)
    {
    if(_global.unfilteredData[grid.id] == undefined)
    {
    if (_global.unfilteredData == undefined)
    {
    _global.unfilteredData = {};
    }
    _global.unfilteredData[grid.id] = grid.dataProvider.slice(0);
    }
    var filteredData:Array = [];
    for(var i = 0; i< _global.unfilteredData[grid.id].length; i++)
    {
    var item:Object = _global.unfilteredData[grid.id]<i>;
    var added:Boolean = false;
    for(var j = 0; j< columns.length; j++)
    {
    if(!added)
    {
    var value:String = item[columns[j]].toString().toLowerCase();
    if(value.indexOf(filterTerm) != -1)
    {
    filteredData.push(item);
    added = true;
    }
    }
    else
    {
    break;
}
    }
    }
    grid.dataProvider = filteredData;
    }
    else
    {
    if(_global.unfilteredData[grid.id] != undefined) grid.dataProvider =
_global.unfilteredData[grid.id];
    }
    }
</cfformitem>

<cfformgroup type="panel" label="Staff Contacts" height="250" width="540"
style="headerColors:##C3D1E0">
<cfformgroup type="horizontal">
<cftree name="departmentTree" height="200" format="flash" width="345"
onchange="applyFilter(departmentTree.selectedNode.getProperty('data').value,cont
actList,['department'])" >
<cftreeitem display="Alumni Contacts" value="Alumni Contacts">
<cftreeitem value="department" query="getstaff" queryasroot="no" img="folder,
document" expand="yes" parent="alumni contacts">

</cftree>

<cfgrid name="contactList" query="getstaff" height="200" width="139"
rowheaders="no">
<cfgridcolumn name="FullName" values="#getstaff.department_id#" header="Name" >

Reply to this Message

Webmaster Forum / ColdFusion / Advanced Techniques / May 2006

Having trouble binding CFTREE to CFGRID