updating/refereshing dojo datagrid with new store value on combobox value changes

Posted by Raj on Stack Overflow See other posts from Stack Overflow or by Raj
Published on 2010-05-03T20:34:11Z Indexed on 2010/05/03 20:38 UTC
Read the original article Hit count: 1151

Filed under:
|
|

hey all,

I have a combo box and a datagrid in my page. when the user changes the combo box value i have to update the grid with children details of newly selected parent. How can I achieve this using Dojo combo box and datagrid.

the following code snippet not working for me. when I use setStore method on the grid with new json data.

<div dojoType="dojo.data.ItemFileReadStore" jsId="store" url="/child/index/"></div> // grid store

<div dojoType="dojo.data.ItemFileReadStore" jsId="parentStore" url="/parent/index/"></div> // combo box store

//combo box

<input dojoType="dijit.form.ComboBox" value="Select" width="auto"  store="parentStore" searchAttr="name" name="parent" id="parent" onchange="displayChildren()"> 

//MY GRID

<table dojoType="dojox.grid.DataGrid" jsId="grid" store="store" id="display_grid"
    query="{ child_id: '*' }" rowsPerPage="2" clientSort="true"
    singleClickEdit="false" style="width: 90%; height: 400px;"
    rowSelector="20px" selectionMode="multiple">
    <thead>
        <tr>
            <th field="child_id" name="ID" width="auto" editable="false"
                hidden="true">Text</th>
            <th field="parent_id" name="Parent" width="auto"
                editable="false" hidden="true">Text</th>
            <th field="child_name" name="child" width="300px" editable="false">Text</th>
            <th field="created" name="Created Date" width="200px"
                editable="false" cellType='dojox.grid.cells.DateTextBox'
                datePattern='dd-MMM-yyyy'></th>
            <th field="last_updated" name="Updated Date" width="200px"
                editable="false" cellType='dojox.grid.cells.DateTextBox'
                datePattern='dd-MMM-yyyy'></th>
            <th field="child_id" name="Edit/Update" formatter="fmtEdit"></th>
        </tr>
    </thead>
</table>

//onchange method of parent combo box in which i am trying to reload the grid with new data from the server.

function displayChildren() {
                var selected = dijit.byId("parent").attr("value");
                var grid = dojo.byId('display_grid');
                var Url = "/childsku/index/parent/" + selected;
                grid.setStore(new dojo.data.ItemFileReadStore({ url: Url }));
            }

But its not updating my grid with new contents. I don know how to refresh the grid every time users changes the combo box value.

Could anyone help me to solve this issue...

I would be glad if I get the solution for both ItemFileReadStore and ItemFileWrireStore.

Thanks

Raj..

© Stack Overflow or respective owner

Related posts about refresh

Related posts about dojo