[Solved] editmode client-side in Hierarchy grid

[Christian Hanke]

Hi there,

i have some problems and cant find a solution to sort it out.
let me first describe the situation. i have a grid, which contains a detailsview. this detailsview also contains a detailsview. So i have a 3 level hierachy grid. now i wanna do some client events like onrowclick and onrowdblclick.
if u click on a row, these record should be set in edit mode and if i dblclick on a row, the record should expand.
well, expanding in all hierarchy levels is working very well, but the rowclick event make some problems.


the first problem is: if i click on a row, my ie7 shows a warning message like this:

"do you wanna stop this script? a script on this site causes a delay on IE....."
I dont know how the correct translation is because i dont use the IE in english, but u should know what these messages means.

2nd problem is: if i navigate through my grid and expand one row at 1st level, then expand on 2nd level and then edit 3rd level row and then collapse all and i want to edit some more row i got these errormessage:
a runtime error occurs
Error: Object required

3rd problem is: since i integrated these js function my radgrid is working very slow and i dont know why?

This is my Code:

    var isDoubleClick = false;
    var clickHandler = null;
    var editedRow = null;


    function RowClick(sender, eventArgs) {
        editedRow = eventArgs.get_itemIndexHierarchical();
        isDoubleClick = false;
        if (clickHandler) {
            window.clearTimeout(clickHandler);
            clickHandler = null;
        }
        clickHandler = window.setTimeout(ActualClick, 200);
    }

    function RowDblClick(sender, eventArgs) {
        editedRow = eventArgs.get_itemIndexHierarchical();
        tableView = eventArgs.get_tableView();
        isDoubleClick = true;
        if (clickHandler) {
            window.clearTimeout(clickHandler);
            clickHandler = null;
        }
        clickHandler = window.setTimeout(ActualClick, 200);
    }

    function ActualClick() {
        var tableview;
        if (isDoubleClick) {
            var rowIndex = editedRow
            if (rowIndex.indexOf(':') != -1) {
                rowIndex = rowIndex.substr(rowIndex.lastIndexOf('_') + 1);
            }
            var row = tableView.get_dataItems()[rowIndex];
            if (tableView.getCellByColumnUniqueName(row, "ExpandColumn")) {
                if (row.get_expanded() == false) {
                    row.set_expanded(true);
                    imageButton = tableView.getCellByColumnUniqueName(row, "ExpandColumn").childNodes[0];
                    imageButton.className = "rgCollapse";
                }
                else {
                    row.set_expanded(false);
                    imageButton = tableView.getCellByColumnUniqueName(row, "ExpandColumn").childNodes[0];
                    imageButton.className = "rgExpand";
                }
            }

        }
        else {
            //debugger;
            var x = editedRow;
            var grid = $find("<%=Orders_RadGrid1.ClientID %>");
            var name;
            tableview = $find("<%=Orders_RadGrid1.ClientID %>").get_masterTableView();
            if (editedRow.indexOf(':') != -1) {
                var detailstable = grid.get_detailTables();
                var tmp = editedRow.substring(editedRow.indexOf(':')+1, editedRow.length);
                if (tmp.indexOf(':') != -1) {
                    editedRow = editedRow.substr(editedRow.lastIndexOf('_') + 1);
                    tableview = detailstable[1];
                    name = detailstable[1].get_name();
                } else {
                    editedRow = editedRow.substr(editedRow.lastIndexOf('_') + 1);
                    tableview = detailstable[0];
                    name = detailstable[0].get_name();
                }

            }
            tableview.editItem(x);
        }
    }

Maybe there is a easier way to get a row in edit mode.

Thanks,
Chris

[Christian Hanke]

i have just noticed, that the problem not depends on the onrowclick event.
you can set an attribute for your diffenrent views called HierarchyLoadMode  and there diffenrent settings = ServerOnDemand, Serverbind and Client. I forgot to say then u use client. but i just noticed, if this attribute is set to serverondemand oder severbind the warning message is not showing and my grid as slow as before. the speed is normal now.

Any Suggestions?
Chris

[Tsvetoslav]

Hello Christian Hanke,

 The easiest way to put the items in edit mode on row-click is as follows:

function rowClick(sender, args)
{
    var dataItems = args.get_tableView().get_dataItems();
    for (var i = 0; i < dataItems.length; i++)
    {
        if (dataItems[i]._itemIndexHierarchical == args.get_itemIndexHierarchical())
        {
            args.get_tableView().editItem(dataItems[i].get_element());
        }
    }
}

To expand an item, you can take advanate of the following client-api method of the grid:
http://www.telerik.com/help/aspnet-ajax/grid_set_expanded.html

I hope this helps.

All the best,
Tsvetoslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.