Display multiple records per row with Datalist control in asp.net (C#, VB) - Free Asp.Net,MVC,AngularJs,Jquery,Javascript,Sql Server,WCF,Entity framework snippets and tutorial

Display multiple records per row with Datalist control in asp.net (C#, VB)

Introduction: In this article today I will explain how we can display multiple records per row with Datalist control in asp.net (C#, VB)
Display multiple records per row with Datalist


We can customize the Datalist layout through its RepeatColumns and RepeatDirection properties.  In this example I want to display 4 records in a row with horizontal direction (Left to right).
Drag and the drop the Datalist control from toolbox to webform and designed the webform as shown below: 

HTML Markup of Webform: 
<fieldset style="width:53%">
    <legend>Repeat Cloumns in Datalist</legend>
    <asp:DataList ID="dlemp" runat="server" CellPadding="5" RepeatColumns="4"
           CellSpacing="5" RepeatDirection=" Horizontal">
           <HeaderStyle VerticalAlign="Middle" Font-Size="20PX" BackColor="Black" ForeColor="White" />
      Employees Details  
      <asp:Image ID="imgEmp" runat="server" Width="100px" Height="80px" ImageUrl='<%# Eval("image") %>' style="padding-left:20px"/><br />
     <b>Employee Name: </b>             
                <asp:Label ID="lblename" runat="server" Text='<%# Eval("Emp_Name") %>'></asp:Label> <br />
                <b>Employee Salary:</b>
                <asp:Label style="text-align:justify" ID="lblesalary" runat="server" Text='<%# Eval("emp_salary") %>'></asp:Label><br />
           <b>Employee City: </b> <asp:Label ID="lblCity" runat="server" Text=' <%# Eval("emp_Adress") %>'></asp:Label>

C# Code: 
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
    protected void Page_Load(object sender, EventArgs e)
        if (!IsPostBack)
    public void BindDatalist()
        SqlDataAdapter adp = new SqlDataAdapter("Select * from employee", con);
        DataTable dt = new DataTable();
        if (dt.Rows.Count > 0)
            dlemp.DataSource = dt;
VB code: 
Imports System.Data
Imports System.Data.Sql
Imports System.Configuration

Private con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())
    Protected Sub Page_Load(sender As Object, e As EventArgs)
        If Not IsPostBack Then
        End If
    End Sub
    Public Sub BindDatalist()
        Dim adp As New SqlDataAdapter("Select * from employee", con)
        Dim dt As New DataTable()
        If dt.Rows.Count > 0 Then
            dlemp.DataSource = dt
        End If

    End Sub

Is this article helpful for you?

If yes post your comment to appreciate my work and fell free to contact me. You can like me on Facebook, Google+, Linkedin and Twitter via hit on Follow us Button and also can get update follow by Email.

What do you think about this article?

If you found this article useful, please share and follow on Facebook, Twitter, Google Plus and other social media websites. To get free updates subscribe to newsletter. Please put your thoughts and feedback in comments section.

Share this

Share on FacebookTweet on TwitterPlus on Google+