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

RadGrid Upload in edit mode

12 Answers 211 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Myriam
Top achievements
Rank 1
Myriam asked on 11 Nov 2008, 08:48 PM
Hello
I have a RadGrid with only one MasterTable.
The user can Update, Edit or Insert in this Grid.
When the user Edit a record, I would like to display a upload control to be able to upload the logo of the company and then save it to my table. Is it possible to have this as a gridbound column as I would like also that when the user click on Edit, it display the value that is already in the table..
Thanks in advance

And does it has a property where I could set the width of my controls in the edit part?
Thanks again

12 Answers, 1 is accepted

Sort by
0
Accepted
Princy
Top achievements
Rank 1
answered on 12 Nov 2008, 04:39 AM
Hello Myriam,

You can place one or more controls in the EditItemTemplate of a TemplateColumn, which will appear accordingly in the EditMode of the grid.
aspx:
<telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="TemplateColumn"
     <ItemTemplate> 
         <asp:Label ID="Label1" runat="server" Text='<%#Eval("FileName") %>'></asp:Label> 
    </ItemTemplate> 
    <EditItemTemplate> 
         <asp:TextBox ID="TextBox1" Text='<%#Eval("FileName") %>' runat="server"></asp:TextBox> 
         <telerik:RadUpload ID="RadUpload1" runat="server" />              
    </EditItemTemplate> 
</telerik:GridTemplateColumn> 

To modify the width of the edit controls you have to access the controlsand then vary the width as required.
cs:
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e) 
    { 
        if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
        {          
               GridEditableItem editItem=(GridEditableItem)e.Item; 
               TextBox txtbx = (TextBox)editItem["TemplateColumn5"].FindControl("TextBox1");//For TemplateColumns 
               txtbx.Width = 200
               //TextBox txtbx = (TextBox)editItem["BoundColumn"].Controls[0]; (For GridBoundColumns) 
        } 
    } 

Thanks
Princy.
0
Myriam
Top achievements
Rank 1
answered on 12 Nov 2008, 02:39 PM
This is perfect!
Many Thanks!
0
Myriam
Top achievements
Rank 1
answered on 13 Nov 2008, 09:12 PM
About the width of my controls in edit mode...I would like to do the same thing in a detailtableview...what do I have to change?

Thanks again...
0
Accepted
Shinu
Top achievements
Rank 1
answered on 14 Nov 2008, 05:31 AM
Hi Myriam,

You can set the Name property for the Detail table and check for the corresponding name in the ItemDataBound event as shown below.

ASPX:
<DetailTables> 
  <telerik:GridTableView runat="server"   Name="Detail"   DataSourceID="SqlDataSource1"  > 
      <Columns> 
      <telerik:GridTemplateColumn UniqueName="TemplateColumn1" HeaderText="TemplateColumn1"
        <ItemTemplate>  
         <asp:Label ID="Label1" runat="server" Text='<%#Eval("FileName") %>'></asp:Label>  
    </ItemTemplate>  
    <EditItemTemplate>  
         <asp:TextBox ID="TextBox1" Text='<%#Eval("FileName") %>' runat="server"></asp:TextBox>  
         <telerik:RadUpload ID="RadUpload1" runat="server" />               
    </EditItemTemplate>  
      </telerik:GridTemplateColumn> 
       <telerik:GridEditCommandColumn ></telerik:GridEditCommandColumn> 
      </Columns> 
  </telerik:GridTableView> 
 </DetailTables> 

CS:
 protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e) 
    { 
        if (e.Item is GridEditableItem && e.Item.IsInEditMode && e.Item.OwnerTableView.Name=="Detail"
        { 
            GridEditableItem editItem = (GridEditableItem)e.Item; 
            TextBox txtbx = (TextBox)editItem["TemplateColumn1"].FindControl("TextBox1");//For TemplateColumns  
            txtbx.Width = Unit.Pixel(300); 
        }  
        
        
    } 


Thanks
Shinu.
0
John Grymonprez
Top achievements
Rank 1
answered on 26 Mar 2009, 01:17 PM
I'm using your code in a grid with automatic operations. I would like to know how to update the field that uses the RadUpload control.
0
Sebastian
Telerik team
answered on 26 Mar 2009, 01:24 PM
Hello John,

You can take this demo as a starting point for your implementation:

http://demos.telerik.com/aspnet-ajax/controls/examples/integration/raduploadinajaxifiedgrid/defaultcs.aspx?product=grid

and modify it to use automatic operations instead of manual updates.

Best regards,
Sebastian
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
0
Myriam
Top achievements
Rank 1
answered on 26 Mar 2009, 01:44 PM
Hello John
here is my code
Hope this gonna help
Private Sub RadGrid_offre_UpdateCommand(ByVal source As ObjectByVal e As Telerik.Web.UI.GridCommandEventArgs) Handles RadGrid_offre.UpdateCommand  
If "MTVPostulant".Equals(e.Item.OwnerTableView.Name) Then 
            Dim L_NO_Offre = parentItem.OwnerTableView.DataKeyValues(parentItem.ItemIndex)("NO_OFFRE").ToString()  
            Dim strsqlUpdate As String 
            Dim item As GridEditFormItem  
            Dim temp_no_Demande As String 
            Dim temp_no_offre As Integer 
            item = CType(e.Item, GridEditFormItem)  
 
            Dim dataItem As GridEditFormItem = DirectCast(e.Item, GridEditFormItem)  
            temp_no_Demande = item("NO_DEMANDE").Text.ToString  
            Dim codePermanent As TextBox = DirectCast(item("CODE_PERMANENT").Controls(0), TextBox)  
            strsqlUpdate = "" 
            strsqlUpdate = "UPDATE [T_DEMANDE] SET [STATUS] = @STATUS " 
 
            Dim FileUpLettre As FileUpload = DirectCast(item("TemplateColumnLETTRE_PRESENTATION").FindControl("LETTRE_PRESENTATION"), FileUpload)  
            'Dim Uploadbx As FileUpload = DirectCast(editItem("TemplateColumn").FindControl("LOGO"), FileUpload)  
 
            L_LETTRE = FileUpLettre.FileName  
            If L_LETTRE <> "" Then 
                Me.SqlDSPostulant.UpdateParameters("LETTRE_PRESENTATION").DefaultValue = L_LETTRE  
 
                NomFichier(FileUpLettre, codePermanent.Text, "D""lettre")  
                strsqlUpdate = strsqlUpdate & ",[LETTRE_PRESENTATION]=@LETTRE_PRESENTATION " 
                SauvegarderFichier(FileUpLettre, "lettre", L_NO_Offre, codePermanent.Text)  
            End If 
 
            Dim FileUpcv As FileUpload = DirectCast(item("TemplateColumnCV").FindControl("CV"), FileUpload)  
            L_CV = FileUpcv.FileName  
            If L_CV <> "" Then 
                Me.SqlDSPostulant.UpdateParameters("NOM_CV").DefaultValue = L_CV  
 
                NomFichier(FileUpcv, codePermanent.Text, "D""cv")  
                strsqlUpdate = strsqlUpdate & ",[NOM_CV]=@NOM_CV " 
                SauvegarderFichier(FileUpcv, "cv", L_NO_Offre, codePermanent.Text)  
            End If 
 
            strsqlUpdate = strsqlUpdate & "WHERE NO_DEMANDE=@NO_DEMANDE" 
 
            SqlDSPostulant.UpdateCommand = strsqlUpdate  
            temp_no_offre = parentItem("NO_OFFRE").Text  
            fonctionsvbs.LogInsert(Session("sDemandeur"), "Modifier une demande", Session("sDemandeur") & " a modifi√© la demande de " & codePermanent.Text & " sur l'offre no " & temp_no_offre)  
            End If 
End Sub 
 
'function to save the files  
Protected Function SauvegarderFichier(ByVal sNomFichier As FileUpload, ByVal sType As StringByVal sNoOffre As IntegerByVal scodepermanent As String)  
 
        If sNomFichier.HasFile = True Then 
            Dim filepath As String = sNomFichier.PostedFile.FileName  
            Dim pat As String = "\\(?:.+)\\(.+)\.(.+)" 
            Dim r As Regex = New Regex(pat)  
            'run  
            Dim m As Match = r.Match(filepath)  
            Dim file_ext As String = m.Groups(2).Captures(0).ToString()  
            Dim filename As String = m.Groups(1).Captures(0).ToString()  
            Dim file As String = filename & "." & file_ext  
 
            Dim dir_name As String = Server.MapPath(".\Offre\" & sNoOffre & "\" & scodepermanent & "\")  
            If System.IO.Directory.Exists(dir_name) Then 
                'Ne rien faire  
            Else 
                MkDir(Server.MapPath(".\Offre\" & sNoOffre & "\" & scodepermanent & "\"))  
            End If 
 
 
            'save the file to the server   
            sNomFichier.PostedFile.SaveAs(Server.MapPath(".\Offre\" & sNoOffre & "\" & scodepermanent & "\") & file)  
 
            Return file  
        Else 
            Return "" 
        End If 
    End Function 
 
'Function  
 
' To get the name of the files  
Protected Function NomFichier(ByVal NomUpload As FileUpload, ByVal CODE_PERMANENT As StringByVal LettreTable As StringByVal sPath As String)  
 
        If NomUpload.HasFile = True Then 
            Dim filepath As String = NomUpload.PostedFile.FileName  
            Dim pat As String = "\\(?:.+)\\(.+)\.(.+)" 
            Dim r As Regex = New Regex(pat)  
            'run  
            Dim m As Match = r.Match(filepath)  
            Dim file_ext As String = m.Groups(2).Captures(0).ToString()  
            Dim filename As String = LettreTable & CODE_PERMANENT  
            Dim file As String = filename & "." & file_ext  
 
            'save the file to the server   
            NomUpload.PostedFile.SaveAs(Server.MapPath(".\" & sPath & "\") & file)  
            Return file  
        Else 
            Return "" 
        End If 
    End Function 
 

<telerik:GridTemplateColumn   
                                    UniqueName="TemplateColumnLETTRE_PRESENTATION"   
                                    HeaderText="Lettre pr√©sentation" 
                                    DataField="LETTRE_PRESENTATION">    
                                    <ItemTemplate>    
                                        &nbsp;<href='Offre\<%#Eval("NO_OFFRE") %>\<%#Eval("CODE_PERMANENT") %>\<%#Eval("LETTRE_PRESENTATION") %>' target='_blank'><%#Eval("LETTRE_PRESENTATION") %></a>  
                                    </ItemTemplate>    
                                    <EditItemTemplate>    
                                        <asp:FileUpload ID="LETTRE_PRESENTATION" Text='<%#Eval("LETTRE_PRESENTATION") %>' runat="server" />               
                                    </EditItemTemplate>    
                                </telerik:GridTemplateColumn>    
                                  
                                <telerik:GridTemplateColumn   
                                    UniqueName="TemplateColumnCV"   
                                    HeaderText="CV" 
                                    DataField="NOM_CV">    
                                    <ItemTemplate>    
                                        &nbsp;<href='Offre\<%#Eval("NO_OFFRE") %>\<%#Eval("CODE_PERMANENT") %>\<%#Eval("NOM_CV") %>' target='_blank'><%#Eval("NOM_CV")%></a>  
                                    </ItemTemplate>    
                                    <EditItemTemplate>    
                                        <asp:FileUpload ID="CV" Text='<%#Eval("NOM_CV") %>' runat="server" />               
                                    </EditItemTemplate>    
                                </telerik:GridTemplateColumn>   
0
John Grymonprez
Top achievements
Rank 1
answered on 27 Mar 2009, 09:55 AM
Thanks for the input.

I have tried to implement the solution from the example, but still the link does not get updated.

<

telerik:RadGrid ID="rgReport" runat="server" AllowAutomaticDeletes="true"

 

 

AllowAutomaticInserts="true" AllowAutomaticUpdates="true" DataSourceID="LinqDataSource2"

 

 

AutoGenerateColumns="false" OnItemDataBound="rgReport_ItemDataBound"

 

 

OnUpdateCommand="rgReport_UpdateCommand" OnInsertCommand="rgReport_InsertCommand">

 

 

<HeaderContextMenu EnableTheming="True">

 

 

<CollapseAnimation Duration="200" Type="OutQuint" />

 

 

</HeaderContextMenu>

 

 

<MasterTableView CommandItemDisplay="Top" DataKeyNames="SortID,BatchID,User_Ref"

 

 

EditMode="EditForms">

 

 

<Columns>

 

 

<telerik:GridEditCommandColumn ButtonType="ImageButton"

 

 

UniqueName="EditCommandColumn">

 

 

</telerik:GridEditCommandColumn>

 

 

<telerik:GridBoundColumn DataField="SortID" HeaderText="SortID"

 

 

UniqueName="SortID" ReadOnly="true">

 

 

<ItemStyle CssClass="hide" />

 

 

<HeaderStyle CssClass="hide" />

 

 

</telerik:GridBoundColumn>

 

 

<telerik:GridBoundColumn DataField="newSort" HeaderText="Enclosure #"

 

 

UniqueName="EnclosureID">

 

 

</telerik:GridBoundColumn>

 

 

<telerik:GridBoundColumn DataField="Description" HeaderText="Description"

 

 

UniqueName="Description"></telerik:GridBoundColumn>

 

 

<telerik:GridBoundColumn DataField="Product_Ref" HeaderText="Product"

 

 

UniqueName="Product_Ref" ReadOnly="true">

 

 

<ItemStyle CssClass="hide" />

 

 

<HeaderStyle CssClass="hide" />

 

 

</telerik:GridBoundColumn>

 

 

<telerik:GridTemplateColumn UniqueName="tmplLink">

 

 

<ItemTemplate>

 

 

<asp:Label ID="lblLink" runat="server" Text='<%#Eval("Link") %>'></asp:Label>

 

 

</ItemTemplate>

 

 

<EditItemTemplate>

 

 

<telerik:RadUpload ID="ruLink" runat="server" ControlObjectsVisibility="None" />

 

 

</EditItemTemplate>

 

 

</telerik:GridTemplateColumn>

 

 

<telerik:GridBoundColumn DataField="Type" HeaderText="Type" UniqueName="Type"

 

 

ReadOnly="true">

 

 

</telerik:GridBoundColumn>

 

 

<telerik:GridButtonColumn ConfirmText="Delete this product?"

 

 

ConfirmDialogType="RadWindow" ConfirmTitle="Delete" ButtonType="ImageButton"

 

 

CommandName="Delete" Text="Delete" UniqueName="DeleteColumn">

 

 

<ItemStyle HorizontalAlign="Center"/>

 

 

</telerik:GridButtonColumn>

 

 

</Columns>

 

 

<editformsettings>

 

 

<editcolumn uniquename="EditCommandColumn1">

 

 

</editcolumn>

 

 

</editformsettings>

 

 

<RowIndicatorColumn>

 

 

<HeaderStyle Width="20px" />

 

 

</RowIndicatorColumn>

 

 

<ExpandCollapseColumn>

 

 

<HeaderStyle Width="20px" />

 

 

</ExpandCollapseColumn>

 

 

</MasterTableView>

 

 

<FilterMenu EnableTheming="True">

 

 

<CollapseAnimation Duration="200" Type="OutQuint" />

 

 

</FilterMenu>

 

 

</telerik:RadGrid>

 

<

asp:LinqDataSource ID="LinqDataSource2" runat="server"

 

 

ContextTypeName="WizardDataContext"

 

 

TableName="tempReports" EnableDelete="True" EnableInsert="True"

 

 

EnableUpdate="True" Where="BatchID == @BatchID">

 

 

 

 

<WhereParameters>

 

 

 

 

<asp:ControlParameter ControlID="hdn" Name="BatchID" PropertyName="Value"

 

 

Type="Int32" />

 

 

 

 

</WhereParameters>

 

 

 

 

<UpdateParameters>

 

 

 

 

<asp:Parameter Name="newSort" Type="Int32" />

 

 

 

 

<asp:Parameter Name="Description" Type="String" />

 

 

 

 

<asp:SessionParameter SessionField="LinkCS" Name="Link" />

 

 

 

 

</UpdateParameters>

 

 

 

 

</asp:LinqDataSource>

 

 


code-behind:

 

 

protected void rgReport_UpdateCommand(object source, GridCommandEventArgs e)

 

{

InitializeUpdateParameter((

RadUpload)e.Item.FindControl("ruLink"));

 

}

 

protected void rgReport_InsertCommand(object source, GridCommandEventArgs e)

 

{

InitializeUpdateParameter((

RadUpload)e.Item.FindControl("ruLink"));

 

}

 

private void InitializeUpdateParameter(RadUpload currentUpload)

 

{

 

if (currentUpload.UploadedFiles.Count > 0)

 

{

 

byte[] data = new byte[currentUpload.UploadedFiles[0].ContentLength];

 

currentUpload.UploadedFiles[0].InputStream.Read(data, 0, data.Length);

Session[

"LinkCS"] = currentUpload.UploadedFiles[0].FileName.ToString();

 

}

}

 

protected void rgReport_ItemDataBound(object sender, GridItemEventArgs e)

 

{

 

if (e.Item is GridEditableItem && e.Item.IsInEditMode)

 

{

 

RadUpload upload = (RadUpload)e.Item.FindControl("ruLink");

 

RadAjaxPanel1.ResponseScripts.Add(

string.Format("window['UploadId'] = '{0}';", upload.ClientID));

 

}

}

0
John Grymonprez
Top achievements
Rank 1
answered on 30 Mar 2009, 08:55 AM
Another thing that I discovered is the following. I can update information (apart from the uploadcontrol), and it will update the grid. However when I update another record afterwards, the previously updated record returns to it's original state. I noticed that when I remove my 'where' clause, that it works fine.
0
Sebastian
Telerik team
answered on 30 Mar 2009, 09:51 AM
Hello John,

The template column value with RadUpload editor cannot be updated automatically because the upload control does not support two-way binding with binding expression which to be evaluated upon update operation.

Therefore, you will need to combine the automatic data editing with LinqDataSource control with manual update for the RadUpload editor as illustrated in this demo:

http://demos.telerik.com/aspnet-ajax/grid/examples/dataediting/programaticlinqupdates/defaultcs.aspx

Best regards,
Sebastian
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
0
Eric Downey
Top achievements
Rank 1
answered on 12 Dec 2009, 02:50 AM
I'm trying to accomplish something very similar to the original author of this thread - with one exception.  I am using a FormTemplate.  Any words of wisdom on how to incorporate a RadUpload control with the FormTemplate?  Thanx!
0
Sebastian
Telerik team
answered on 14 Dec 2009, 09:30 AM
Hello Eric,

In this case you can embed the RadUpload instance inside the FormTemplate custom edit form of the grid and perform the upload operation manually as explained previously in the thread. You can use the implementation from this online demo for reference:

http://demos.telerik.com/aspnet-ajax/listview/examples/firstlook/defaultcs.aspx
(it is based again on templates which are part of the first RadListView instance)

and port the same logic for RadGrid with FormTemplate edit form.

Best regards,
Sebastian
the Telerik team


Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
Grid
Asked by
Myriam
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
Myriam
Top achievements
Rank 1
Shinu
Top achievements
Rank 1
John Grymonprez
Top achievements
Rank 1
Sebastian
Telerik team
Eric Downey
Top achievements
Rank 1
Share this question
or