This tutorial will teach you how to display a random image on page load, and then keep that image until the sessions expires. Upon expiration a new random image will be chosen on a new session.

We will be using ASP.NET and Visual Basic; this will be done programmatically, thru the Code behind Page.

This tutorial will show how we can choose a random image to display on page load, and this same image will remain for the duration of the session. This means that no matter how many times the visitor refreshes the page; the image will remain the same. However, if the browser is closed and the session ends, a new image will be chosen at random upon a new session start, and remain until the session ends, again.

First we need to reference the System.IO Class in our code behind.

Go to your Default.aspx.cs and in the using statements add the line below.

Code Block
Default.aspx

Using statement.

Imports System.IO

In this example we will only be using a simple image tag to display the image on the webpage. Very little ASP.Net being used since everything is being done programmatically thru our code behind.

Code Block
Default.aspx.cs

<form id="form1" runat="server">
        <% Response.Write("<img src='" + chooseImage() + "' />");%>
</form>

On page load, we will call the method to choose the background image at random, but only if an image has not yet been selected this session.

Code Block
Default.vb

Method to choose the image on page load.

Protected Sub Page_Load(ByVal sender As ObjectByVal e As System.EventArgsHandles Me.Load
chooseImage()
End Sub

Let’s add an Images Folder to store the images

In your solution explorer right click on your website and select Add new folder.

Let’s name that new folder Media

Then right click on the Media folder and let’s add another folder and we can name that
folder img to store our random images.

Now let’s add the images to that folder. Right click on the img folder, and select add existing items, where you will find your images and at that point you may select your images.

Pro tip, it is suggested you name your images properly for whatever it is your trying to do, also it helps when trying find or call the images at a later time.

Now we will write the code to call on the images.

Now the next event, we will select the image from the img folder and here in this line of code you will specify the actual path.
Specify as a string, since you will be displaying an image.

The code-behind will look something like this:

Code Block
Default.VB 

Function to retrieve the image from the images folder

Public Function chooseImage() As String
If Session("img"Is Nothing Then
Dim imgPath As String
Dim fileCount As Integer = Directory.GetFiles(Server.MapPath("/media/img/"), "*.*"SearchOption.TopDirectoryOnly).Length
fileCount = fileCount + 1
imgPath = "media/img/" & RandomNumber(1, fileCount) & ".jpg"
Session("img") = imgPath

Next we will want it to check if it’s the same images in a new sessions so let’s call an Else Statement and have it return a new image if the selected image has already been used in a previous session.

Code Block
Default.vb

Method to return the images randomly

Else
Return Session("img").ToString()
End If
End Function
 
Private Function RandomNumber(ByVal min As IntegerByVal max As IntegerAs Integer
Dim random As New Random()
Return random.Next(min, max)
End Function
End Class

Completion

And It’s really that simple, we have successfully displayed a random image on page load, while also detecting if the image was used previously in another session by using the If and Else Statements. 

Please download our full source code to reference along with this tutorial.

27 – RandomImageSession-vb.zip