Problems With File Upload Within Listview Edit Item Template Within Update Panel

Question

0.00/5 (No votes)

See more:

I am experiencing problems with the FileUpload control inside the EditItemTemplate in a ListView inside an UpdatePanel. FileUpload.FileName is always NULL.

I am aware File Upload is not cpmpatible with Update Panels but this can be rectified with use of a PostBackTrigger. However even with a PostBackTrigger problem still persists.

Any help gratefully received !!

Cheers.

John

Code as follows :

ASP.NET

<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="TestFileUpload.aspx.vb" Inherits="Maint_TestFileUpload" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    
        
        
        <asp:Button ID="btnInsertNew" runat="server" style=" font:  comics sans ms; margin-bottom: 10px" Text="Insert New Image" />

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        
            <contenttemplate>

            <asp:ListView ID="lvwPics" runat="server" 
                        DataSourceid="sdsPics" 
                        DataKeyNames="PictureId" 
                        InsertItemPosition="None">
            
            <layouttemplate>
              <table ID="itemPlaceholderContainer"  runat="server" style="border: solid 1px; width: 100%"> 
                <thead>
                <tr id="Tr1"  runat="server" class="lvwBasketHdr" > 
                  <td id="Td1"  align="center"  runat="server" >
                    <asp:Label ID="Label1" runat="server" Text="Title / Image"/> 
                  
                  <td id="Td2" align="center"  runat="server">
                    <asp:Label ID="Label2" runat="server" Text="Data Item"/> 
                  
                  <td id="Td4" align="center"  runat="server">
                    <asp:Label ID="Label3" runat="server" Text="Value"/> 
                  
                  <td id="Td5" align="center"  runat="server">
                    <asp:Label ID="Label4" runat="server" Text="Action"/> 
                  
                
                </thead>
                <tbody>
                  <tr   runat="server" id="itemPlaceholder" > 
                  
                </tbody>             
               
                  
            </layouttemplate>
       
       
            
            <itemtemplate>
                <tr style="width:100%">
               
                        <td id="Td3" valign="top" align="center" style="width:25%" rowspan="1">
                          <asp:Label ID="Label5" runat="server"  CssClass="SmallTitle" Text='<% #Eval("Title")%>'>
                          <br />
                          <asp:HyperLink ID="HyperLink2" runat="server" 
                                         ImageUrl='<%#Eval("ThumbnailPath")%>' 
                                         NavigateUrl='<%#Eval("PictureURL")%>' 
                                         ToolTip="Double click to enlarge image">
                          
                          
                          <asp:Label ID="Label6" runat="server"  Visible="false"   Text='<%#Eval("PictureId")%>'/>

                        </td>

                        <td style="height: 1.2em">
                        </td>
                        
                        <td style="height: 1.2em">
                        </td>

                        <td align="center" rowspan="1" style="width:10%">    
                            <asp:Button ID="btnRemove" CommandName="DELETE" runat="server" Text="Remove" CssClass="btnAction" CausesValidation="False" />
                            <asp:Button ID="btnEdit" CommandName="EDIT" runat="server" Text="Edit"  CssClass="btnAction" CausesValidation="False" />
                        </td>
                        
                    
            </tr></itemtemplate>
            <itemseparatortemplate>
                <td colspan="4" style="border-removedsolid 1px silver"> </td>
            </itemseparatortemplate>


            
            <edititemtemplate>
                <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                    <triggers>
                        <asp:PostBackTrigger ControlID="btnUpdate" />
                    </triggers>
                    
                    <contenttemplate>
                            
           
                        <tr style="width:100%">
                   
                            <td id="Td3" valign="top" align="center" style="width:25%" rowspan="1">
                              <asp:Label ID="lblEditTitle" runat="server" CssClass="SmallTitle" Text='<% #Eval("Title")%>'>
                              <asp:HyperLink ID="HyperLink2" runat="server" 
                                             ImageUrl='<%#Eval("ThumbnailPath")%>' 
                                             NavigateUrl='<%#Eval("PictureURL")%>' 
                                             ToolTip="Double click to enlarge image">
                              
                              <asp:Label ID="lblEditPicId" runat="server"  Visible="false"   Text='<%#Eval("PictureId")%>'/>
                            </td>

                            <td class="PicMaintLabel" valign="top" style="width:15%">
                                <asp:Label ID="lblChangeImage" runat="server"  Text="Change Image :"/> 
                            
                            </td>
                            
                            <td style="width:50%" onmouseover="this.style.backgroundColor='#FBF5E6'" önmouseout="this.style.backgroundColor='#FFFFFF'">
                                <asp:FileUpload id="fuEditImage" runat="server" >
                            </td>

                            <td align="center" rowspan="1" style="width:10%">    
                               <asp:Button ID="btnUpdate" CommandName="UPDATE" runat="server" Text="Update" CssClass="btnAction" ValidationGroup="Edit" />
                               <asp:Button ID="btnCancelEdit" CommandName="CANCEL" runat="server" Text="Cancel" CssClass="btnAction" CausesValidation="False" />
                            </td>
                            
                        </tr>
                    </contenttemplate>
                    
                
            </edititemtemplate>

        
                
                <asp:SqlDataSource ID="sdsPics" runat="server" 
                                   ConnectionString="<%$ ConnectionStrings:cnAA %>"  
                                   SelectCommand="SELECT * FROM vwMaintPics "
                                   DeleteCommand="DELETE FROM Pictures WHERE PictureId = @PictureId "
                                   UpdateCommand="UPDATE Pictures 
                                                  SET 
                                                      Title = @Title
                                                   WHERE PictureId = @PictureId" >
                                    
                
                </contenttemplate>

CODE BEHIND

VB

Protected Sub lvwPics_ItemUpdating(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ListViewUpdateEventArgs) Handles lvwPics.ItemUpdating
    Try
        mfu = CType(lvwPics.EditItem.FindControl("fuEditImage"), FileUpload)
        e.NewValues.Add("PictureId", CType(lvwPics.EditItem.FindControl("lblEditPicId"), Label).Text)
        e.NewValues.Add("Title", mfu.FileName)

    Catch ex As Exception

    End Try
End Sub

Posted 28-Oct-11 3:39am

CyprusJohn

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CyprusJohn · Answer 1 · 2011-10-30T10:03:00

Have noticed that if I remove the outer Update Panel, the code works, that is the File Upload control has a file that can be saved to the server. No problems with File Upload control and the Update Panel it is in.

The reason for the outer Update Panel was to maintain the scroll position when the user scrolls down the screen. Without it the user scrolls down the screen clicks on a EDIT button, a full postback is done and the user is positioned at the top of the listview and not on the record being edited.

Is there another way of maintaining the scroll position in a list view ?

John

CyprusJohn · Answer 2 · 2011-11-01T21:49:00

I have been testing my code in Google Chrome, however as a last straw tried it in IE8 and it works perfectly (just had to tweak the outer Update Panel to have UpdateMode="Conditional".

The issue is not now a problem with the above code but a browser compatibility issue.

Any suggestions how to rectify this ??

John

Problems With File Upload Within Listview Edit Item Template Within Update Panel

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0