WebPart to display Images from SQl Server database
I had a requirenment for creating a WebPart which will display Images stored in SQL Server database.
The Steps Involved are :
1. Create a WebPart Project using vsewss (Download Vsewss extensions, if you dont have this). or wspbuilder as per your choice.
2. Add a gridview control in the class file for the project. This grid will display the Images in the webpart.
3. Create a Httphandler - To Pull in the Images from SQL, we will create an HttpHandler and will deploy it along with our webpart soultion file. To see how to create an HttpHandler see : Create Custom HttpHandler in SharePoint
4. Now, once you have created that blank httphandler in your webpart project, you need to simply Change the Code in the httpHandler file to below
<%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c " %>
<%@ Assembly Name="OurCustomWebPartNameSpace, Version=1.0.0.0, Culture=neutral, PublicKeyToken=9f4da00116c38ec5" %> // Add this after you build the soultion with Cutsom handler.
<%@ WebHandler Language="C#" Class="OurCustomWebPartNameSpace.MyCustomHandler" %>
using System;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;
using System.Data.Common;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
namespace OurCustomWebPartNameSpace
{
public class MyCustomHandler: IHttpHandler
{
public bool IsReusable
{
get { return false; }
}
public void ProcessRequest(HttpContext context)
{
SPSite mySite = SPContext.Current.Site;
SPWeb myWeb = mySite.OpenWeb();
//Using RunWithElevatedPrivileges
SPSecurity.RunWithElevatedPrivileges(delegate()
{
using (SPSite siteCollection = new SPSite(mySite.ID))
{
using (SPWeb web = siteCollection.OpenWeb(myWeb.ID))
{
web.AllowUnsafeUpdates = true;
try
{
context.Response.ContentType = "image/jpeg";
SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["MyConnString"].ConnectionString);
SqlDataReader Reader = null;
string imageid = context.Request.QueryString["ImgID"];
// SqlConnection conn = new SqlConnection("your_connectionstring");
conn.Open();
SqlCommand comm = new SqlCommand("select empphoto from EmployeeDetailTable where EmpNumber="+ imageid, conn);
Reader = comm.ExecuteReader(CommandBehavior.CloseConnection);
Reader.Read();
context.Response.BinaryWrite((Byte[])Reader["empphoto"]);
context.Response.End();
}
catch (Exception myException)
{
Microsoft.Office.Server.Diagnostics.PortalLog.LogString("Exception Occurred: {0} {1}", myException.Message, myException.StackTrace);
} // Error logging in SharePoint logs.
web.AllowUnsafeUpdates = false;
}
}
});
}
}}}
5. Now, In your WebPart Class file add a new template for the Gridview control. In Item template add a Image type control and specify its url propery as below :
ImageUrl="../../_LAYOUTS/MyWebPartHandler/MyCustomHandler.ashx?ImgID=1000"
Or if you are using a user control then use
<asp:Image ID="Image1" runat="server" ImageUrl='<%# "../../_LAYOUTS/MyWebPartHandler/MyCustomHandler.ashx?ImgID=1000" %>'/>
Thats it.
6. Now build and deploy your WebPart. Verify that the handler gets deployed to layouts folder.
The Steps Involved are :
1. Create a WebPart Project using vsewss (Download Vsewss extensions, if you dont have this). or wspbuilder as per your choice.
2. Add a gridview control in the class file for the project. This grid will display the Images in the webpart.
3. Create a Httphandler - To Pull in the Images from SQL, we will create an HttpHandler and will deploy it along with our webpart soultion file. To see how to create an HttpHandler see : Create Custom HttpHandler in SharePoint
4. Now, once you have created that blank httphandler in your webpart project, you need to simply Change the Code in the httpHandler file to below
<%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c " %>
<%@ Assembly Name="OurCustomWebPartNameSpace, Version=1.0.0.0, Culture=neutral, PublicKeyToken=9f4da00116c38ec5" %> // Add this after you build the soultion with Cutsom handler.
<%@ WebHandler Language="C#" Class="OurCustomWebPartNameSpace.MyCustomHandler" %>
using System;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;
using System.Data.Common;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
namespace OurCustomWebPartNameSpace
{
public class MyCustomHandler: IHttpHandler
{
public bool IsReusable
{
get { return false; }
}
public void ProcessRequest(HttpContext context)
{
SPSite mySite = SPContext.Current.Site;
SPWeb myWeb = mySite.OpenWeb();
//Using RunWithElevatedPrivileges
SPSecurity.RunWithElevatedPrivileges(delegate()
{
using (SPSite siteCollection = new SPSite(mySite.ID))
{
using (SPWeb web = siteCollection.OpenWeb(myWeb.ID))
{
web.AllowUnsafeUpdates = true;
try
{
context.Response.ContentType = "image/jpeg";
SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["MyConnString"].ConnectionString);
SqlDataReader Reader = null;
string imageid = context.Request.QueryString["ImgID"];
// SqlConnection conn = new SqlConnection("your_connectionstring");
conn.Open();
SqlCommand comm = new SqlCommand("select empphoto from EmployeeDetailTable where EmpNumber="+ imageid, conn);
Reader = comm.ExecuteReader(CommandBehavior.CloseConnection);
Reader.Read();
context.Response.BinaryWrite((Byte[])Reader["empphoto"]);
context.Response.End();
}
catch (Exception myException)
{
Microsoft.Office.Server.Diagnostics.PortalLog.LogString("Exception Occurred: {0} {1}", myException.Message, myException.StackTrace);
} // Error logging in SharePoint logs.
web.AllowUnsafeUpdates = false;
}
}
});
}
}}}
5. Now, In your WebPart Class file add a new template for the Gridview control. In Item template add a Image type control and specify its url propery as below :
ImageUrl="../../_LAYOUTS/MyWebPartHandler/MyCustomHandler.ashx?ImgID=1000"
Or if you are using a user control then use
<asp:Image ID="Image1" runat="server" ImageUrl='<%# "../../_LAYOUTS/MyWebPartHandler/MyCustomHandler.ashx?ImgID=1000" %>'/>
Thats it.
6. Now build and deploy your WebPart. Verify that the handler gets deployed to layouts folder.
Are you a Sharepoint developer? If Yes, the why not Sell your webparts and earn some extra money.
ReplyDeleteVisit
Submit Your WebPart
I've tried this but instead of displaying the image, it display the binary data, i'm trying with sharepoint 2010 though, any idea why? thanks in advance...
ReplyDelete