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

Multi-Row Edit using Ajax

1 Answer 103 Views

Grid

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

Chris asked on 16 Mar 2009, 04:48 PM

Hello! I have a grid that I need to convert to a mutliple row edit grid on an Ajax post back. However, it takes two page refreshes (AJAX) to see the edit boxes. I'm not sure where in the ASP.NET page lifecycle I can change the way the grid gets rendered. I have attempted the PreRender and on the CheckChanged event of the radio button.

Scenario:

The user makes a selection in a group of radio buttons. One of the buttons should change all of the loaded grid rows to edit mode so the user can make bulk edit entries in the grid to be stored on a full post-back. This change should be turned on when rdProposalLocked is selected and off when any other radio option is selected.

    
            <%@ Page Language="VB" AutoEventWireup="false" CodeFile="BulkApproveItems.aspx.vb" 
        
                Inherits="BulkApproveItems" ErrorPage="~/error_window.aspx" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title>Bulk Approve Items</title> 
        
                <script type="text/javascript">  
        
                    function CloseAndRebind() {  
        
                        GetRadWindow().Close();  
        
                        GetRadWindow().BrowserWindow.refreshGrid();  
        
                    }  
        
                    function GetRadWindow() {  
        
                        var oWindow = null;  
        
                        if (window.radWindow)  
        
                            oWindow = window.radWindow;  
        
                        else if (window.frameElement.radWindow)  
        
                            oWindow = window.frameElement.radWindow;  
        
                        return oWindow;  
        
                    }  
        
                    function CancelEdit() {  
        
                        GetRadWindow().Close();  
        
                    }  
        
                </script> 
        
                <link href="CSS/DialogStyles.css" rel="stylesheet" type="text/css" /> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <telerik:RadScriptManager ID="PageScriptManager" runat="server">  
        
                </telerik:RadScriptManager> 
        
                <telerik:RadFormDecorator ID="FormDecorator" runat="server" Skin="Vista" /> 
        
                <telerik:RadAjaxManager ID="PageAjaxManager" runat="server">  
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="btnSubmitApproval">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="imgNotesRequired" /> 
        
                                <telerik:AjaxUpdatedControl ControlID="imgApprovalRequired" /> 
        
                                <telerik:AjaxUpdatedControl ControlID="errorMessage" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                        <telerik:AjaxSetting AjaxControlID="rdApproveByExecutive">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="gridBulkApproveCostCenters" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                        <telerik:AjaxSetting AjaxControlID="rdProposalLocked">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="gridBulkApproveCostCenters" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                        <telerik:AjaxSetting AjaxControlID="rdRejectToExecutive">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="gridBulkApproveCostCenters" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                        <telerik:AjaxSetting AjaxControlID="rdRejectToManager">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="gridBulkApproveCostCenters" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </telerik:RadAjaxManager> 
        
                <div class="Content">  
        
                    <div class="MainLabel">  
        
                        <asp:Image ID="imgNotesRequired" runat="server" ImageUrl="~/Images/attention1.gif" 
        
                            AlternateText="Notes are required" Visible="false" CssClass="RequiredFieldImage" /> 
        
                        Approval Notes</div> 
        
                    <div class="UserControl">  
        
                        <telerik:RadEditor ID="txtApprovalNotes" runat="server" EditModes="Design" Skin="Vista" 
        
                            Width="100%" Height="150px" EnableResize="False" StripFormattingOptions="MSWordRemoveAll">  
        
                            <Tools> 
        
                                <telerik:EditorToolGroup> 
        
                                    <telerik:EditorTool Name="Bold" /> 
        
                                    <telerik:EditorTool Name="Italic" /> 
        
                                    <telerik:EditorTool Name="Underline" /> 
        
                                    <telerik:EditorTool Name="Indent" /> 
        
                                    <telerik:EditorTool Name="Outdent" /> 
        
                                </telerik:EditorToolGroup> 
        
                                <telerik:EditorToolGroup> 
        
                                    <telerik:EditorTool Name="InsertOrderedList" /> 
        
                                    <telerik:EditorTool Name="InsertUnorderedList" /> 
        
                                </telerik:EditorToolGroup> 
        
                                <telerik:EditorToolGroup> 
        
                                    <telerik:EditorTool Name="AjaxSpellCheck" /> 
        
                                    <telerik:EditorTool Name="Copy" /> 
        
                                    <telerik:EditorTool Name="Cut" /> 
        
                                    <telerik:EditorTool Name="Paste" /> 
        
                                    <telerik:EditorTool Name="PasteAsHtml" /> 
        
                                    <telerik:EditorTool Name="PasteFromWordNoFontsNoSizes" /> 
        
                                </telerik:EditorToolGroup> 
        
                                <telerik:EditorToolGroup> 
        
                                    <telerik:EditorTool Name="Undo" /> 
        
                                    <telerik:EditorTool Name="Redo" /> 
        
                                </telerik:EditorToolGroup> 
        
                                <telerik:EditorToolGroup> 
        
                                    <telerik:EditorTool Name="ToggleScreenMode" /> 
        
                                </telerik:EditorToolGroup> 
        
                            </Tools> 
        
                            <Content> 
        
                            </Content> 
        
                        </telerik:RadEditor> 
        
                        <asp:CheckBox ID="chkPrivateNote" runat="server" Text="Cabinet Only Note" Checked="false" /> 
        
                    </div> 
        
                    <div class="MainLabel">  
        
                        <asp:Image ID="imgApprovalRequired" runat="server" ImageUrl="~/Images/attention1.gif" 
        
                            AlternateText="Please select an approval status." Visible="false" CssClass="RequiredFieldImage" /> 
        
                        Approval Status</div> 
        
                    <div class="UserControl">  
        
                        <telerik:RadMultiPage ID="pgApprovalPageView" runat="server" CssClass="ApprovalBlock">  
        
                            <telerik:RadPageView ID="vwManagerView" runat="server" Visible="true" Selected="true">  
        
                                <asp:RadioButton GroupName="Approval" Text="Approve" Checked="false" ID="rdExecutiveApproveToPortal" 
        
                                    runat="server" /> 
        
                                <asp:RadioButton GroupName="Approval" Text="Reject" Checked="false" ID="rdExecutiveRejectToManager" 
        
                                    runat="server" /> 
        
                            </telerik:RadPageView> 
        
                            <telerik:RadPageView ID="vwPortalAdminView" runat="server">  
        
                                <div class="SubControl">  
        
                                    <label> 
        
                                        Approve</label> 
        
                                    <div class="RadioOptions">  
        
                                        <asp:RadioButton GroupName="Approval" Text="Approve as Divisional VP" Checked="false" 
        
                                            ID="rdApproveByExecutive" runat="server" AutoPostBack="true" /> 
        
                                        <asp:RadioButton GroupName="Approval" Text="Lock Proposal" Checked="false" ID="rdProposalLocked" 
        
                                            runat="server" AutoPostBack="true" /></div>  
        
                                </div> 
        
                                <div class="SubControl">  
        
                                    <label> 
        
                                        Reject</label> 
        
                                    <div class="RadioOptions">  
        
                                        <asp:RadioButton GroupName="Approval" Text="Reject to Divisional VP" Checked="false" 
        
                                            ID="rdRejectToExecutive" runat="server" AutoPostBack="true" /> 
        
                                        <asp:RadioButton GroupName="Approval" Text="Reject to Cost Center Manager" Checked="false" 
        
                                            ID="rdRejectToManager" runat="server" AutoPostBack="true" /></div>  
        
                                </div> 
        
                            </telerik:RadPageView> 
        
                        </telerik:RadMultiPage></div>  
        
                    <div class="MainLabel">  
        
                        Affected Cost Centers</div> 
        
                    <div class="UserControl">  
        
                        <telerik:RadGrid ID="gridBulkApproveCostCenters" ShowFooter="true" runat="server" 
        
                            Skin="Vista" AllowMultiRowEdit="true">  
        
                            <MasterTableView AutoGenerateColumns="false" EditMode="InPlace">  
        
                                <Columns> 
        
                                    <telerik:GridTemplateColumn HeaderText="Cost Center">  
        
                                        <ItemTemplate> 
        
                                            <%#Eval("FundID") %>-<%#Eval("UnitID") %>-<%#Eval("LineItemID") %> 
        
                                        </ItemTemplate> 
        
                                    </telerik:GridTemplateColumn> 
        
                                    <telerik:GridBoundColumn HeaderText="Description" ReadOnly="true" DataField="LedgerLineItem.Description" 
        
                                        DataFormatString="{0:C}" /> 
        
                                    <telerik:GridBoundColumn HeaderText="Current Budget" ReadOnly="true" DataField="CurrentBudget" 
        
                                        DataFormatString="{0:C}" Aggregate="Sum" /> 
        
                                    <telerik:GridNumericColumn HeaderText="Proposed" DataField="ProposedBudget" NumericType="Currency" 
        
                                        Aggregate="Sum" ReadOnly="false" /> 
        
                                </Columns> 
        
                            </MasterTableView> 
        
                        </telerik:RadGrid> 
        
                    </div> 
        
                    <telerik:RadAjaxLoadingPanel ID="PageLoadingPanel" runat="server" Height="30px" Width="100%" 
        
                        InitialDelayTime="0" MinDisplayTime="250" Transparency="2" IsSticky="true" CssClass="DialogFixedLoadingPanel">  
        
                        <img alt="Loading..." src='Images/loading7.gif' style="border: 0px;" /> 
        
                    </telerik:RadAjaxLoadingPanel> 
        
                    <div id="errorMessage" runat="server" class="ErrorMessage" visible="false">  
        
                    </div> 
        
                    <div class="ButtonPanel">  
        
                        <asp:Button ID="btnSubmitApproval" runat="server" Text="Submit" /><input type="button" 
        
                            value="Cancel" onclick="CancelEdit();" /></div>  
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

    
                Protected Sub Approval_CheckedChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles rdProposalLocked.CheckedChanged, rdApproveByExecutive.CheckedChanged, rdRejectToExecutive.CheckedChanged, rdRejectToManager.CheckedChanged  
        
                    If rdProposalLocked.Checked = True Then 
        
                        For Each item As Telerik.Web.UI.GridItem In gridBulkApproveCostCenters.MasterTableView.Items  
        
                            If TypeOf item Is Telerik.Web.UI.GridEditableItem Then 
        
                                Dim editableItem As Telerik.Web.UI.GridEditableItem = CType(item, Telerik.Web.UI.GridEditableItem)  
        
                                editableItem.Edit = True 
        
                            End If 
        
                        Next 
        
                        gridBulkApproveCostCenters.Rebind()  
        
                    Else 
        
                        For Each item As Telerik.Web.UI.GridItem In gridBulkApproveCostCenters.MasterTableView.Items  
        
                            If TypeOf item Is Telerik.Web.UI.GridEditableItem Then 
        
                                Dim editableItem As Telerik.Web.UI.GridEditableItem = CType(item, Telerik.Web.UI.GridEditableItem)  
        
                                editableItem.Edit = False 
        
                            End If 
        
                        Next 
        
                        gridBulkApproveCostCenters.Rebind()  
        
                    End If 
        
                End Sub 
        
                Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load  
        
                    Page.Response.Cache.SetCacheability(HttpCacheability.NoCache)  
        
                    Dim IDStoLoad As String = Request.QueryString("keys")  
        
                    ExtractKeys(IDStoLoad)  
        
                    If _keys.Count = 0 Then Response.Redirect("accessDenied.aspx?e=You do not have the ability to approve any of the selected items.&t=Approve Error", True)  
        
                    If Not Page.IsPostBack Then 
        
                        GetItems()  
        
                        BindDataGrid()  
        
                        SetUIVisibility()  
        
                    End If 
        
                    Dim EnableCabinetCheck As Boolean = False 
        
                    EnableCabinetCheck = _WebHelper.GetSystemUser().CanSeePrivateNotes  
        
                    chkPrivateNote.Visible = EnableCabinetCheck  
        
                End Sub

Thanks for any ideas or pointers!

1 Answer, 1 is accepted

answered on 17 Mar 2009, 05:21 PM

Okay,

Found my problem -- that little NeedDataSourceEvent fixed everything.... corrected code below:

    
                Protected Sub gridBulkApproveCostCenters_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles gridBulkApproveCostCenters.NeedDataSource  
        
                    ExtractKeys()  
        
                    GetItems()  
        
                    gridBulkApproveCostCenters.DataSource = _Items  
        
                End Sub 
        
                Protected Sub gridBulkApproveCostCenters_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles gridBulkApproveCostCenters.PreRender  
        
                    For Each item As Telerik.Web.UI.GridItem In gridBulkApproveCostCenters.MasterTableView.Items  
        
                        If TypeOf item Is Telerik.Web.UI.GridEditableItem Then 
        
                            Dim editableItem As Telerik.Web.UI.GridEditableItem = CType(item, Telerik.Web.UI.GridEditableItem)  
        
                            editableItem.Edit = rdProposalLocked.Checked  
        
                        End If 
        
                    Next 
        
                    gridBulkApproveCostCenters.Rebind()  
        
                End Sub