This is a migrated thread and some comments may be shown as answers.

How to Convert Asp.net Grid code to Radgrid COde.

1 Answer 101 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Ravi asked on 12 Jul 2016, 08:13 AM

sc-1.png

this is my code in javascript, by using asp.net gridview .Now i am trying to convert it to the Radgrid code using javascript but i cant find the suitable value.

plz look below asp.net gridview javascript code.

var varRow1 = 0;
        var varcol = 0;
        var varIndex = 0;
        function fApplyToAllMenu(e, varLoop, varcell, varObj) {
            if (document.getElementById('<%=gvDetails.ClientID %>') != null) {
                var SelectAllObj = new Object();
                SelectAllObj = document.getElementById("<%=divApplyToAll.ClientID %>");

                var xPosition = getPosition(e).x + 15;
                var yPosition = getPosition(e).y + 5;
                SelectAllObj.style.position = "absolute";
                SelectAllObj.style.top = String(yPosition) + "px";
                SelectAllObj.style.left = String(xPosition) + "px";
                SelectAllObj.style.display = "inline";
                varIndex = varObj.parentNode.parentNode.rowIndex ;

                //varRow1 = varLoop;
                varRow1 = varObj.parentNode.parentNode.rowIndex ;
                if (varRow1 == 0)
                    varRow1 = 1;
                varcol = varcell;
            }
            return false;
        }

        function fApplyToAll() {
            if (document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('INPUT')[0] != null) {
                if (document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('INPUT')[0].readOnly == false) {
                    if (document.getElementById('<%=gvDetails.ClientID %>') != null)
                        if (document.getElementById('<%=gvDetails.ClientID %>').rows.length > 0)
                            for (var i = Number(varRow1); i < document.getElementById('<%=gvDetails.ClientID %>').rows.length - 1; i++) {
                                if (document.getElementById('<%=gvDetails.ClientID %>').rows[i + 1].cells[varcol].getElementsByTagName('INPUT')[0] != null)
                                    document.getElementById('<%=gvDetails.ClientID %>').rows[i + 1].cells[varcol].getElementsByTagName('INPUT')[0].value = document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('INPUT')[0].value;
                            }
                }
            }
            if (document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0] != null) {
                if (document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0].disabled == false) {
                    if (document.getElementById('<%=gvDetails.ClientID %>') != null)
                        if (document.getElementById('<%=gvDetails.ClientID %>').rows.length > 0)
                            for (var i = Number(varRow1); i < document.getElementById('<%=gvDetails.ClientID %>').rows.length - 1; i++) {
                                if (document.getElementById('<%=gvDetails.ClientID %>').rows[i + 1].cells[varcol].getElementsByTagName('SELECT')[0] != null) {
                                    document.getElementById('<%=gvDetails.ClientID %>').rows[i + 1].cells[varcol].getElementsByTagName('SELECT')[0].value = document.getElementById('<%=gvDetails.ClientID %>').rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0].value;

                                }
                            }
                }
            }

}

And this is my code. for Radgrid which i am using.

var varRow1 = 0;
        var varcol = 0;
        var varIndex = 0;

        function fApplyToAllMenu(e, varLoop, varcell, varObj) {
            debugger;
            var grid = $find("<%= griddetails.ClientID %>");
            if (grid != null) {
                var SelectAllObj = new Object();
                SelectAllObj = document.getElementById("<%=divApplyToAll.ClientID %>");

                var xPosition = getPosition(e).x + 15;
                var yPosition = getPosition(e).y + 5;
                SelectAllObj.style.position = "absolute";
                SelectAllObj.style.top = String(yPosition) + "px";
                SelectAllObj.style.left = String(xPosition) + "px";
                SelectAllObj.style.display = "inline";
                varIndex = varObj.parentNode.parentNode.rowIndex;

                varRow1 = varObj.parentNode.parentNode.rowIndex;
                if (varRow1 == 0)
                    varRow1 = 2;
                varcol = varcell + 2;
            }

            return false;
        }

        function fApplyToAll() {
            debugger;
            var grid = $find("<%= griddetails.ClientID %>");
            var MasterTable = grid.get_masterTableView();
            var Rows = MasterTable.get_dataItems();

            var elements = grid.getElementsByTagName("*");
            for (var i = 0; i < elements.length; i++) {
                var element = elements[i];
                if (element.id.indexOf(serverID) >= 0)
                    return element;
            }

            if (MasterTable.getCellByColumnUniqueName(Rows[varRow1].cells[varcol]).getElementsByTagName('INPUT')[0] != null) {
                if (Rows[varRow1].cells[varcol].getElementsByTagName('INPUT')[0].readOnly == false) {
                    if (grid != null) {
                        if (Rows.length > 0) {
                            for (var i = Number(varRow1) ; i < Rows.length; i++) {
                                if (Rows[i + 1].cells[varcol].getElementsByTagName('INPUT')[0] != null) {
                                    Rows[i + 1].cells[varcol].getElementsByTagName('INPUT')[0] = Rows[varRow1].cells[varcol].getElementsByTagName('INPUT')[0].value;
                                }
                            }
                        }
                    }
                }
            }

            if (Rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0] != null) {
                if (Rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0].disabled == false) {
                    if (grid != null) {
                        if (Rows.length > 0) {
                            for (var i = Number(varRow1) ; i < Rows.length; i++) {
                                if (Rows[i + 1].cells[varcol].getElementsByTagName('SELECT')[0] != null) {
                                    Rows[i + 1].cells[varcol].getElementsByTagName('SELECT')[0] = Rows[varRow1].cells[varcol].getElementsByTagName('SELECT')[0].value;
                                }
                            }
                        }
                    }
                }
            }

}

This code working for if i select checkbox in radgrid, then press my right click of mouse, then context menu open on click on that then all the below checkbox get also checked.
I am attaching the image file for this.

1 Answer, 1 is accepted

0

answered on 14 Jul 2016, 01:22 PM

Hello Ravi,

As I understand your scenario you would like to select all items in the grid when the user clicks "Apply to all". In that case you can iterate through the items in the grid and set each item as selected. Please examine the following article that describes client-side selection in more detail:

http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/functionality/selecting/selecting-rows/client-side-selecting-multiple-rows

Also, check out the RadGrid client-side API section in the documentation. That should get you started on how to get reference to a DataItem in the grid and set its properties.

Regards,
Viktor Tachev
Telerik by Progress

Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.

Tags

Grid

Asked by

Answers by