Dynamic HTML from Code Behind

Question

Hello, I have inherited some C#.NET code that builds a dynamic dashboard on page load. The dynamic dashboard consists of a table and 2 rows - one row showing online devices, the other row showing offline devices. My issue is that if there are more than 5 devices on a given row, the row gets cluttered and looks terrible. I would like to break the line at 4 devices, but I am so confused by the logic. I have spent the last 48 hours swirling through this code and trying to find where to break the line and how - I am still lost. Please, any help would be very much appreciated. Please see a snapshot of the code below. Thank you so much in advance. -Jason

protected void Page_Load(object sender, EventArgs e)
{
if (this.Session["UserID"] == null)
{
Response.Redirect("Login.aspx");
}
Response.AppendHeader("Refresh", "8");
HtmlMeta meta = new HtmlMeta();
meta.HttpEquiv = "Content-Language";
meta.Content = "en";
MetaPlaceHolder.Controls.Add(meta);
List OnCells = new List();
List OffCells = new List();
DataTable dt = DatabaseObjects.UserDO.GetAllBoardID(Int32.Parse(this.Session["UserID"].ToString()));
foreach (DataRow r in dt.Rows)
{
string inner = r["DeviceType"].ToString();
TableCell cell = new TableCell();
DataTable FonaDT = new DataTable();
DataTable dt2 = new DataTable();
DataTable fonaReturn = new DataTable();
DataTable normalReturn = new DataTable();
DateTime now = new DateTime();
if (DatabaseObjects.UserDO.IsFona(r["BoardID"].ToString()))
{
FonaDT = DatabaseObjects.UserDO.GetFonaSensors(r["BoardID"].ToString());
}
else
{
dt2 = DatabaseObjects.UserDO.GetSensorIDFromBoardID(r["BoardID"].ToString());
}
//cell.Text = "Device :" + inner + "";
//cell.BackColor = System.Drawing.Color.Gray;
//cell.ColumnSpan = 30;
if (FonaDT.Rows.Count > 0)
{
//sensorRow.Cells.Add(cell);
int count = 0;
foreach (DataRow r2 in FonaDT.Rows)
{
if (count > 0)
{
cell = new TableCell();
//cell.Text += r2["sensor_name"].ToString();
cell.HorizontalAlign = HorizontalAlign.Center;
fonaReturn = DatabaseObjects.UserDO.GetDashboardData(r["BoardID"].ToString(), r2["sensor_name"].ToString());
if (fonaReturn.Rows.Count > 0)
{
now = DateTime.Now;
DateTime LastData = DateTime.Parse(fonaReturn.Rows[0]["ts_Datetime"].ToString());
TimeSpan diff = now.Subtract(LastData);
if (diff.TotalSeconds <= 120)
{
//Its on
cell.Text += "" + "" + inner + "";
cell.Text += "
" + r2["sensor_name"].ToString();
cell.Text += "
" + "Last Value: " + fonaReturn.Rows[0]["value"].ToString() + "";
cell.Text += "

";

OnCells.Add(cell);

}

else

{

//its off

cell.Text += "" + "" + inner + "";

cell.Text += "
" + r2["sensor_name"].ToString();

cell.Text += "
Last Online: " + LastData.ToString("MM/dd/yyyy hh:mm tt");

cell.Text += "
" + "Last Value: " + fonaReturn.Rows[0]["value"].ToString() + "";

cell.Text += "

";

OffCells.Add(cell);

}

else

{

cell.Text += "" + "" + inner + "";

cell.Text += "
" + r2["sensor_name"].ToString();

cell.Text += "
Last Online: " + " N/A"+"
";

cell.Text += "
" + "Last Value: N/A" + "";

OffCells.Add(cell);

}

//cell.BorderStyle = BorderStyle.Solid;

//boardRow.Cells.Add(cell);

}

else

{

cell = new TableCell();

//cell.Text += r2["sensor_name"].ToString() + "
";

cell.HorizontalAlign = HorizontalAlign.Center;

fonaReturn = DatabaseObjects.UserDO.GetDashboardData(r["BoardID"].ToString(), r2["sensor_name"].ToString());

if (fonaReturn.Rows.Count > 0)

{

now = DateTime.Now;

DateTime LastData = DateTime.Parse(normalReturn.Rows[0]["ts_Datetime"].ToString());

TimeSpan diff = now.Subtract(LastData);

if (diff.TotalSeconds <= 120)

{

//Its on

cell.Text += "" + "" + inner + "";

cell.Text += "
" + r2["sensor_name"].ToString();

cell.Text += "
" + "Last Value: " + fonaReturn.Rows[0]["value"].ToString() + "";

cell.Text += "

Laxmidhar Sahoo · Answer

sir convert the total code into some functions .So you can understand better

Nilesh Shah · Answer

Hi,   your solutions should be in better UI design, not programatically   Show only first 4 rows in dashboard, if there are more than 4 rows then show some icon or button or link on which user has to click to see further records, when user clicks on that show rest of items or all items in a popup or another page.