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

Grid InPlace & EditForms Editing Together?

8 Answers 133 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Benjamin
Top achievements
Rank 1
Benjamin asked on 09 Sep 2008, 04:26 AM
In my current development, I have completed several pages using the RadGrid control. Recently I got a request to add 20 more fields into one of the pages to allow more detailed description of each grid entry. In-Line editing, which I have been using all this while, is now out of the question with the issue of space constraints.

With the goal of keeping the interface design standard through all the pages, I like to inquire if its possible to have both "InPlace" editing with "EditForms" mods in that particular RadGrid (at least the grid having two seperate edit modes accessed through seperate buttons)?

Thanks for your help.

8 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 09 Sep 2008, 05:19 AM
Hello Benjamin,

Try out the following code wherein you can use two seperate buttons to switch the EditMode.
aspx:
<telerik:GridTemplateColumn UniqueName="TemplateColumn1"
       <ItemTemplate> 
           <asp:Button ID="Button2" runat="server" Text="InPlaceEdit" CommandName="InPlaceEdit" /> 
       </ItemTemplate> 
       </telerik:GridTemplateColumn> 
        
       <telerik:GridTemplateColumn UniqueName="TemplateColumn2"
       <ItemTemplate> 
           <asp:Button ID="Button3" runat="server" Text="FormEdit" CommandName="FormEdit" /> 
       </ItemTemplate> 
       </telerik:GridTemplateColumn> 

cs:
protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e) 
    { 
        if (e.CommandName == "InPlaceEdit") 
        { 
            GridEditableItem editItem = (GridEditableItem)e.Item; 
            editItem.Edit = true
            RadGrid1.MasterTableView.EditMode = GridEditMode.InPlace; 
        } 
 
        if (e.CommandName == "FormEdit") 
        { 
            GridEditableItem editItem = (GridEditableItem)e.Item; 
            editItem.Edit = true
            RadGrid1.MasterTableView.EditMode = GridEditMode.EditForms; 
        } 
        RadGrid1.Rebind(); 
    } 

Princy.

0
Benjamin
Top achievements
Rank 1
answered on 25 Sep 2008, 11:19 AM
Okay, thanks for the code.
I would like to ask as well: Is there any way to interact directly with these edit form controls?
I would like to add some Javascripts to them as well as have the ability to control their interface (enable/disable, etc.)
0
Yavor
Telerik team
answered on 25 Sep 2008, 11:27 AM
Hello Benjamin,

If you get the clientId of any element in the editForm(a standard textbox for example), you can use it to retrieve it on the client, and manipulate its attributes.

All the best,
Yavor
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Benjamin
Top achievements
Rank 1
answered on 25 Sep 2008, 11:51 AM
I've tried using the ItemCreated event (which I normally use to catch other grid controls and objects) to trap the controls, but however they don't seem to be passing through it.
Do I have to depend on individual onLoad events on each of the controls in the edit form and Javascript to capture the ClientIDs?
Thanks for your help.
0
Yavor
Telerik team
answered on 29 Sep 2008, 10:47 AM
Hello Benjamin,

Attached to this message, is a small application, which handles a functionality close to the one that we discussed this far.
I hope it helps.

All the best,
Yavor
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Benjamin
Top achievements
Rank 1
answered on 10 Oct 2008, 06:18 PM
Thank you for all the help provided so far. I've been able to get my grid's interface to behave the way I want it. However at the last yard, I encountered a snag:

The module that I have been using all this while to extract the updated values from the grid, after the user has executed the record update, is unable to get any values if the editing was done in the EditForm mode. The ExtractValuesFromItem function isn't able to detect any changes from the Telerik.WebControls.GridCommandEventArgs (grdEditableItem) passed to it
 and would result in an empty hashtable.

If the data changing was done using the normal InPlace editing instead, the function would work without issue.

The following is the event code for the UpdateCommand
Private Sub rgdGrid_UpdateCommand(ByVal source As ObjectByVal e As Telerik.WebControls.GridCommandEventArgs) Handles rgdGrid.UpdateCommand 
   If Not EditRecord(pnlHeader.Controls, rgdGrid, e.Item, strGrdModTranCode) Then 
      rgdGrid.ResponseScripts.Add(strErrMessage) 
      e.Canceled = True 
 

The following is the code used to contact and update the database.
Protected Function EditRecord(ByVal colHdrControls As ControlCollection, ByVal rgdGrid As RadGrid, ByVal gedGridDataEntry As GridEditableItem, ByVal strGrdModTranCode As StringAs Boolean 
   If CommunicateHost(strGrdModTranCode, chrModActCode, 1, , , GetGridValues(rgdGrid, gedGridDataEntry)) = String.Empty Then 
      Return False 
 

The following is the function used to extract updated values from the grid.
Protected Function GetGridValues(ByVal rgdGrid As RadGrid,  ByVal grdEditableItem As GridEditableItem,  Optional ByVal blnValidateData As Boolean = TrueAs String 
   Dim hshRowData As New Hashtable 
     
     rgdGrid.MasterTableView.ExtractValuesFromItem(hshRowData, grdEditableItem) 

The following is the ASP coding of the RadGrid
<radG:RadGrid id="rgdGrid" runat="server" AutoGenerateColumns="False" EnableAJAX="True" EnableAJAXLoadingTemplate="True" 
    Skin="Outlook2007" Width="100%" LoadingTemplateTransparency="25"
    <ClientSettings> 
        <Resizing AllowColumnResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="True" /> 
        <Scrolling AllowScroll="True"/> 
    </ClientSettings>   
    <MasterTableView EditMode="InPlace" CommandItemDisplay="Bottom" DataKeyNames="PODSEQ"
        <Columns> 
            <radG:GridBoundColumn UniqueName="colPODIDC" DataField="PODIDC" MaxLength="100" HeaderText="Description" Headerstyle-Width="45%" ItemStyle-HorizontalAlign="Left"/> 
            <radG:GridBoundColumn UniqueName="colPODES1" DataField="PODES1" MaxLength="30" Visible="False"/> 
            <radG:GridBoundColumn UniqueName="colPODES2" DataField="PODES2" MaxLength="30" Visible="False"/> 
            <radG:GridBoundColumn UniqueName="colPODAMT" DataField="PODAMT" DataType="System.Decimal" ReadOnly="True" DataFormatString="{0:#,##0.00}" HeaderText="Amount" HeaderStyle-Width="10%" ItemStyle-HorizontalAlign="Right"/> 
             
            <radG:GridButtonColumn UniqueName="cmdDetails" Text="Details" CommandName="Details" HeaderStyle-Width="25px"/>    
            <radG:GridEditCommandColumn UniqueName="cmdEdit" UpdateText="OK" InsertText="OK" HeaderStyle-Width="25px"/> 
            <radG:GridButtonColumn UniqueName="cmdDelete" Text="Delete" CommandName="Delete" ConfirmText="Do you wish to delete entry?" HeaderStyle-Width="36px"/> 
        </Columns> 
         
        <EditFormSettings EditFormType="Template"
            <FormTemplate> 
                <table id="tblGEFPage" runat="server" style="TABLE-LAYOUT:auto;WIDTH:100%;BACKGROUND-COLOR:#efefef"
                    <tr> 
                        <td> 
                            <asp:Table runat="server" width="100%" > 
                                <asp:TableRow> 
                                    <asp:TableCell style="padding:0px 1px" Wrap="False"><asp:Label id="lblPODES1" runat="server" Text="Item Details"/></asp:TableCell> 
                                    <asp:TableCell style="padding:0px 1px" Wrap="False"><asp:TextBox id="txtPODES1" runat="server" Text='<%#Bind("PODES1")%>' Width="250px" MaxLength="30" TabIndex="1"/></asp:TableCell> 
                                    <asp:TableCell Width="10px"/> 
                                    <asp:TableCell style="padding:0px 1px" Wrap="False"><asp:TextBox id="txtPODES2" runat="server" Text='<%#Bind("PODES2")%>' Width="250px" MaxLength="30" TabIndex="2"/></asp:TableCell> 
                                    <asp:TableCell Width="40%"/> 
                                </asp:TableRow> 
                            </asp:Table>  
                        </td> 
                    </tr>  
                    <tr align="right"
                        <td align="right" style="height: 22px"
                            <asp:Button ID="btnGrdEFOK" runat="server" CommandName="Update" CssClass="linkBtn" Text="OK"/> 
                            <asp:Button ID="btnGrdEFCancel" runat="server" CommandName="GrdEFCancel" CssClass="linkBtn" Text="Cancel"/> 
                        </td> 
                    </tr> 
                </table>  
            </FormTemplate> 
        <FormTableButtonRowStyle HorizontalAlign="Right" CssClass="EditFormButtonRow"/> 
        </EditFormSettings> 
         
        <CommandItemTemplate> 
        <asp:Button ID="btnAdd" runat="server" CommandName="InitInsert" CssClass="linkBtn" Text="Add"/>  
    </CommandItemTemplate> 
    </MasterTableView>  
</radG:RadGrid> 

Is there something amiss here?
0
Accepted
Yavor
Telerik team
answered on 14 Oct 2008, 09:53 AM
Hello Benjamin,

Although I am not precisely sure what may be causing the issue, you can get a reference to the editForm which is raising the update command, and then use the Findcontrol method to get a reference to the textboxes. This should allow you to get the values. Let me know how it goes.

Best wishes,
Yavor
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Benjamin
Top achievements
Rank 1
answered on 23 Oct 2008, 10:46 AM
That idea worked brilliantly. Once I was able to capture the GridEditFormItem reference from the ItemCreated event, all the pieces of the puzzle fell into place as I already had functions ready built for sorting through control collections to display/extract data.

Thank you for all the help.
Tags
Grid
Asked by
Benjamin
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Benjamin
Top achievements
Rank 1
Yavor
Telerik team
Share this question
or