sql query to display info grouped by Category

Question

OK, I have an SQL Query that gets data from tables and diplay it. The query is:

using (SqlConnection conn = new SqlConnection(connString))
{
    string sqlQuery = "SELECT * FROM tblObiectiv t1 JOIN tblCladire t2 ON t1.OID = t2.OID JOIN tblLocatie t3 ON t2.CID = t3.CID ORDER BY t1.Obiectiv";
    using (SqlCommand cmd = new SqlCommand(sqlQuery, conn))
    {
        cmd.CommandType = CommandType.Text;
        SqlDataAdapter da = new SqlDataAdapter(cmd);
        conn.Open();
        DataSet ds = new DataSet();
        da.Fill(ds);
        DataList8.DataSource = ds.Tables[0];
        DataList8.DataBind();
        conn.Close();
    }
}

and display with

<asp:DataList ID="DataList8" runat="server" Style="width: 100%">
    <HeaderTemplate>
        <div class="row no-gutters ml-1 mr-1 justify-content-center">
            <div class="col-sm-2">
                <asp:Label class="form-control form-control-sm text-center"
                    Style="font-weight: 700; background-color: #1E90FF; color: #f4f1eb;"
                    Text="Obiectiv"
                    runat="server" />
            </div>
            <div class="col-sm-3">
                <asp:Label class="form-control form-control-sm text-center"
                    Style="font-weight: 700; background-color: #1E90FF; color: #f4f1eb;"
                    Text="Cladire"
                    runat="server" />
            </div>
            <div class="col-sm-3">
                <asp:Label class="form-control form-control-sm text-center"
                    Style="font-weight: 700; background-color: #1E90FF; color: #f4f1eb;"
                    Text="Locatie"
                    runat="server" />
            </div>
            <div class="col-sm-1">
                <asp:Label class="form-control form-control-sm text-center"
                    Style="font-weight: 700; background-color: #1E90FF; color: #f4f1eb;"
                    Text="Status"
                    runat="server" />
            </div>
            <div class="col-sm-1">
                <asp:Label class="form-control form-control-sm text-center"
                    Style="font-weight: 700; background-color: #1E90FF; color: #f4f1eb;"
                    Text="Revizie"
                    runat="server" />
            </div>
        </div>
    </HeaderTemplate>
    <ItemTemplate>
        <div class="row no-gutters ml-1 mr-1 justify-content-center">
            <div class="col-sm-2">
                <asp:TextBox ID="txtObiectiv" class="form-control form-control-sm bg-white" ReadOnly="true" runat="server" Text='<%#Eval("Obiectiv")%>' />
            </div>
            <div class="col-sm-3">
                <asp:TextBox ID="txtCladire" class="form-control form-control-sm bg-white" ReadOnly="true" runat="server" Text='<%#Eval("Cladire")%>' />
            </div>
            <div class="col-sm-3">
                <asp:TextBox ID="txtLocatie" class="form-control form-control-sm bg-white" ReadOnly="true" runat="server" Text='<%#Eval("Locatie")%>' />
            </div>
            <div class="col-sm-1">
                <asp:TextBox ID="txtStatus" class="form-control form-control-sm text-center bg-white" ReadOnly="true" runat="server" Text='<%#Eval("Status")%>' />
            </div>
            <div class="col-sm-1">
                <asp:TextBox ID="txtRevizie" class="form-control form-control-sm text-center bg-white" ReadOnly="true" runat="server" Text='<%#Eval("Revizie")%>' />
            </div>
        </div>
    </ItemTemplate>
</asp:DataList>

but the result is displayed like

 

and I want to be like