Hi mehram,
Use nested DataList and set RepeatDirection to Horizontal and RepeatColumns to 6 in child DataList, so that it will display 6 Items horizontally on your webpage.
Please refer below sample.
Database
For this example I have used of Northwind database that you can download using the link given below.
Download Northwind Database
HTML
<div class="col-xs-12 col-lg-12 col-md-12">
<div class="col-xs-12 col-lg-12 col-md-12">
<asp:DataList ID="dlEmployees" runat="server" OnItemDataBound="dlEmployee_ItemDataBound" DataKeyField="Country">
<HeaderTemplate>
<table>
<tr>
<th style="width: 150px;">Position Name
</th>
<th>Memebers
</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:Label ID="lblCountry" runat="server" Text='<%#Eval("Country")%>'></asp:Label>
</td>
<td>
<asp:DataList ID="dlDetails" RepeatDirection="Horizontal" runat="server" RepeatColumns="6" CellSpacing="5" RepeatLayout="Table"
DataKeyField="EmployeeId" BorderWidth="4" GridLines="Both" BackColor="Window">
<ItemTemplate>
<table class="table" border="1">
<tr>
<th colspan="2" style="width: 100%;"><b><%# Eval("FirstName") %></b></th>
</tr>
<tr>
<td colspan="1" style="text-align: center">
<input type="checkbox" id='cbEmployee' runat="server" />
<label for='cb<%#Eval("PostalCode") %>'>
<asp:Image ID="lblImage1" runat="server" CssClass="" Width="100px" hight="100px"
ImageUrl='<%#String.Format("~/Images/{0}.jpg", Eval("EmployeeId")) %>' />
</label>
</td>
</tr>
</table>
</ItemTemplate>
</asp:DataList>
</td>
</tr>
</ItemTemplate>
</asp:DataList>
</div>
<asp:Button ID="Button1" Text="Cast Vote" Width="100px" runat="server" OnClick="OnSave" CssClass="btn btn-success" />
</div>
Namespaces
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Code
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
dlEmployees.DataSource = GetData("SELECT DISTINCT Country FROM Employees", string.Empty);
dlEmployees.DataBind();
}
}
protected DataTable GetData(string query, string country)
{
string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand(query, con))
{
if (!string.IsNullOrEmpty(country))
{
cmd.Parameters.AddWithValue("@Country", country);
}
using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
{
using (DataSet ds = new DataSet())
{
DataTable dt = new DataTable();
sda.Fill(dt);
return dt;
}
}
}
}
}
protected void dlEmployee_ItemDataBound(object sender, DataListItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
DataRowView dataRowView = e.Item.DataItem as DataRowView;
string country = dataRowView["Country"].ToString();
DataList datalistDetails = e.Item.FindControl("dlDetails") as DataList;
datalistDetails.DataSource = GetData("SELECT * FROM Employees WHERE Country = @Country", country);
datalistDetails.DataBind();
}
}
protected void OnSave(object sender, EventArgs e)
{
foreach (DataListItem dlItem in dlEmployees.Items)
{
DataList dlChild = (DataList)dlItem.FindControl("dlDetails");
foreach (DataListItem childItem in dlChild.Items)
{
if (((System.Web.UI.HtmlControls.HtmlInputCheckBox)(childItem.FindControl("cbEmployee"))).Checked)
{
// Do rest of task.
}
}
}
}
VB.Net
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
If Not IsPostBack Then
dlEmployees.DataSource = GetData("SELECT DISTINCT Country FROM Employees", String.Empty)
dlEmployees.DataBind()
End If
End Sub
Protected Function GetData(ByVal query As String, ByVal country As String) As DataTable
Dim conString As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using con As SqlConnection = New SqlConnection(conString)
Using cmd As SqlCommand = New SqlCommand(query, con)
If Not String.IsNullOrEmpty(country) Then
cmd.Parameters.AddWithValue("@Country", country)
End If
Using sda As SqlDataAdapter = New SqlDataAdapter(cmd)
Using ds As DataSet = New DataSet()
Dim dt As DataTable = New DataTable()
sda.Fill(dt)
Return dt
End Using
End Using
End Using
End Using
End Function
Protected Sub dlEmployee_ItemDataBound(ByVal sender As Object, ByVal e As DataListItemEventArgs)
If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then
Dim dataRowView As DataRowView = TryCast(e.Item.DataItem, DataRowView)
Dim country As String = dataRowView("Country").ToString()
Dim datalistDetails As DataList = TryCast(e.Item.FindControl("dlDetails"), DataList)
datalistDetails.DataSource = GetData("SELECT * FROM Employees WHERE Country = @Country", country)
datalistDetails.DataBind()
End If
End Sub
Protected Sub OnSave(ByVal sender As Object, ByVal e As EventArgs)
For Each dlItem As DataListItem In dlEmployees.Items
Dim dlChild As DataList = CType(dlItem.FindControl("dlDetails"), DataList)
For Each childItem As DataListItem In dlChild.Items
If (CType((childItem.FindControl("cbEmployee")), System.Web.UI.HtmlControls.HtmlInputCheckBox)).Checked Then
' Do rest of task.
End If
Next
Next
End Sub
Screenshot
