Image copy/Paste on a asp.net webpage

Last post 06-04-2008 12:25 AM by Hari_yerra. 18 replies.

Sort Posts:

  • Image copy/Paste on a asp.net webpage

    08-23-2007, 4:47 AM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

     

    Hi All,            I need a help, in my project I have a requirement, which is I have to copy image from MS-Word and paste it on webpage directly. So that copied image should be display on webpage and save into server automatically. It can be possible using windows applications…, but now the same functionality has to implement in asp.net web applications. Any help much appreciated.

    J Hint:  using javascript Clipboard functionality we may achieve it, but could get correct solution for this . :(

    Thanks,

    Naidu 

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    08-23-2007, 3:35 PM
    • Loading...
    • gunteman
    • Joined on 07-11-2007, 12:57 PM
    • Norrköping, Sweden
    • Posts 2,139

     Unfortunately this is not possible using standard web technologies (HTML, Javascript). You will have to use an ActiveX control or a Java Applet.

    I think there are quite a few that can handle this, e.g this one 

    -- "Mark As Answer" If my reply helped you --
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 3:19 AM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

    Thanks for your reply. Could you suggest me any activeX control pls, Its urgent for me. 

    Thanks,

    Naidu

     

     

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 6:20 AM

    I was wondering whats so different with my machine, I can just select any area and press ctrl+c and paste it here, but when I ask others to do the same(during giving instructions), they are unable to.

    e.g.

    The message you are replying to: Re: Image copy/Paste on a asp.net webpage

    Compose
    Options
    Related
    Preview

     

     

    Please Mark Post that helped you as answer, also include a summary of what solved the problem as it helps others in similar situations
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 7:05 AM
    • Loading...
    • MSRKrishna
    • Joined on 09-11-2007, 10:24 AM
    • Posts 1

    Working with Image, Sql Server and ASP.NET 2.0

    In this article, I discuss a simple application to store and retrieve images in Sql Server Database using Asp.NET 2.0.

    The following are what we use in this project:

    • Sql Server 2005 Express Edition
    • FileUpload control, Image control, GridView control with SqlDataSource control

    Follow the steps given below:

    First create a new website either with Visual Studio.Net 2005 or Visual Web Develoer Express Edition 2005 using  File -> New Website. Give any name you like to this new project.

    Connect to MSDB database in Sql Server 2005 Express edition using Database Explorer/Server Explorer. You can use any other database or standard/enterprise edition. In this case change connection string accordingly.

    Create a table called PERSONS with the following structure.

    create table Persons
    ( name  varchar(30) primary key,
      photo  image
    )

    Add a new ASP.NET page with name AddPerson.aspx and select the language as C#

    The following is the source code of Addperson.aspx.

    <%@ Page Language="C#" %>
    <%@ Import Namespace="System.Data.SqlClient"%>
    <%@ Import Namespace="System.Data"%>
    <%@ Import Namespace="System.IO "%>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <script runat="server">
    
       protected void Button1_Click(object sender, EventArgs e)
       {
        Stream imagestream;
       
        int len = FileUpload1.PostedFile.ContentLength; // get length of the file
        imagestream = FileUpload1.PostedFile.InputStream; // get stream for the image
        Byte [] imagecontent = new Byte[len];  // create an array of bytes to hold image data
        imagestream.Read(imagecontent, 0, len); // read image into array
    
        SqlConnection con = new SqlConnection("Data Source=localhost\\sqlexpress;Initial Catalog=msdb;Integrated Security=True");
        con.Open();
        SqlCommand cmd = new SqlCommand("insert into persons values (@name,@photo)",con);
        cmd.Parameters.Add("@name", SqlDbType.VarChar, 20).Value = TextBox1.Text;
        cmd.Parameters.Add("@photo", SqlDbType.Image).Value = imagecontent;
        cmd.ExecuteNonQuery(); // insert
        con.Close();
        Response.Write("Person Added Successfully");
      }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Add Person</title>
    </head>
    <body>
    <h2>Add Person</h2>
        <form id="form1" runat="server">
        <div>
        <table>
            <tr>
                <td>Person Name 
                </td>
                <td>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>Person's Photo
                </td>
                <td>
                    <asp:FileUpload ID="FileUpload1" runat="server" />
                </td>
            </tr>
        </table>
        <p />
        <asp:Button ID="Button1" runat="server" Text="Add Person" OnClick="Button1_Click" />
            <p />
            <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="persons.aspx">Show Persons</asp:HyperLink>
            </div>
        </form>
    </body>
    </html>
    

    This allows user to enter person name and upload jpg/gif file that contains photo of the person. When you click on Add Person button, name and photo are inserted into PERSONS table in Sql Server database.

    When your click on link Show Persons then it will display name and photo of each person stored in PERSONS table using persons.aspx. So add persons.aspx file to your project. This page contains SqlDataSource and GridView controls.

    Persons.aspx uses SQLDataSource control to retrieve data from PERSONS table. The data is displayed using GridView with a simple bound column and a template column. Template column contains itemtemplate, which contains  Image web control of ASP.NET.

    The following is the code for persons.aspx.

    <%@ Page Language="C#" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        String GetUrl(Object name)
        {
            return "getphoto.aspx?name=" + name.ToString();
        }
    
        protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
        {
    
        }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <h2>List Of Persons </h2>
            &nbsp;<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="name"
                DataSourceID="SqlDataSource1" CellPadding="5" CellSpacing="1" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
                <Columns>
                    <asp:BoundField DataField="name" HeaderText="name" ReadOnly="True" SortExpression="name" />
                    <asp:TemplateField HeaderText="Photo">
                      <ItemTemplate>
                        <asp:Image ImageUrl='<%# GetUrl(Eval("name"))%>'   runat="server"  Width="100" Height="100"/>
                      </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
                <HeaderStyle BackColor="#FF8080" />
            </asp:GridView>
    
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:msdbConnectionString %>"
                SelectCommand="SELECT [name], [photo] FROM [persons]"></asp:SqlDataSource>
        </form>
    </body>
    </html>
    
    

    GridView displays image taken from getphoto.aspx file in each image control of the gird row. GetPhoto.aspx is used to write image using BinaryWrite method of the Response object. Name of the person is passed as parameter to getphoto.aspx.

    The following is the code for getphoto.aspx file.

    <%@ Page Language="C#" %>
    <%@ import Namespace="System.Data" %>
    <%@ import Namespace="System.Data.SqlClient" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <script runat="server">
          
        protected void Page_Load(object sender, EventArgs e)
        {
            String name = Request.QueryString["name"];
    
            SqlConnection myConnection = new SqlConnection("Data Source=localhost\\sqlexpress;Initial Catalog=msdb;Integrated Security=True");
            myConnection.Open();
            SqlCommand myCommand = new SqlCommand("select photo from persons where name ='" + name + "'", myConnection);
            SqlDataReader myDataReader;
            myDataReader = myCommand.ExecuteReader();
            myDataReader.Read(); // goto first row
            Response.BinaryWrite( (byte[]) myDataReader["photo"]);
            myConnection.Close();
        }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        
        </div>
        </form>
    </body>
    </html>
    
    

    Try running this application. Add a few persons using AddPerson.aspx. Then click on link to show persons.  You must see person name and photo.

    Keep Learning,

    Filed under:
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 7:08 AM

    Dear God,

     

    Did I misunderstood the question, was it about saving image on DB? Tongue Tied

    Please Mark Post that helped you as answer, also include a summary of what solved the problem as it helps others in similar situations
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 7:58 AM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

    Yes, my requirement is different.Tongue Tied

    Actually what is my requirement is:  Just like copy paste image on MS Paint, i want to copy image from ms-word and paste it on web page, i think for text, javascript clipboard is working but for image, it is not working Crying.

      if you suggest any image editor or third party control for this task, it will be very help full to me.

     Thanks 

     

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    09-11-2007, 8:06 AM

    Hi there,

     

    Please look at this example as it seems to fit your needs http://www.codeproject.com/cs/media/IECapture.asp 

     

    Good luck

     

    Please Mark Post that helped you as answer, also include a summary of what solved the problem as it helps others in similar situations
  • Re: Image copy/Paste on a asp.net webpage

    04-18-2008, 2:01 PM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

    Hi all,

             i have been doing r & d since past couple of days on this issue ( get image from clipboard in asp.net ) again. my client strictly wanted this functionality.  Atlast i implemented an activx control using windows control library. where it has a richtextbox control and upload button. in richtextbox control(by default it suports text and image)  we can paste images and text also . at first i got achieved this clipboard image using system dll's (user32.ddl etc). it worked fine in my localsystem, but not working in intranet or remote systems. it asking lot more permissions to run or execute this user control. so retrieved this image meta data from richtextbox and dynamically i converted it into image (gif format). then i uploaded this image data in byte[] format to webserver using webservice. in web server(where i hosted webapp) again i converted it into gif format and saving into webserver attachments folder. thats it its working fine now.

    the below code gives the how to get image data from richtextbox control... if you need full code .. send me a mail to vrsanaidu@gmail.com... i cant write total code here.

    If you got any better ideas after using this.. please share with me. 

     

    Private Sub FindMetafiles()

    Dim BoxCopy As String

    Dim n, m, StartCode, StartofImage, EndofImage As Long

    Dim FoundBegin, FoundEnd As Boolean

    Dim number As Int32 = 0

    FoundBegin = False

    FoundEnd = False

    'Find the Pics and save them to Metafile array:

    BoxCopy = RichTextBox1.Rtf

    RichTextBox2.Text = RichTextBox1.Rtf()

    For n = 0 To BoxCopy.Length - 7

    '

    If BoxCopy.Substring(n, 6) = "{\pict" Then

    StartofImage = n

    FoundBegin = True

    End If

    '

    If FoundBegin = True Then

    If BoxCopy.Substring(n, 1) = "}" Then

    EndofImage = n - 2

    'n = BoxCopy.Length

    FoundEnd = True

    End If

    End If

    '

    'Execute the piece if the beginning({\pic) and the end (}) of the image is found

    If FoundBegin = True And FoundEnd = True Then

    FoundEnd = False

    FoundBegin = False

    number += 1

    ReDim Preserve Pictures(number)

    '

    'Find beginning of Hex code of picture; this might give problems if the image properties are more than one line!!

    StartCode = StartofImage

    For m = StartofImage To StartofImage + 200 'max(?) of preferences of picture (e.g. \pichgoal)

    If BoxCopy.Substring(m, 1).GetHashCode = 177583 Then

    StartCode = m + 1

    m = StartofImage + 200

    End If

    Next

    '

    'We now can cut off the hexcode to process it further

    HexString = BoxCopy.Substring(StartCode, EndofImage - StartCode)

    '

    'We also need the properties of the image (\picxgoal...etc) so:

    'Properties = BoxCopy.Substring(StartofImage, StartCode - StartofImage) & " " 'Add this extra spaces (>=10) as 'safety' zone so the

    '

    'Now try to extract the image sizes and mmtype:

    If HexString.Substring(0, 6) = "{\pict" Then

    HexString = HexString.Substring(6, HexString.Length - 6)

    End If

    If HexString.Substring(0, 10) = "\wmetafile" Then

    HexString = HexString.Substring(11, HexString.Length - 11)

    End If

    If HexString.Substring(0, 5) = "\picw" Then

    HexString = HexString.Substring(10, HexString.Length - 10)

    End If

    If HexString.Substring(0, 5) = "\pich" Then

    HexString = HexString.Substring(10, HexString.Length - 10)

    End If

    If HexString.Substring(0, 9) = "\picwgoal" Then

    HexString = HexString.Substring(14, HexString.Length - 14)

    End If

    If HexString.Substring(0, 9) = "\pichgoal" Then

    HexString = HexString.Substring(14, HexString.Length - 14)

    End If

    RemoveCrLr()

    CopyIntoBuffer()

    End If

    '

    Next

    End Sub

    Sub CopyIntoBuffer()

    Dim i As Long

    Dim intArraySize As Long = CInt((Len(HexString) + 1) / 2) - 1

    ReDim Buffer(intArraySize)

    For i = 0 To intArraySize

    Buffer(i) = "&H" & Mid(HexString, i * 2 + 1, 2)

    Next i

    HexString = Nothing

    If (mStr_UserText = "") Then  // i am passing  this property value (Image) from my aspx page. 

    mStr_UserText = System.Guid.NewGuid().ToString()

    End If

    If (clipBoardGUID = "") Then

    clipBoardGUID = System.Guid.NewGuid().ToString()

    End If

    MessageBox.Show("1")

    Dim ms As New System.IO.MemoryStream(Buffer)

    ms.Position = 0

    clipService.PutImage(Buffer, clipBoardGUID)

    HexString = String.Empty

    MessageBox.Show("Successfully uploaded!.")

    End Sub

    Thanks & Regards

    Naidu 

     

     

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    04-23-2008, 2:15 AM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

    Hi, so many members are asking me for code, click on below download link to get full code.

     http://rapidshare.com/files/109711605/Imagecopypaste.zip

    Thanks,
    Naidu 

     

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    04-23-2008, 4:19 PM
    • Loading...
    • User007
    • Joined on 04-07-2008, 9:21 PM
    • Posts 8

    Hi,

    I have a problem similar to this. I have to copy paste selected rows n columns from excel or ms word to a gridview. somebody please help

  • Re: Image copy/Paste on a asp.net webpage

    04-25-2008, 10:01 AM
    • Loading...
    • vrsanaidu
    • Joined on 09-06-2005, 9:34 AM
    • hyderabad
    • Posts 35

    Smile  , from clipboard data you will get some format, that is based on your copy content... so through code get data in same format and upload into xml or datatable format to webserver... there again you need to convert into datatable format and bind it to gridview.

    hope it will help you! 

     

    Regards,

    Naidu 

    Thanks,
    vrsanaidu - keep smiling
    happyact.com
    web developer
  • Re: Image copy/Paste on a asp.net webpage

    04-25-2008, 6:12 PM
    • Loading...
    • User007
    • Joined on 04-07-2008, 9:21 PM