Image Video slideshow from database in ASP.Net using jQuery Boslider plugin

Hi ashish007,

This plugin doesn't support this. You can check with below plugin.

https://www.jqueryscript.net/slideshow/image-video-slideshow-bo.html

Check this example.

HTML

<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"
    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="style.min.css" />
<link rel="stylesheet" type="text/css" href="http://www.jqueryscript.net/css/jquerysctipttop.css" />
<script src="Slideshow.js" type="text/javascript"></script>
<div id="holder">
    <div class="container">
        <ul class="bo-slider">
            <asp:Repeater ID="rp1" runat="server" OnItemDataBound="OnItemDataBound">
                <ItemTemplate>
                    <li id="liImage" runat="server" data-url='<%#Eval("path") %>' data-type="image"></li>
                    <li id="liVideo" runat="server" data-url='<%#Eval("path") %>' data-type="video"></li>
                </ItemTemplate>
            </asp:Repeater>
        </ul>
    </div>
</div>
<script type="text/javascript">
    $(function () {
        $('.bo-slider').boSlider({
            slideShow: true,
            interval: 2000,
            animation: "fade"
        });
    });
</script>

Namepsaces

C#

using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.IO;
using System.Web.UI.HtmlControls;

VB.Net

Imports System.Configuration
Imports System.Data
Imports System.Data.SqlClient
Imports System.IO
Imports System.Web.UI.HtmlControls

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        rp1.DataSource = GetData("SELECT TOP 3 Id,ImageName,path FROM tblFilePath ORDER BY Id DESC");
        rp1.DataBind();
    }
}

protected void OnItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        string file = ((DataRowView)e.Item.DataItem).Row["Path"].ToString();
        string extension = Path.GetExtension(file);

        HtmlGenericControl image = e.Item.FindControl("liImage") as HtmlGenericControl;
        image.Visible = extension == ".jpg" ? true : false;

        HtmlGenericControl video = e.Item.FindControl("liVideo") as HtmlGenericControl;
        video.Visible = extension == ".mp4" ? true : false;
    }
}

private DataTable GetData(string query)
{
    string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(conString))
    {
        SqlCommand cmd = new SqlCommand(query);
        using (SqlDataAdapter sda = new SqlDataAdapter())
        {
            cmd.Connection = con;
            sda.SelectCommand = cmd;
            using (DataTable dt = new DataTable())
            {
                sda.Fill(dt);
                return dt;
            }
        }
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        rp1.DataSource = GetData("SELECT TOP 3 Id,ImageName,path FROM tblFilePath ORDER BY Id DESC")
        rp1.DataBind()
    End If
End Sub

Protected Sub OnItemDataBound(ByVal sender As Object, ByVal e As RepeaterItemEventArgs)
    If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then
        Dim file As String = CType(e.Item.DataItem, DataRowView).Row("Path").ToString()
        Dim extension As String = Path.GetExtension(file)
        Dim image As HtmlGenericControl = TryCast(e.Item.FindControl("liVideo"), HtmlGenericControl)
        image.Visible = If(extension = ".jpg", True, False)
        Dim video As HtmlGenericControl = TryCast(e.Item.FindControl("liVideo"), HtmlGenericControl)
        video.Visible = If(extension = ".mp4", True, False)
    End If
End Sub

Private Function GetData(ByVal query As String) As DataTable
    Dim conString As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using con As SqlConnection = New SqlConnection(conString)
        Dim cmd As SqlCommand = New SqlCommand(query)
        Using sda As SqlDataAdapter = New SqlDataAdapter()
            cmd.Connection = con
            sda.SelectCommand = cmd
            Using dt As DataTable = New DataTable()
                sda.Fill(dt)
                Return dt
            End Using
        End Using
    End Using
End Function