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

[Solved] RadGrid page change clears the table

1 Answer 224 Views

Grid

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

Brian asked on 24 Feb 2009, 08:33 AM

Hi Telerik forum, I have a simple problem I need help with.

I have a RadGrid that I need to populate with different data (depending on some parameters send to the page). I am trying to combine the two examples Edit on double click and Resizing RadGrid in RadSplitter to make a simple grid editor. In the source code here I just read an xml file to keep things simple.
I know that I do something fundamentally wrong, the question is what.
My two problems are:

1. If I try to change the grid page, all cells contains the text "System.Data.DataRowView" instead of the values and all column headings are blank.

2. If I double click a grid line to edit it, i get the following JavaScript error:
"Microsoft JScript runtime error: Sys.WebForms.PageRequestManagerServerErrorException: Specified argument was out of the range of valid values. Parameter name: index"

Can someone please help me correct this code to make it work?

I'm using telerik ASPNET AJAX Q3 2008 and visual studio 2008, but i guess that doesn't matter.

I hope someone can help me?

Source files:

Default.aspx

    
            <%@ Page Language="VB" CodeFile="Default.aspx.vb" Inherits="_Default" %> 
        
            <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %> 
        
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/tr/xhtml11/DTD/xhtml11.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head id="Head1" runat="server">  
        
            <title>RadGrid Test</title> 
        
            <style type="text/css">  
        
              html, body, form {  
        
              width: 100%;  
        
              height: 100%;  
        
              }  
        
            </style> 
        
            <script type="text/javascript" language="javascript">  
        
              var hasChanges, inputs, dropdowns, editedRow;  
        
              var lastRow = null;  
        
              function ClearEdit() {  
        
                var oGrid = $find("RadDataGrid");  
        
                if (oGrid && lastRow) {  
        
                  var mtv = oGrid.get_masterTableView();  
        
                  mtv.cancelUpdate(lastRow);  
        
                }  
        
              }  
        
              function EditRow() {  
        
                var oGrid = $find("RadDataGrid");  
        
                if (oGrid && editedRow)  
        
                {  
        
                  var mtv = oGrid.get_masterTableView();  
        
                  mtv.editItem(editedRow);  
        
                  lastRow = editedRow;  
        
                }  
        
              }  
        
              function CheckUpdates(grid) {  
        
                if (lastRow) {  
        
                  var mtv = grid.get_masterTableView();  
        
                  if (hasChanges) {  
        
                    if (confirm("Update changes?"))  
        
                      mtv.updateItem(lastRow);  
        
                  }  
        
                  hasChanges = false;  
        
                  var mtv = grid.get_masterTableView();  
        
                  mtv.cancelUpdate(lastRow);  
        
                  lastRow = null;  
        
                }  
        
              }  
        
              function RowClick(sender, eventArgs) {  
        
                CheckUpdates(sender);  
        
              }  
        
              function RowDblClick(sender, eventArgs) {  
        
                CheckUpdates(sender);  
        
                editedRow = eventArgs.get_itemIndexHierarchical();  
        
                setTimeout("EditRow()", 500);  
        
              }  
        
              function GridCommand(sender, args) {  
        
                if (args.get_commandName() != "Edit") {  
        
                  editedRow = null;  
        
                }  
        
              }  
        
               function GridCreated(sender, eventArgs) {  
        
                 var gridElement = sender.get_element();  
        
                 var elementsToUse = [];  
        
                 inputs = gridElement.getElementsByTagName("input");  
        
                 for (var i = 0; i < inputs.length; i++) {  
        
                   var lowerType = inputs[i].type.toLowerCase();  
        
                   if (lowerType == "hidden" || lowerType == "button") {  
        
                     continue;  
        
                   }  
        
                   Array.add(elementsToUse, inputs[i]);  
        
                   inputs[i].onchange = TrackChanges;  
        
                 }  
        
                 dropdowns = gridElement.getElementsByTagName("select");  
        
                 for (var i = 0; i < dropdowns.length; i++) {  
        
                   dropdowns[i].onchange = TrackChanges;  
        
                 }  
        
               }  
        
              function TrackChanges(e) {  
        
                hasChanges = true;  
        
              }  
        
              function ClientResized() {  
        
                $find("RadAjaxManager1").ajaxRequest('ChangePageSize');  
        
              }  
        
            </script> 
        
            </head> 
        
            <body> 
        
                <form runat="server" id="mainForm" method="post" style="width: 100%;">  
        
                    <telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True">  
        
                    </telerik:RadScriptManager> 
        
                    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">  
        
                        <AjaxSettings> 
        
                            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">  
        
                                <UpdatedControls> 
        
                                    <telerik:AjaxUpdatedControl ControlID="RadDataGrid" /> 
        
                                </UpdatedControls> 
        
                            </telerik:AjaxSetting> 
        
                            <telerik:AjaxSetting AjaxControlID="RadDataGrid">  
        
                                <UpdatedControls> 
        
                                    <telerik:AjaxUpdatedControl ControlID="RadDataGrid" /> 
        
                                </UpdatedControls> 
        
                            </telerik:AjaxSetting> 
        
                        </AjaxSettings> 
        
                    </telerik:RadAjaxManager> 
        
                    <telerik:RadSplitter ID="RadSplitter1" Runat="server" BorderStyle="None" FullScreenMode="True" Orientation="Horizontal">  
        
                      <telerik:RadPane ID="RadPane1" Runat="server" OnClientResized="ClientResized" 
        
                        EnableEmbeddedBaseStylesheet="False" EnableEmbeddedSkins="False" Height="100%"   
        
                        Index="0" Skin="" Width="100%" Scrolling="None">  
        
                        <telerik:RadGrid ID="RadDataGrid"  AutoGenerateColumns="false" 
        
                          runat="server" AllowAutomaticUpdates="true" AllowMultiRowSelection="True"   
        
                          AllowPaging="True" Height="97%" ShowStatusBar="true" Skin="Office2007"   
        
                          Width="97%">  
        
                          <HeaderContextMenu EnableTheming="True" Skin="Office2007">  
        
                            <CollapseAnimation Duration="200" Type="OutQuint" /> 
        
                          </HeaderContextMenu> 
        
                          <PagerStyle Mode="NumericPages" /> 
        
                          <ClientSettings> 
        
                            <ClientEvents OnCommand="GridCommand" OnGridCreated="GridCreated" OnRowClick="RowClick" OnRowDblClick="RowDblClick" /> 
        
                              <Selecting AllowRowSelect="True" EnableDragToSelectRows="False" /> 
        
                              <Scrolling AllowScroll="True" UseStaticHeaders="False" FrozenColumnsCount="0" SaveScrollPosition="True" ></Scrolling>                    
        
                          </ClientSettings> 
        
                          <FilterMenu EnableTheming="True" Skin="Office2007">  
        
                            <CollapseAnimation Duration="200" Type="OutQuint" /> 
        
                          </FilterMenu> 
        
                          <MasterTableView AutoGenerateColumns="false" EditMode="InPlace" EnableViewState="True" Width="100%">  
        
                          </MasterTableView> 
        
                        </telerik:RadGrid> 
        
                      </telerik:RadPane> 
        
                    </telerik:RadSplitter> 
        
                </form> 
        
            </body> 
        
            </html>

Default.aspx.vb

    
            Imports System  
        
            Imports Telerik.Web.UI  
        
            Partial Public MustInherit Class _Default  
        
              Inherits System.Web.UI.Page  
        
              Protected Sub RadDataGrid_ItemUpdated(ByVal source As Object, ByVal e As GridUpdatedEventArgs) Handles RadDataGrid.ItemUpdated  
        
                If Not e.Exception Is Nothing Then 
        
                  e.KeepInEditMode = True 
        
                  e.ExceptionHandled = True 
        
                  ' Error  
        
                Else 
        
                  Dim dataItem As GridDataItem = e.Item  
        
                  ' Do Update  
        
                End If 
        
              End Sub 
        
              Sub addcolumn(ByVal name As String, ByVal uniquename As String, ByVal width As Integer, ByVal FirstSelectColumn As Boolean)  
        
                Dim GridColumn As Object 
        
                If FirstSelectColumn Then 
        
                  GridColumn = New GridClientSelectColumn  
        
                  GridColumn.CommandName = name  
        
                  GridColumn.Text = name  
        
                Else 
        
                  GridColumn = New GridBoundColumn  
        
                  GridColumn.DataField = name  
        
                  CType(GridColumn, GridBoundColumn).ItemStyle.HorizontalAlign = HorizontalAlign.Left  
        
                  CType(GridColumn, GridBoundColumn).ItemStyle.VerticalAlign = VerticalAlign.Top  
        
                End If 
        
                GridColumn.HeaderText = name  
        
                GridColumn.UniqueName = uniquename  
        
                GridColumn.Resizable = False 
        
                GridColumn.Reorderable = False 
        
                GridColumn.ItemStyle.Width = Unit.Pixel(width)  
        
                RadDataGrid.Columns.Add(GridColumn)  
        
              End Sub 
        
              Private Sub LoadGridData()  
        
                Dim oTable As New System.Data.DataTable("company")  
        
                oTable.ReadXml(Server.MapPath("TopCompanies.xml"))  
        
                RadDataGrid.DataSource = oTable  
        
                If Not Page.IsPostBack Then 
        
                  addcolumn("Select", "SelectColumn", 25, True)  
        
                  addcolumn("CompanyId", "CompanyIdColumn", 40, False)  
        
                  addcolumn("CompanyName", "CompanyNameColumn", 200, False)  
        
                  addcolumn("Employees", "EmployeesColumn", 100, False)  
        
                End If 
        
              End Sub 
        
              Private Sub RadDataGrid1_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadDataGrid.NeedDataSource  
        
                LoadGridData()  
        
              End Sub 
        
              Protected Sub RadAjaxManager1_AjaxRequest(ByVal sender As Object, ByVal e As Telerik.Web.UI.AjaxRequestEventArgs) Handles RadAjaxManager1.AjaxRequest  
        
                Select Case e.Argument.ToString()  
        
                  Case "ChangePageSize" 
        
                    Dim rows As Integer = (Int32.Parse(Me.RadPane1.Height.Value.ToString()) - 106) / 27  
        
                    If rows >= 1 Then 
        
                      RadDataGrid.PageSize = rows  
        
                      RadDataGrid.Rebind()  
        
                    End If 
        
                    Exit Select 
        
                End Select 
        
              End Sub 
        
            End Class

TopCompanies.xml

    
            <?xml version="1.0" encoding="UTF-8"?>  
        
            <NewDataSet> 
        
              <xs:schema id="NewDataSet" xmlns="" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">  
        
                <xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:UseCurrentLocale="true">  
        
                  <xs:complexType> 
        
                    <xs:choice minOccurs="0" maxOccurs="unbounded">  
        
                      <xs:element name="company">  
        
                        <xs:complexType> 
        
                          <xs:sequence> 
        
                            <xs:element name="CompanyId" type="xs:int" minOccurs="0" /> 
        
                            <xs:element name="CompanyName" type="xs:string" minOccurs="0" /> 
        
                            <xs:element name="Employees" type="xs:int" minOccurs="0" /> 
        
                          </xs:sequence> 
        
                        </xs:complexType> 
        
                      </xs:element> 
        
                    </xs:choice> 
        
                  </xs:complexType> 
        
                </xs:element> 
        
              </xs:schema> 
        
                <company> 
        
                  <CompanyId>1</CompanyId> 
        
                  <CompanyName>Wal-Mart Stores</CompanyName> 
        
                  <Employees>1800000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>2</CompanyId> 
        
                  <CompanyName>McDonald's</CompanyName> 
        
                  <Employees>447000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>3</CompanyId> 
        
                  <CompanyName>United Parcel Service</CompanyName> 
        
                  <Employees>407000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>4</CompanyId> 
        
                  <CompanyName>Sears Holdings</CompanyName> 
        
                  <Employees>355000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>5</CompanyId> 
        
                  <CompanyName>Home Depot</CompanyName> 
        
                  <Employees>345000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>6</CompanyId> 
        
                  <CompanyName>Target</CompanyName> 
        
                  <Employees>337000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>7</CompanyId> 
        
                  <CompanyName>Intl. Business Machines</CompanyName> 
        
                  <Employees>329373</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>8</CompanyId> 
        
                  <CompanyName>General Motors</CompanyName> 
        
                  <Employees>327000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>9</CompanyId> 
        
                  <CompanyName>General Electric</CompanyName> 
        
                  <Employees>316000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>10</CompanyId> 
        
                  <CompanyName>Citigroup</CompanyName> 
        
                  <Employees>303000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>11</CompanyId> 
        
                  <CompanyName>Ford Motor</CompanyName> 
        
                  <Employees>300000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>12</CompanyId> 
        
                  <CompanyName>Kroger</CompanyName> 
        
                  <Employees>289000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>13</CompanyId> 
        
                  <CompanyName>Albertson's</CompanyName> 
        
                  <Employees>240000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>14</CompanyId> 
        
                  <CompanyName>United Technologies</CompanyName> 
        
                  <Employees>222200</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>15</CompanyId> 
        
                  <CompanyName>Verizon Communications</CompanyName> 
        
                  <Employees>217000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>16</CompanyId> 
        
                  <CompanyName>FedEx</CompanyName> 
        
                  <Employees>215838</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>17</CompanyId> 
        
                  <CompanyName>Safeway</CompanyName> 
        
                  <Employees>201000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>18</CompanyId> 
        
                  <CompanyName>Altria Group</CompanyName> 
        
                  <Employees>199000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>19</CompanyId> 
        
                  <CompanyName>Aramark</CompanyName> 
        
                  <Employees>195000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>20</CompanyId> 
        
                  <CompanyName>Berkshire Hathaway</CompanyName> 
        
                  <Employees>192012</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>21</CompanyId> 
        
                  <CompanyName>AT&amp;T</CompanyName> 
        
                  <Employees>189950</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>22</CompanyId> 
        
                  <CompanyName>Delphi</CompanyName> 
        
                  <Employees>185200</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>23</CompanyId> 
        
                  <CompanyName>Bank of America Corp.</CompanyName> 
        
                  <Employees>176638</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>24</CompanyId> 
        
                  <CompanyName>J.P. Morgan Chase &amp; Co.</CompanyName> 
        
                  <Employees>168847</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>25</CompanyId> 
        
                  <CompanyName>Yum Brands</CompanyName> 
        
                  <Employees>165920</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>26</CompanyId> 
        
                  <CompanyName>HCA</CompanyName> 
        
                  <Employees>165450</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>27</CompanyId> 
        
                  <CompanyName>Lowe's</CompanyName> 
        
                  <Employees>164794</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>28</CompanyId> 
        
                  <CompanyName>PepsiCo</CompanyName> 
        
                  <Employees>157000</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>29</CompanyId> 
        
                  <CompanyName>Walgreen</CompanyName> 
        
                  <Employees>155200</Employees> 
        
                </company> 
        
                <company> 
        
                  <CompanyId>30</CompanyId> 
        
                  <CompanyName>Wells Fargo</CompanyName> 
        
                  <Employees>153500</Employees> 
        
                </company> 
        
            </NewDataSet>

1 Answer, 1 is accepted

answered on 27 Feb 2009, 09:51 AM

testregulargrid.zip

Hello Brian,

In my attempt to reproduce the described error I created a test application. I used advanced data-binding. On my end everything works as expected. If you are using XML data source, you will need to use XMLDataSource and define the update command properly. Only in this case you can use Automatic CRUD operations. Bear in mind that in my test application I did not handled the update of the row.

Kind regards,
Georgi Krustev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.