• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 450
  • Last Modified:

Uploading images not working - C#

Hey Experts,

I am trying to do two things but cannot get the first thing to work which is uploading an image on a form. When I browse for a file and click the upload button it doesn't seem to read the file.

Once that is figured out the second thing I need to add this if statement:

if (ddlAlbum.SelectedIndex > 0)

Which will check if an album is selected. If true then it will add the image url name to the albums table.

Here is the code for the upload button (When clicked I receive the "You have not specified a file" message).

And also here is the image path in my web.config:

<appSettings>
    <add key ="ImagesDirectoryLocation"
       value = "C:\\Documents and Settings\\TQ\\Desktop\\NAITBookWebSite\\images\\" />
    <add key ="RelativeImagesDirectoryLocation"
       value ="images" />
  </appSettings>
protected void btnUploadPicture_Click(object sender, EventArgs e) {
        if (upldImage.HasFile) {
            if (ddlAlbum.SelectedIndex > 0) {
 
            }
            try {
                Directory.CreateDirectory(
                    System.Configuration.ConfigurationManager.AppSettings["ImagesDirectoryLocation"].ToString()
                    + User.Identity.Name);
                upldImage.SaveAs(
                    System.Configuration.ConfigurationManager.AppSettings["ImagesDirectoryLocation"].ToString()
                    + User.Identity.Name + "\\"
                    + upldImage.FileName);
                lblMessage.Text = "File name: " +
                     upldImage.PostedFile.FileName + "<br>" +
                     upldImage.PostedFile.ContentLength + " kb<br>" +
                     "Content type: " +
                     upldImage.PostedFile.ContentType;
            }
            catch (Exception ex) {
                lblMessage.Text = "Upload Failed. " + ex.Message;
            }
        }
        else {
            lblMessage.Text = "You have not specified a file.";
        }
    }

Open in new window

0
tqrecords
Asked:
tqrecords
  • 3
  • 3
1 Solution
 
kssoftwareCommented:
Can you also post your aspx code (or at least a snippet of it that contains the fileupload control)?  If you are using ajax upload panels with the fileupload control, then the file upload will only work under certain circumstances.
0
 
tqrecordsAuthor Commented:
Oh I see. Yes I am using an ajax control for the album component. Here is the aspx code.
<asp:View ID="UploadPictures" runat="server">
            <form id="form1" runat="server">
                <asp:Label ID="Label1" runat="server" Text="Upload Pictures"></asp:Label><br />
                <asp:Panel ID="Panel1" runat="server" Height="16px" Width="272px" style="position: relative; z-index: 100; left: 0px; top: 8px;" BorderColor="Transparent">
                    &nbsp;&nbsp;
                    <asp:Label ID="Label2" runat="server" Text="Upload Pictures" EnableTheming="True" Font-Bold="False" Height="19px" Width="104px" BackColor="LightSteelBlue" ForeColor="Snow"></asp:Label>
                    &nbsp;&nbsp;
                    <asp:Button ID="btnViewPictures" runat="server" Font-Bold="False" Height="19px" Style="z-index: 102; left: -6px; position: relative; top: 0px" Text="My Pictures" Width="104px" BackColor="Gainsboro" ForeColor="Maroon" OnClick="btnViewPictures_Click" />
                  </asp:Panel>
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
                <br />Upload Picture: <asp:FileUpload ID="upldImage" runat="server" />
                <br />Add to Album: <asp:DropDownList ID="ddlAlbum" runat="server"></asp:DropDownList>
                <asp:Button ID="btnLaunchModal" runat="server" Text="Create New Album" />
                <br /><asp:Button ID="btnUploadPicture" runat="server" Text="Upload" OnClick="btnUploadPicture_Click" />
                <asp:UpdatePanel ID="uxUpdatePanel" runat="server">
                    <ContentTemplate>
                        Album Name: <asp:TextBox ID="txtAlbumName" runat="server"></asp:TextBox>
                        <asp:Button ID="btnCreateAlbum" runat="server" Text="Create" OnClick="btnCreateAlbum_Click" />
                        <br />
                        <asp:Button ID="btnDoneCreatingAlbum" runat="server" Text="Done" />
                    </ContentTemplate>
                </asp:UpdatePanel>
                <ajaxToolKit:ModalPopupExtender 
                    ID="uxModalPopupExtender" 
                    runat="server"
                    TargetControlID = "btnLaunchModal"
                    PopupControlID = "uxUpdatePanel"
                    OkControlID = "btnDoneCreatingAlbum"
                    BackgroundCssClass = "modalBg"
                >
                </ajaxToolKit:ModalPopupExtender>
            </form>
            <div style='color:red'>
                <asp:Literal Runat="server" ID="lblMessage" />
            </div>
        </asp:View>

Open in new window

0
 
kssoftwareCommented:
A fileupload control won't work inside the updatepanel using an asynchronous postback.  To upload files inside an UploadPanel you need to use a standard postback - so set your btnUploadPicture to be a Postback trigger (not an AsyncPostback trigger):  this will initiate a standard postback when you click the upload button and the file will be uploaded.   In your code, I have added the trigger as follows:
<Triggers>
    <asp:PostBackTrigger ControlID="btnUploadPicture" />
</Triggers>
inside the definition for the UploadPanel.
<asp:View ID="UploadPictures" runat="server">
            <form id="form1" runat="server">
                <asp:Label ID="Label1" runat="server" Text="Upload Pictures"></asp:Label><br />
                <asp:Panel ID="Panel1" runat="server" Height="16px" Width="272px" style="position: relative; z-index: 100; left: 0px; top: 8px;" BorderColor="Transparent">
                    &nbsp;&nbsp;
                    <asp:Label ID="Label2" runat="server" Text="Upload Pictures" EnableTheming="True" Font-Bold="False" Height="19px" Width="104px" BackColor="LightSteelBlue" ForeColor="Snow"></asp:Label>
                    &nbsp;&nbsp;
                    <asp:Button ID="btnViewPictures" runat="server" Font-Bold="False" Height="19px" Style="z-index: 102; left: -6px; position: relative; top: 0px" Text="My Pictures" Width="104px" BackColor="Gainsboro" ForeColor="Maroon" OnClick="btnViewPictures_Click" />
                  </asp:Panel>
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
                <br />Upload Picture: <asp:FileUpload ID="upldImage" runat="server" />
                <br />Add to Album: <asp:DropDownList ID="ddlAlbum" runat="server"></asp:DropDownList>
                <asp:Button ID="btnLaunchModal" runat="server" Text="Create New Album" />
                <br /><asp:Button ID="btnUploadPicture" runat="server" Text="Upload" OnClick="btnUploadPicture_Click" />
                <asp:UpdatePanel ID="uxUpdatePanel" runat="server">
                    <ContentTemplate>
                        Album Name: <asp:TextBox ID="txtAlbumName" runat="server"></asp:TextBox>
                        <asp:Button ID="btnCreateAlbum" runat="server" Text="Create" OnClick="btnCreateAlbum_Click" />
                        <br />
                        <asp:Button ID="btnDoneCreatingAlbum" runat="server" Text="Done" />
                    </ContentTemplate>
<Triggers>
    <asp:PostBackTrigger ControlID="btnUploadPicture" />
</Triggers>
                </asp:UpdatePanel>
                <ajaxToolKit:ModalPopupExtender 
                    ID="uxModalPopupExtender" 
                    runat="server"
                    TargetControlID = "btnLaunchModal"
                    PopupControlID = "uxUpdatePanel"
                    OkControlID = "btnDoneCreatingAlbum"
                    BackgroundCssClass = "modalBg"
                >
                </ajaxToolKit:ModalPopupExtender>
            </form>
            <div style='color:red'>
                <asp:Literal Runat="server" ID="lblMessage" />
            </div>
        </asp:View>

Open in new window

0
Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
tqrecordsAuthor Commented:
Hey,

I tried that out and it still doesn't seem to recognize the existence of a file.
0
 
kssoftwareCommented:
Your <form> tags need to be outside the <asp:View> tags and I assume the views are inside a multiview?  When I move the <form...> tag to outside your view code and add a multiview, file upload works.  I have attached the code I tested.
<body>
    <form id="form1" runat="server">
    <div>
        <asp:MultiView ID="mv" runat="server" ActiveViewIndex="0">
            <asp:View ID="UploadPictures" runat="server">
                <asp:Label ID="Label1" runat="server" Text="Upload Pictures"></asp:Label><br />
                <asp:Panel ID="Panel1" runat="server" Height="16px" Width="272px" Style="position: relative;
                    z-index: 100; left: 0px; top: 8px;" BorderColor="Transparent">
                    &nbsp;&nbsp;
                    <asp:Label ID="Label2" runat="server" Text="Upload Pictures" EnableTheming="True"
                        Font-Bold="False" Height="19px" Width="104px" BackColor="LightSteelBlue" ForeColor="Snow"></asp:Label>
                    &nbsp;&nbsp;
                    <asp:Button ID="btnViewPictures" runat="server" Font-Bold="False" Height="19px" Style="z-index: 102;
                        left: -6px; position: relative; top: 0px" Text="My Pictures" Width="104px" BackColor="Gainsboro"
                        ForeColor="Maroon" />
                </asp:Panel>
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
                <br />
                Upload Picture:
                <asp:FileUpload ID="upldImage" runat="server" />
                <br />
                Add to Album:
                <asp:DropDownList ID="ddlAlbum" runat="server">
                </asp:DropDownList>
                <asp:Button ID="btnLaunchModal" runat="server" Text="Create New Album" />
                <br />
                <asp:Button ID="btnUploadPicture" runat="server" Text="Upload" />
                <asp:UpdatePanel ID="uxUpdatePanel" runat="server">
                    <ContentTemplate>
                        Album Name:
                        <asp:TextBox ID="txtAlbumName" runat="server"></asp:TextBox>
                        <asp:Button ID="btnCreateAlbum" runat="server" Text="Create" />
                        <br />
                        <asp:Button ID="btnDoneCreatingAlbum" runat="server" Text="Done" />
                    </ContentTemplate>
                    <Triggers>
                        <asp:PostBackTrigger ControlID="btnUploadPicture" />
                    </Triggers>
                </asp:UpdatePanel>
                <div style='color: red'>
                    <asp:Literal runat="server" ID="lblMessage" />
                </div>
            </asp:View>
        </asp:MultiView>
    </div>
    </form>
</body>

Open in new window

0
 
tqrecordsAuthor Commented:
thank you, it seems to work fine now.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Certified Penetration Testing

This CPTE Certified Penetration Testing Engineer course covers everything you need to know about becoming a Certified Penetration Testing Engineer. Career Path: Professional roles include Ethical Hackers, Security Consultants, System Administrators, and Chief Security Officers.

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now