New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Editing XML Using RadGrid

RadGrid populated with XmlDataSource control

CompanyNameContactName
Alfreds FutterkisteMaria Anders
Antonio Moreno TaqueriaAna Trujillo
Around the HornAntonio Moreno
Berglunds snabbkopThomas Hardy
Blauer See DelikatessenChristina Berglund

Editable RadGrid populated with NeedDataSource event
 CompanyNameContactName 
Alfreds FutterkisteMaria Anders
Antonio Moreno TaqueriaAna Trujillo
Around the HornAntonio Moreno
Berglunds snabbkopThomas Hardy
Blauer See DelikatessenChristina Berglund

You can use XmlDataSource control and Telerik RadGrid to generate its content from XML . Automatic update, insert, and delete operations that work with other data source controls (AccessDataSource/SqlDataSource/ObjectDatSource) will not work in this case. You need to write custom code to modify data in the xml source.

The first Grid instance uses XmlDataSource to display XML data. The second Grid instance demonstrates one possible approach for manipulating XML data using LINQ-to-XML.

The data is loaded from the specified XML file in an in-memory object that is manipulated through LINQ syntax. Data is modified through the XElement, XAttribute, and XDocuemnt classes from the System.Xml.Linq namespace.

Update_Comand/Insert_Command/Delete_Command events are used to perform the respective operations. In these events the custom code should be used in order to moidfy the data.

  • DefaultVB.aspx
  • DefaultVB.aspx.vb
  • scripts.js
<%@ Page Language="VB" CodeFile="DefaultVB.aspx.vb" Inherits="Grid.Examples.DataEditing.XmlDataSourse.DefaultVB" ValidateRequest="false" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <script type="text/javascript" src="scripts.js"></script>
    <telerik:RadFormDecorator RenderMode="Lightweight" ID="RadFormDecorator1" runat="server" EnableRoundedCorners="false" DecorationZoneID="demo" DecoratedControls="All" />
    <div id="demo" class="demo-container no-bg">
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid2">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1"></telerik:AjaxUpdatedControl>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid2"></telerik:AjaxUpdatedControl>
                        <telerik:AjaxUpdatedControl ControlID="divMsg"></telerik:AjaxUpdatedControl>
                        <telerik:AjaxUpdatedControl ControlID="Notification1"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
        </telerik:RadAjaxLoadingPanel>
        <h2>RadGrid populated with XmlDataSource control</h2>
        <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" runat="server" DataSourceID="XmlDataSource1">
            <MasterTableView AutoGenerateColumns="false" DataKeyNames="CustomerID">
                <Columns>
                    <telerik:GridBoundColumn UniqueName="CompanyName" DataField="CompanyName" HeaderText="CompanyName"
                        HeaderStyle-Width="300px">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="ContactName" DataField="ContactName" HeaderText="ContactName"
                        HeaderStyle-Width="300px">
                    </telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
        <br />
        <h2>Editable RadGrid populated with NeedDataSource event</h2>
        <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid2" runat="server" ShowStatusBar="true" OnNeedDataSource="RadGrid2_NeedDataSource"
            OnInsertCommand="RadGrid2_InsertCommand" OnUpdateCommand="RadGrid2_UpdateCommand"
            OnDeleteCommand="RadGrid2_DeleteCommand">
            <MasterTableView AutoGenerateColumns="false" DataKeyNames="CustomerID" CommandItemDisplay="Top">
                <Columns>
                    <telerik:GridEditCommandColumn>
                    </telerik:GridEditCommandColumn>
                    <telerik:GridBoundColumn UniqueName="CompanyName" DataField="CompanyName" HeaderText="CompanyName"
                        HeaderStyle-Width="600px">
                        <ColumnValidationSettings EnableRequiredFieldValidation="true">
                            <RequiredFieldValidator ErrorMessage="You must provide company name!"></RequiredFieldValidator>
                        </ColumnValidationSettings>
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="ContactName" DataField="ContactName" HeaderText="ContactName"
                        HeaderStyle-Width="600px">
                        <ColumnValidationSettings EnableRequiredFieldValidation="true">
                            <RequiredFieldValidator ErrorMessage="You must provide contact name!"></RequiredFieldValidator>
                        </ColumnValidationSettings>
                    </telerik:GridBoundColumn>
                    <telerik:GridButtonColumn CommandName="Delete" Text="Delete" UniqueName="DeleteColumn">
                    </telerik:GridButtonColumn>
                </Columns>
            </MasterTableView>
            <ClientSettings>
                <ClientEvents OnRowDblClick="demo.RowDblClick"></ClientEvents>
            </ClientSettings>
        </telerik:RadGrid>
        <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/Xml/XmlDataSourceExampleTemp.xml"
            EnableCaching="false"></asp:XmlDataSource>
        <telerik:RadNotification RenderMode="Lightweight" ID="Notification1" runat="server" Position="BottomRight"
            AutoCloseDelay="10000" Width="350" Title="Current status" EnableRoundedCorners="true">
        </telerik:RadNotification>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance