Control to Display Binary Images in ASP.NET
Introduction
The RbmBinaryImage control will help you display images directly from your database. You could bind the Image field directly to the ImageContent property, also you could specify whether you want the display to be as a thumbnail or not and provide the thumbnail size.
Using the RbmBinaryImage Control
<httpHandlers> <add verb="GET" path="__RbmImageHandler.rbm" type="RbmControls.RbmImageHandler" /> </httpHandlers>
<%@ Register Assembly="RbmControls" Namespace="RbmControls" TagPrefix="Rbm" %>
you could either bind the control directly in the ImageContent Property, Also specify whether to display the image as a thumbnail. and specify an image to display when the ImageContent is empty
an alternative is to do that by code
RbmBinaryImage1.ImageContent = FileUpload1.FileBytes;
Using the Code
The Imagecontent Property Retrieves and store the image bytes in the ViewState also if the DisplayThumbnail property is set to true then it retrieves the thumbnail of the image
public byte[] ImageContent
{
get
{
byte[] imageBytes = ViewState["ImageContent"] as byte[];
if (!DisplayThumbnail)
return (imageBytes == null) ? null : imageBytes;
else if (imageBytes != null)
{
byte[] bytes = CreateThumb();
return bytes;
}
else
return null;
}
set
{
ViewState["ImageContent"] = value;
}
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
if (DesignMode)
return;
if (ImageContent != null)
{
if(string.IsNullOrEmpty(CacheKey))
CacheKey = "Rbm" + System.DateTime.Now.Ticks;
ImageUrl = String.Format("~/__RbmImageHandler.rbm?MimeType={0}&EnableCaching={1}&ImageContent={2}",
MimeType, EnableCachinge ? "1" : "0", CacheKey);
if(this.Context.Cache[CacheKey] == null)
this.Context.Cache[CacheKey] = ImageContent;
}
else if (ImageUrl == "" || ImageUrl == null)
{
ImageUrl = EmptyImageUrl;
}
}
public void ProcessRequest(HttpContext context)
{
#region Caching Properties
string cacheKey = context.Request["ImageContent"];
if (String.IsNullOrEmpty(cacheKey))
return;
bool enableCaching = false;
if (!String.IsNullOrEmpty(context.Request["EnableCaching"]))
Boolean.TryParse(context.Request["EnableCaching"], out enableCaching);
#endregion
#region Image Properties
string mimeType = context.Request["MimeType"];
if (string.IsNullOrEmpty(mimeType))
mimeType = "image/jpeg";
byte []imageData = context.Cache[cacheKey] as byte[];
#endregion
if (!enableCaching)
context.Cache.Remove(cacheKey);
context.Response.ContentType = mimeType;
context.Response.OutputStream.Write(imageData, 0, imageData.Length);
}
Share your Thoughts
If you liked the control or have any comments on it or features you want to place in it kindly share your thoughts here
Creating a Movie Database Application with ASP.NET MVC
Hi a nice demonstration that I liked so I thought of highlighting it here by Stephen Walther he builds an entire ASP.NET MVC application from start to finish.
Hope you enjoy it 
Retrieving .NET Server Control using Java Script
I have recently came across a problem to retrieve a .net server control using javascript. Retrieving it using document.getElementById won’t work as this method only retrieves the client controls. So I made a method you could use to retrieve with it any server control even if its inside a user control.
The basic idea is that you could get all controls on the page using document.getElementsByTagName then you need to loop on each control to check whether its id matches your required id or not using a regular expression.
The method takes three parameters the first one is the id of the control you need to get. the second one should be null if the control is directly on the page if not then place the name of the user control. The third parameter is the tag name of the control my method use some helper methods which you will find in this post
function RbmGetDotNetCtrl(idstr,parentidstr,tagstr)
{
var id = new String(idstr);
var tag = new String(tagstr);
var parentId = new String(parentidstr);
var arObj = document.getElementsByTagName(tag);
var serverCtrlName = id.replace(/_/g,'$');
var regExId = new RegExp(id+"$", "ig");
for (var i = 0; i < arObj.length; i++)
{
if (RbmExists(arObj[i].id))
{
if (arObj[i].id.match(regExId) && RbmStringContains(arObj[i].id,parentId))
return arObj[i];
}
else if (RbmExists(arObj[i].name))
{
if (arObj[i].name == serverCtrlName && RbmStringContains(arObj[i].name,parentId))
return arObj[i];
}
}
return false;
}
// This method checks if the object or method exists or not
function RbmExists(obj){
return (typeof(obj) != "undefined") && (obj != null);
}
// This function is used to check if a sub string exists in the main string or not
function RbmStringContains(mainStringstr,subString) {
var mainString = new String(mainStringstr);
place = mainString.indexOf(subString) > -1;
return place;
}
Basically to make it work you will need to put the three methods in your javascript file or inside your script tag