Solved

ASP.NET - Viewing images stored on a users PC

Posted on 2011-03-15
4
319 Views
Last Modified: 2012-05-11
I want to create a file upload web page which will allow photographs to be uploaded to the web server.  What I really want is for the user to specify a folder and for the web page to display thunbnails of each of the images in the folder with checkboxes so that the user can select which images to upload and then upload them.

My main question is how would I display a thumbnail image of a photo located on the users PC without first uploading it?  The images are likely to be very large as they will be high resolution photos.
0
Comment
Question by:ChrisMDrew
  • 2
4 Comments
 

Author Comment

by:ChrisMDrew
ID: 35142678
After more browsing it seems that I cannot get a list of images on the users selected folder - seems obvious really as it would be a security risk.  Is there a better way of being able to select multiple files to upload and then getting a thumbnail of each?
0
 
LVL 16

Accepted Solution

by:
Kamal Khaleefa earned 500 total points
ID: 35146637
try to upload files one by one and store them in a session
once you upload all the files upload the session to the server
here is an example

ASPx Code
-------------------------------
<tr>
                         
                         
                           
                            <td width="15%">
                                <asp:Label ID="Label1436" runat="server" CssClass="FieldName" Text="upload:"
                                    ToolTip="Select a file"></asp:Label>
                            </td>
                            <td width="25%">
                               
                                <asp:FileUpload ID="FileUpload2" runat="server"  CssClass="textbox_m"
                                    TabIndex="51" />
                         
                            </td>
                            <td align="justify">
                                &nbsp;&nbsp;
                                <asp:Button ID="btnUploadNew" runat="server"                                     CssClass="button" Text="upload" ToolTip="Upload File" TabIndex="52" />
                            </td>
                           </tr>
<tr>
                        <td style="width: 100%; vertical-align: middle" colspan="2" align="center">
                            <table width="100%" border="1" cellpadding="0" cellspacing="0">
                                <tr style="height: 10px">
                                    <td align="center" colspan="2">
                                        <asp:GridView ID="gvNewAttachement" runat="server" CssClass="datagrid_back" BorderWidth="1"
                                            BorderStyle="Dashed" Width="80%" AllowPaging="true" PageSize="20">
                                            <HeaderStyle CssClass="FormMenuBar" HorizontalAlign="center" />
                                            <RowStyle CssClass="GridRowStyle" />
                                            <AlternatingRowStyle CssClass="GridAlternatingRowStyle" />
                                            <Columns>
                                            </Columns>
                                        </asp:GridView>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>



code behind
--------------------
Private Sub btnUploadNew_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnUploadNew.Click
       

        If Not Session("CurrentDataNew") Is Nothing Then

            Dim dt As DataTable = CType(Session("CurrentDataNew"), DataTable)
            Dim dtPreview As DataTable = CType(ViewState("CurrentDataPreviewNew"), DataTable)

            Dim count As Integer = dtPreview.Rows.Count
            BindGridNew(count)
        Else
            BindGridNew(1)
        End If
    End Sub

    Sub BindGridNew(ByVal rowcount As Integer)

        gvNewAttachement.Columns.Clear()

        Dim dt As DataTable = New DataTable
        Dim dtPreview As DataTable = New DataTable

        Dim dr As DataRow
        Dim drPreview As DataRow

        dt.Columns.Add(New System.Data.DataColumn("Extension", GetType(String)))
        dt.Columns.Add(New System.Data.DataColumn("FileName", GetType(String)))
        dt.Columns.Add(New System.Data.DataColumn("PostedFile", GetType(Object)))
        dt.Columns.Add(New System.Data.DataColumn("FileSize", GetType(Object)))

        dt.Columns.Add(New System.Data.DataColumn("Comments", GetType(Object)))

        dtPreview.Columns.Add(New System.Data.DataColumn("Extension", GetType(String)))
        dtPreview.Columns.Add(New System.Data.DataColumn("FileName", GetType(String)))
        dtPreview.Columns.Add(New System.Data.DataColumn("Comments", GetType(String)))
        If Not Session("CurrentDataNew") Is Nothing Then



            dt = CType(Session("CurrentDataNew"), DataTable)

            If Not ViewState("CurrentDataPreviewNew") Is Nothing Then
                dtPreview = CType(ViewState("CurrentDataPreviewNew"), DataTable)
            End If


            If (dt.Rows.Count > 0) Then

                dr = dt.NewRow()
                drPreview = dtPreview.NewRow()

                dr(0) = FileUpload2.PostedFile.ContentType
                'Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length)
                '

                drPreview(0) = FileUpload2.PostedFile.ContentType
                'Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length)
                '

                '    drPreview(0) = Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length) 'FileUpload1.PostedFile.ContentType


                'Dim x As Integer = FileUpload1.PostedFile.FileName.LastIndexOf(".")
                'Dim r As String = Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length)

                If Not FileUpload2 Is Nothing AndAlso FileUpload2.PostedFile.FileName <> "" Then

                    dr(1) = FileUpload2.PostedFile.FileName
                    drPreview(1) = FileUpload2.PostedFile.FileName
                    dr(2) = FileUpload2
                    dr(3) = FileUpload2.PostedFile.ContentLength
                End If
                drPreview(2) = txtAttachementComentNew.Text
                dr(4) = txtAttachementComentNew.Text

                dt.Rows.Add(dr)
                dtPreview.Rows.Add(drPreview)
            End If

            '



        Else
            ' drUpload = dtUpload.NewRow()
            dr = dt.NewRow
            drPreview = dtPreview.NewRow
            dr(0) = FileUpload2.PostedFile.ContentType
            'Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length) '
            drPreview(0) = FileUpload2.PostedFile.ContentType
            ' Mid(FileUpload1.PostedFile.FileName, FileUpload1.PostedFile.FileName.LastIndexOf(".") + 1, FileUpload1.PostedFile.FileName.Length)
            '


            If Not FileUpload2 Is Nothing AndAlso FileUpload2.PostedFile.FileName <> "" Then


                dr(1) = FileUpload2.PostedFile.FileName
                drPreview(1) = FileUpload2.PostedFile.FileName



                dr(2) = FileUpload2
                dr(3) = FileUpload2.PostedFile.ContentLength
            End If

            ' dr(2) = TextBox3.Text
            drPreview(2) = txtAttachementComentNew.Text
            dr(4) = txtAttachementComentNew.Text

            dt.Rows.Add(dr)
            dtPreview.Rows.Add(drPreview)

            '  dtUpload.Rows.Add(drUpload)
        End If


        ' If ViewState has a data then use the value as the DataSource
        If Not Session("CurrentDataNew") Is Nothing Then


            gvNewAttachement.DataSource = CType(ViewState("CurrentDataPreviewNew"), DataTable)


            Dim ss As DataControlField
            ss = New ButtonField()
            CType(ss, ButtonField).HeaderText = "select"
            CType(ss, ButtonField).Text = "delete"
            CType(ss, ButtonField).CommandName = "select"
            CType(ss, ButtonField).ItemStyle.ForeColor = Drawing.Color.Red

            gvNewAttachement.Columns.Add(ss)
            gvNewAttachement.DataBind()
            'GridView1.Columns(1).HeaderText = "filetype"
            'GridView1.Columns(2).HeaderText = "filename"

        Else

            gvNewAttachement.DataSource = dtPreview

            Dim ss As DataControlField
            ss = New ButtonField()
            CType(ss, ButtonField).HeaderText = "select"
            CType(ss, ButtonField).Text = "delete"
            CType(ss, ButtonField).CommandName = "select"
            CType(ss, ButtonField).ItemStyle.ForeColor = Drawing.Color.Red
            gvNewAttachement.Columns.Add(ss)
            gvNewAttachement.DataBind()
            'GridView1.Columns(1).HeaderText = "Filetype"
            'GridView1.Columns(2).HeaderText = "filename"

        End If

        Session("CurrentDataNew") = dt
        ViewState("CurrentDataPreviewNew") = dtPreview
        'GridView1.Columns(1).HeaderText = "Filetype"
        'GridView1.Columns(2).HeaderText = "filename"


    End Sub
0
 
LVL 17

Expert Comment

by:ToAoM
ID: 35147426
You will need to use Silverlight, Flash or Java to get this done. Standard HTML controls doe not have access to the information you want.

These plugins can request additional rights to show data through user selected folders (file picker) or after a security prompt can get full access to a users machine. And they have specific built in support for these kinds of scenario's (plus these scenarios are well documented).

If you want to stick to HTML and Javascript, there are browser specific API's to gain access to the local file system. Firefox for example can request access to your local filesystem through the following call:
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");

But this only works if you have signed your javascript file:
http://www.mozilla.org/projects/security/components/signed-scripts.html

The CommonJS project is also working on Filesystem access libraries for Javascript. I'm not sure how far along they are:
http://wiki.commonjs.org/wiki/CommonJS

0
 

Author Closing Comment

by:ChrisMDrew
ID: 35279708
Sorry took a while to get back to this as the project hasn't yet got the go-ahead
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Sometimes in DotNetNuke module development you want to swap controls within the same module definition.  In doing this DNN (somewhat annoyingly) swaps the Skin and Container definitions to the default admin selections.  To get around this you need t…
IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now