Reply To: Set the width and height of a grid

[AlexZaw]

<div class=”border border-primary rounded p-2 my-auto bg-light”>
<Grid id=”grid” @ref=”grid” DataSource=”@listGridData” ColumnGroups=”_colGroups” Columns=”@_columns” Paging=”@paging” Pager=”@pager”></Grid>
</div>

<style>
#grid {
width: 1200px;
height: 600px;
}
</style>

 

@code {

// This for a form where the user select a profil and time range

List<DefoPointsProfil> listProfils = new List<DefoPointsProfil>();
List<SelectListItem> listTimes = new List<SelectListItem>();

ETimeRange selTimeRange = ETimeRange.none;
int selProfil = -1;

DefoPointsProfil? profil = null;

// Here the data from the database is stored
List<TimedMeasureData>? listMeasureData = new List<TimedMeasureData>();

// For the grid I copy the data from database in a List of class GridRowData
List<GridRowData> listGridData = new List<GridRowData>();

Grid? grid;
GridDataSourceSettings _dataSourceSettings = new GridDataSourceSettings();
List<GridColumn> _columns = new List<GridColumn>();
List<GridColumnGroup> _colGroups = new List<GridColumnGroup>();
GridPaging paging = new GridPaging()
{
Enabled = true,
PageSize = 100,
PageIndex = 0
};
GridPager pager = new GridPager() { Visible = true };

protected override void OnInitialized()
{
base.OnInitialized();
listProfils = profilService.GetAllProfils();
listTimes = profilService.TimeRangesList();
}

private void OnSelectProfil(ChangeEventArgs e)
{
selProfil = Convert.ToInt32(e.Value);
}

private void OnSelectTime(ChangeEventArgs e)
{
selTimeRange = (ETimeRange)Enum.Parse(typeof(ETimeRange), e.Value.ToString());
}

private void Display() // Is a event of a Buttom
{

if (selTimeRange == ETimeRange.none || selProfil == -1)
return; // No profil or time range selected

profil = profilService.GetProfil(selProfil);
if(profil != null)
{

List<string> listIdEx = new List<string>();

// Read data from Database
if(profilService.GetData(profil, selTimeRange, ref listMeasureData, ref listIdEx))
{
BuildGrid(profil, listMeasureData, listIdEx);
}

}
}

private void BuildGrid(DefoPointsProfil profil, List<TimedMeasureData>? data, List<string> listIdEx)
{
_colGroups = new List<GridColumnGroup>();
_columns = new List<GridColumn>();

for(int i = 0; i < listIdEx.Count; i++)
{
GridColumnGroup grp = new GridColumnGroup()
{
Label = listIdEx[i],
Name = listIdEx[i],
Align = HorizontalAlignment.Center,
VerticalAlign = VerticalAlignment.Center
};

_colGroups.Add(grp);
}

List<IGridDataSourceSettingsDataField> listDataFields = new List<IGridDataSourceSettingsDataField>();
listDataFields.Add
(
new GridDataSourceSettingsDataField()
{
Name = “Time”,
DataType = GridDataSourceSettingsDataFieldDataType.Date
}
);

// First Column with Time of Measurement
GridColumn col = new GridColumn()
{
Label = “Zeit”,
DataType = “date”,
CellsFormat = “yyyy.MM.dd HH:mm”,
DataField = “Time”,
MinWidth = 150,
Align = HorizontalAlignment.Center
};
_columns.Add(col);

// All Measurements Values from all Points
for(int i = 0; i < listIdEx.Count; i++) // Points
{
for(int j = 0; j < profil.ListDiffValues.Count; j++) // All measured diff. Values of a Point
{
col = new GridColumn()
{
Label = DataHelper._DiffValueTitles[(int)profil.ListDiffValues[j]],
Align = HorizontalAlignment.Center,
DataType = “number”,
CellsFormat = “i”,
DataField = “Pt” + (i + 1).ToString() + “_” + profil.ListDiffValues[j].ToString(), // for example pt1_dX
MinWidth = 100,
ColumnGroup = _colGroups[i].Name
};

_columns.Add(col);

}
}

// Transfer data to List of GridRowData

listGridData = new List<GridRowData>();

foreach(TimedMeasureData mData in listMeasureData)
{
GridRowData rowData = new GridRowData();
rowData.Time = mData.From;

Type classType = typeof(GridRowData);
for(int i = 0; i < listIdEx.Count; i++)
{
for(int j = 0; j < profil.ListDiffValues.Count; j++)
{
string prop = “Pt” + (i + 1).ToString() + “_” + profil.ListDiffValues[j].ToString();
var property = classType.GetProperty(prop);
double d = mData.MeasureData[i, j];
property.SetValue(rowData, (int)d);
}
}

listGridData.Add(rowData);
}

paging = new GridPaging()
{
Enabled = true,
PageSize = 100,
PageIndex = 0
};
grid.BeginUpdate();
grid.ColumnGroups = _colGroups;
grid.Columns = _columns;
grid.Paging = paging;
grid.EndUpdate();

}

}

 

 

// Here a Part of my class GridRowData

public class GridRowData
{
public DateTime Time { get; set; }

public double Pt1_rvector { get; set; } = 0;
public double Pt1_vector { get; set; } = 0;
public double Pt1_dY { get; set; }
public double Pt1_dX { get; set; }
public double Pt1_dZ { get; set; }
public double Pt1_dStation { get; set; } = 0;
public double Pt1_dQuer { get; set; } = 0;
public double Pt1_dHoch { get; set; } = 0;

public double Pt2_rvector { get; set; } = 0;
public double Pt2_vector { get; set; } = 0;
public double Pt2_dY { get; set; } = 0;
public double Pt2_dX { get; set; } = 0;
public double Pt2_dZ { get; set; } = 0;
public double Pt2_dStation { get; set; } = 0;
public double Pt2_dQuer { get; set; } = 0;
public double Pt2_dHoch { get; set; } = 0;

…

…

public double Pt10_rvector { get; set; } = 0;
public double Pt10_vector { get; set; } = 0;
public double Pt10_dY { get; set; } = 0;
public double Pt10_dX { get; set; } = 0;
public double Pt10_dZ { get; set; } = 0;
public double Pt10_dStation { get; set; } = 0;
public double Pt10_dQuer { get; set; } = 0;
public double Pt10_dHoch { get; set; } = 0;

public GridRowData()
{
Time = DateTime.Now;
}

public GridRowData(double x, double y, double z)
{
Time = DateTime.Now;
Pt1_dX = x;
Pt1_dY = y;
Pt1_dZ = z;
}

}