Insert/Update/Delete content items with RadGrid for ASP.NET AJAX
by
The Progress Team
Posted on
December 06, 2009
The content you're reading is getting on in years.
This post is on the older side and its content may be out of date.
Be sure to visit our blogs homepage for our latest news, updates and information.
In the following blog post I'm going to show you how to create a custom control that uses one of the most powerful controls form Telerik.Web.UI suite - RadGrid for ASP.NET AJAX and its functionality to Insert/Update/Delete content items. The control will allow you to populate the RadGrid with items from different Generic Content providers and then manipulate the items from Sitefinity's front-end. First we need to create a template for our custom control. In this template I will put the following controls:
- RadComboBox which I will use to switch the providers and rebind the RadGrid by setting the combobox' AutoPostBack property to true.
- RadGrid for ASP.NET AJAX with several columns:
- "Name" of the content item
- "Content" of the items
- "Edit"
- "Delete"
- RadAjaxManagerProxy and RadAjaxLoadingPanel
| <%@ Control Language="C#"AutoEventWireup="true"CodeFile="GridContentEditorTemplate.ascx.cs"Inherits="CustomControls_GridContentEditorTemplate" %> |
| <script type="text/javascript"> |
| function RemoveItem(object, args) { |
| var combo = $find("<%= RadComboBox1.ClientID %>"); |
| if (combo.findItemByText("Libraries") != null) { |
| combo.trackChanges(); |
| combo.get_items().remove(combo.findItemByText("Libraries")); |
| combo.commitChanges(); |
| } |
| } |
| </script> |
| <telerik:RadAjaxManagerProxy ID="RadAjaxManager1"runat="server"> |
| <AjaxSettings> |
| <telerik:AjaxSetting AjaxControlID="RadGrid1"> |
| <UpdatedControls> |
| <telerik:AjaxUpdatedControl ControlID="RadGrid1"LoadingPanelID="RadAjaxLoadingPanel1"/> |
| </UpdatedControls> |
| </telerik:AjaxSetting> |
| </AjaxSettings> |
| </telerik:RadAjaxManagerProxy> |
| <telerik:RadAjaxLoadingPanel runat="server"ID="RadAjaxLoadingPanel1"BackgroundPosition="Center"> |
| <asp:Image runat="server"ID="Image1"ImageUrl="~/Images/ajax-loader.gif"/> |
| </telerik:RadAjaxLoadingPanel> |
| <telerik:RadComboBox ID="RadComboBox1"OnClientLoad="RemoveItem"runat="server"Skin="Black"/> |
| <telerik:RadGrid id="RadGrid1"runat="server"Skin="Black" > |
| <MasterTableView EditMode="InPlace"CommandItemDisplay="TopAndBottom"AutoGenerateColumns="False"DataKeyNames="ID"AllowAutomaticInserts="true"> |
| <EditFormSettings InsertCaption="Add new item"CaptionFormatString="Edit Item: {0}"CaptionDataField="ID"PopUpSettings-Modal="true"/> |
| <Columns> |
| <telerik:GridBoundColumn HeaderText="ContentName"UniqueName="Name"></telerik:GridBoundColumn> |
| <telerik:GridBoundColumn HeaderText="Content"DataField="Content"UniqueName="Content"></telerik:GridBoundColumn> |
| <telerik:GridEditCommandColumn HeaderText="Edit"UniqueName="EditCommandColumn"></telerik:GridEditCommandColumn> |
| <telerik:GridButtonColumn CommandName="Delete"Text="Delete"HeaderText="Delete" |
| UniqueName= "DeleteColumn"/> |
| </Columns> |
| </MasterTableView> |
| </telerik:RadGrid> |
In this template I subscribed for the OnClientLoad event of RadComboBox control. This is because I need to remove one of the providers that are populated in the custom control on the server. I have to remove the Libraries provider, because it uses binary data. You can remove the provider from the list if you add a condition inside the "if" check in the GCProviders method, like:
if (provider !=null && provider.Name != "Libraries")
The custom control:
Here I inherited from the SimpleControl class and overrode the LayoutTemplatePath. Here I set the path to my template which has RadGrid, RadComboBox, RadAjaxManagerProxy and RadAjaxLoadingPanel declarations. I created a new property for the provider name which gets the value from the RadComboBox SelectedItem.
| publicoverridestring LayoutTemplatePath |
| { |
| get |
| { |
| return"~/CustomControls/GridContentEditorTemplate.ascx"; |
| } |
| } |
| publicstring ProviderName |
| { |
| get |
| { |
| return Combo.SelectedItem.Text; |
| } |
| } |
Inside InitializeControls I bound the RadCombobox and subscribed for RadGrid's events - PreRender, UpdateCommand, DeleteCommand, NeedDataSource, InsertCommand
| protectedoverridevoid InitializeControls(System.Web.UI.Control controlContainer) |
| { |
| base.InitializeControls(controlContainer); |
| this.Combo.DataSource = GCProviders(); |
| this.Combo.AutoPostBack = true; |
| this.Combo.DataBind(); |
| Grid.PreRender += new EventHandler(Grid_PreRender); |
| Grid.UpdateCommand += new GridCommandEventHandler(Grid_UpdateCommand); |
| Grid.DeleteCommand += new GridCommandEventHandler(Grid_DeleteCommand); |
| Grid.NeedDataSource += new GridNeedDataSourceEventHandler(Grid_NeedDataSource); |
| Grid.InsertCommand += new GridCommandEventHandler(Grid_InsertCommand); |
| Grid.AllowMultiRowEdit = true; |
| } |
As some of the providers like GenericContent and Wiki have different metakeys for the "Title", I had to dynamically change the GridBoundColumn value inside Grid's PreRender event handler and then rebind the grid.
| void Grid_PreRender(object sender, EventArgs e) |
| { |
| foreach (GridColumn column in Grid.Columns) |
| { |
| if (column.UniqueName == "Name") |
| { |
| if (this.ProviderName == WikiProviderName || this.ProviderName == GenericContentProviderName) |
| { |
| (column as GridBoundColumn).DataField = "Name"; |
| break; |
| } |
| (column as GridBoundColumn).DataField = "Title"; |
| } |
| } |
| Grid.Rebind(); |
| } |
To check the provider I created a helper method, whose value I passed inside the Insert, Update, Delete event handlers.
| { |
| if ((providerName != GenericContentProviderName) && (providerName != WikiProviderName)) |
| { |
| returntrue; |
| } |
| else |
| { |
| returnfalse; |
| } |
| } |
You can find the complete code below:
| using System; |
| using System.Collections.Generic; |
| using System.Linq; |
| using System.Web; |
| using Telerik.Cms.Web.UI; |
| using Telerik.Web.UI; |
| using System.Collections; |
| using Telerik.Cms.Engine; |
| using Telerik.News; |
| using System.Web.UI.WebControls; |
| using Telerik.News.WebControls.Admin; |
| /// <summary> |
| /// Summary description for GridContentEditor |
| /// </summary> |
| publicclass GridContentEditor : SimpleControl |
| { |
| public GridContentEditor() |
| { |
| } |
| #region Properties |
| publicoverridestring LayoutTemplatePath |
| { |
| get |
| { |
| return"~/CustomControls/GridContentEditorTemplate.ascx"; |
| } |
| } |
| publicstring ProviderName |
| { |
| get |
| { |
| return Combo.SelectedItem.Text; |
| } |
| } |
| |
| #endregion |
| |
| #region Methods |
| protectedoverridevoid InitializeControls(System.Web.UI.Control controlContainer) |
| { |
| base.InitializeControls(controlContainer); |
| this.Combo.DataSource = GCProviders(); |
| this.Combo.AutoPostBack = true; |
| this.Combo.DataBind(); |
| Grid.PreRender += new EventHandler(Grid_PreRender); |
| Grid.UpdateCommand += new GridCommandEventHandler(Grid_UpdateCommand); |
| Grid.DeleteCommand += new GridCommandEventHandler(Grid_DeleteCommand); |
| Grid.NeedDataSource += new GridNeedDataSourceEventHandler(Grid_NeedDataSource); |
| Grid.InsertCommand += new GridCommandEventHandler(Grid_InsertCommand); |
| |
| Grid.AllowMultiRowEdit = true; |
| } |
| void Grid_PreRender(object sender, EventArgs e) |
| { |
| foreach (GridColumn column in Grid.Columns) |
| { |
| if (column.UniqueName == "Name") |
| { |
| if (this.ProviderName == WikiProviderName || this.ProviderName == GenericContentProviderName) |
| { |
| (column as GridBoundColumn).DataField = "Name"; |
| break; |
| } |
| (column as GridBoundColumn).DataField = "Title"; |
| } |
| } |
| Grid.Rebind(); |
| } |
| void Grid_InsertCommand(object source, GridCommandEventArgs e) |
| { |
| manager = new ContentManager(ProviderName); |
| GridEditableItem editedItem = e.Item as GridEditableItem; |
| Hashtable newValues = new Hashtable(); |
| e.Item.OwnerTableView.ExtractValuesFromItem(newValues, editedItem); |
| IContent insertContent = manager.CreateContent("text/html"); |
| if (CheckProvider(ProviderName)) |
| { |
| insertContent.SetMetaData("Title", newValues["Title"]); |
| insertContent.Content = newValues["Content"]; |
| manager.SaveContent(insertContent); |
| } |
| else |
| { |
| this.MetaData = "Name"; |
| insertContent.SetMetaData(MetaData, newValues[MetaData]); |
| insertContent.Content = newValues["Content"]; |
| manager.SaveContent(insertContent); |
| } |
| Grid.Rebind(); |
| } |
| void Grid_UpdateCommand(object source, GridCommandEventArgs e) |
| { |
| manager = new ContentManager(ProviderName); |
| GridEditableItem editedItem = e.Item as GridEditableItem; |
| Guid cntId = (Guid)editedItem.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["ID"]; |
| Hashtable newValues = new Hashtable(); |
| e.Item.OwnerTableView.ExtractValuesFromItem(newValues, editedItem); |
| IContent UpdatedContent = manager.GetContent(cntId); |
| if (CheckProvider(ProviderName)) |
| { |
| UpdatedContent.SetMetaData("Title", newValues["Title"]); |
| UpdatedContent.Content = newValues["Content"]; |
| manager.SaveContent(UpdatedContent); |
| } |
| else |
| { |
| this.MetaData = "Name"; |
| UpdatedContent.SetMetaData(MetaData, newValues[MetaData]); |
| UpdatedContent.Content = newValues["Content"]; |
| manager.SaveContent(UpdatedContent); |
| } |
| } |
| void Grid_DeleteCommand(object source, GridCommandEventArgs e) |
| { |
| manager = new ContentManager(ProviderName); |
| Guid deleteITemID = (Guid)e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["ID"]; |
| IContent newCnt = manager.GetContent(deleteITemID) as IContent; |
| manager.DeleteContent(newCnt.ID); |
| } |
| void Grid_NeedDataSource(object source, GridNeedDataSourceEventArgs e) |
| { |
| Grid.DataSource = GridDataSource(); |
| } |
| public IList GridDataSource() |
| { |
| manager = new ContentManager(ProviderName); |
| IList allItems = manager.GetContent(); |
| return allItems; |
| } |
| public IList GCProviders() |
| { |
| List<string> providers = new List<string>(ContentManager.Providers.Count); |
| foreach (ContentProviderBase provider in ContentManager.Providers.Values) |
| { |
| if (provider !=null) |
| { |
| providers.Add(provider.Name); |
| } |
| } |
| return providers.ToArray(); |
| } |
| privatebool CheckProvider(string providerName) |
| { |
| if ((providerName != GenericContentProviderName) && (providerName != WikiProviderName)) |
| { |
| returntrue; |
| } |
| else |
| { |
| returnfalse; |
| } |
| } |
| |
| #endregion |
| |
| #region Control references |
| publicvirtual RadGrid Grid |
| { |
| get |
| { |
| returnbase.Container.GetControl<RadGrid>("RadGrid1", true); |
| } |
| } |
| publicvirtual RadComboBox Combo |
| { |
| get |
| { |
| returnbase.Container.GetControl<RadComboBox>("RadComboBox1", true); |
| } |
| } |
| |
| #endregion |
| |
| |
| #region Private constraints |
| private ContentManager manager; |
| privatestring GenericContentProviderName = "Generic_Content"; |
| privatestring WikiProviderName = "Wiki"; |
| privatestring MetaData; |
| |
| #endregion |
| } |
The Progress Team
View all posts from The Progress Team on the Progress blog. Connect with us about all things application development and deployment, data integration and digital business.
More from the author
