I need a dynamic table in balzor basically it will have a serious of columns A-B B-C and within those columns will lie a series of numbers for example
This is the data from the locker table
ID
ItemID
IsRented
GroupId
1
10001
False
1
2
10002
True
1
3
10003
False
1
4
10004
True
1
5
20005
False
2
6
20006
True
2
7
20097
False
2
Locker Defination
public class Locker
{
public int Id { get; set; }
public int? LockerId { get; set; }
public int? GroupId { get; set; }
public string? RowId { get; set; }
public string? Name { get; set; }
public int? Size { get; set; }
public bool? IsRented { get; set; }
public string? Description { get; set; }
public int? BookingId { get; set; }
public int? Book { get; set; }
public bool? IsActive { get; set; }
public bool? IsDeleted { get; set; }
public bool? IsModified { get; set; }
public string? CreatedBy { get; set; }
public string? LastModifiedBy { get; set; }
public DateTime? LastModifiedDate { get; set; }
}
Where it would print a table with
This is table I want produced?.
ID
A - B
B - C
1
10001
20001
2
10002
20002
A - Z Along the top then the groups along the rows but the group id is how I no it should change to a differnt column ie 1000s should be in column a 2000s should be in column b.
What I have tried so far in blazor is
Html Markup
<table>
<thead>
<tr>
#foreach (var item in headings)
{
<th>item</th>
}
</tr>
</thead>
<tbody>
<tr>
#foreach(var item in Elements)
{
#if(item.IsRented==true)
{
<td style="color:red"> </td>
}else
{
<td style="color:green"> #item.LockerId</td>
}
}
</tr>
</tbody>
The above table gets it data from the web service below but as you see above would print out all the elments for each A ,B ,C D but I dont want that is there a way to use the group id effencitally here.
#code {
public List<Locker> Elements { get; set; }
private bool _readOnly;
string[] headings = { "A", "B", "C", "D", "E", "F" ,"G","H"};
private Func<Locker, string> _cellStyleFunc => x =>
{
string style = "";
if (x.IsRented == false)
style += "background-color:#00FF00";
else
style += "background-color:#FF0000";
return style;
};
protected override async Task OnInitializedAsync()
{
Elements = new List<Locker>();
string url = Constants.BaseUrl + Constants.GetAllLockers;
var response = await httpClient.GetAsync(url);
if (response.IsSuccessStatusCode)
{
var byteArray = await response.Content.ReadAsByteArrayAsync();
var content = Encoding.UTF8.GetString(byteArray, 0, byteArray.Length);
Elements = JsonConvert.DeserializeObject<List<Locker>>(content);
}
}
}
My Linq to get all the items.
public IEnumerable<Locker> GetAll()
{
return _context.Lockers.Where(w=> w.IsActive==true &&
w.IsDeleted == false).AsEnumerable();
}
Related
I want to display a name in the razor page by select it from a model and pass it through Viewbag in the controller.
Controller
public IActionResult sheet()
{
var tp1 = _db.Topic.Where(t => t.sheet_id == 1).ToList();
var tp1name = tp1.Select(t => t.topic1name);
ViewBag.tp1name = tp1name;
return View();
}
Model
public class Topic
{
[Key]
public int topic_id { get; set; }
[Required]
public int sheet_id { get; set; }
[Required]
public string topic1name { get; set; }
[Required]
public string topic2name { get; set; }
}
public class Transaction
{
[Key]
public int id { get; set; }
[Required]
public int sheet_id { get; set; }
[Required]
public string topic1score { get; set; }
}
View page
#model transaction
<table class="table">
<tr>
<td rowspan="2">1</td>
<td rowspan="2">#ViewBag.tp1name</td>
<td rowspan="2">30</td>
<td>Below average</td>
<td>Average</td>
<td>Above average</td>
</tr>
It returns
System.Linq.Enumerable+SelectListIterator`2[UserLoginApp.Models.Topic,System.String] in the view page instead of topic1name
tp1 is a list of topics.
so when you do a select it creates a new Enumerable en for each item in tp1 it selects the value of topic1name.
Thus creating an Enumerable+SelectListIterator
I think you want the value of one item:
var tp1 = _db.Topic.FirstOrDefault(t => t.sheet_id == 1)
if(tp1 != null)
ViewBag.tp1name = tp1.topic1name;
Goal: Returning a single object of sum and a list of details.
{ Sum: 1, [ { Amount: 2, Hex: '#123456' }, { Amount: 1, Hex: '#123456' } ] }
Using the below, I cannot achieve the goal:
var data = (await _context.Users
.Where(u => u.Id == userId)
.SelectMany(ue => ue.Expenses)
.Where(ue => ue.CreatedOn.Date <= insightsFilter.To.Value.Date
&& ue.CreatedOn.Date >= insightsFilter.From.Value.Date)
.Include(ue => ue.UserExpenses)
.Include(e => e.Category)
.ToListAsync());
var response = data.Select(e => new GetCategoriesDto {
Sum = e.UserExpenses.Sum(ue => ue.Amount),
Data = data.GroupBy(e => e.Category.Name.ToLower())
.Select(cl => new GetDetailsDto {
Hex = "#123456"
}).ToList()
});
The output is a single array as such:
{ Sum: 3, Data: [ { Sum: 2, Amount: 2, Hex: '#123456' }, { Sum: 1, Amount: 1, Hex: '#123456' } ] }
Where Sum is repeated instead of being on top of the JSON object with a value of 2 + 1 = 3.
Can someone please let me know what I am doing wrong... Thanks!
Data is as follows:
- Users
-- UserExpenses (Junction) - Contains Amount value.
-- Expenses - Contains Category value.
public class Expense
{
[Key]
public int Id { get; set; }
public Category Category { get; set; }
public int UserId { get; set; }
public User User { get; set; }
public List<UserExpenseJunction> UserExpenses { get; set; } = new List<UserExpenseJunction>();
}
public class UserExpenseJunction {
[Key]
public int Id { get; set; }
public int UserId { get; set; }
public User User { get; set; }
public int ExpenseId { get; set; }
public Expense Expense { get; set; }
public decimal Amount { get; set; }
public string Currency { get; set; }
}
public class User
{
public int Id { get; set; }
public string UserName { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public string Email { get; set; }
public byte[] PasswordHash { get; set; }
public byte[] PasswordSalt { get; set; }
public IList<Expense> Expenses { get; set; }
public IList<UserExpenseJunction> UserExpenses { get; set; }
public bool Verified { get; set; }
public DateTime CreatedOn { get; set; }
public DateTime UpdatedOn { get; set; }
}
You are doing a Select on your list so of course it will create a GetCategoriesDto for each item the list.
you need to do the sum as a separate item so I think something like this should work (I haven't tried it)
var response = new {
Sum = data.Select(e => e.UserExpenses.Sum(g => g.Amount)).Sum(),
data.Select(e => new GetCategoriesDto {
Data = data.GroupBy(e => e.Category.Name.ToLower())
.Select(cl => new GetDetailsDto {
Amount = cl.Amount.Sum(),
Hex = "#123456"
}).ToArray()
});
It's a little guess by me because you have some missing code in your question.
response is a List, because you created it as a List: var response = data.Select(...).ToList().
Create the reponse as:
var response = new GetCategoriesDto
{
//Sum = sum of amounts, ...
}
I am using .net core 2.2. When I run the following output is shown in the list of FacultyInterestItem with the Faculty or Keywords table data missing. Although the Faculties and Keywords classes are connected with the FacltyInterestItems
The following is the razor page
<tbody>
#foreach (var item in Model.FacultyInterestItems)
{
<tr>
<td> #Html.DisplayFor(modelItem => item.Id)
</td>
<td>
#Html.DisplayFor(modelItem => item.Faculty.FacultyId)
</td>
<td>
#Html.DisplayFor(modelItem => item.Keyword.Name)
</td>
<td>
<a asp-page="./Edit" asp-route-id="#item.Id">Edit</a> |
<a asp-page="./Details" asp-route-id="#item.Id">Details</a> |
<a asp-page="./Delete" asp-route-id="#item.Id">Delete</a>
</td>
</tr>
}
</tbody>
The cs file of the Razor page having OnGetAsync() method where it connects and take data from WebAPI.
public async Task OnGetAsync()
{
List<FacultyInterestItems> facultyInterestItem = new List<FacultyInterestItems>();
HttpClient client = _api.Initial();
HttpResponseMessage res = await client.GetAsync("api/FacultyInterestItems");
if (res.IsSuccessStatusCode)
{
var result = res.Content.ReadAsStringAsync().Result;
facultyInterestItem = JsonConvert.DeserializeObject<List<FacultyInterestItems>>(result);
}
List<Faculties> listOfFaculty = new List<Faculties>();
res = await client.GetAsync("api/Faculties");
if (res.IsSuccessStatusCode)
{
var result = res.Content.ReadAsStringAsync().Result;
listOfFaculty = JsonConvert.DeserializeObject<List<Faculties>>(result);
}
List<Keywords> listOfKeywords = new List<Keywords>();
res = await client.GetAsync("api/Keywords");
if (res.IsSuccessStatusCode)
{
var result = res.Content.ReadAsStringAsync().Result;
listOfKeywords = JsonConvert.DeserializeObject<List<Keywords>>(result);
}
FacultyInterestItems = facultyInterestItem;
Keywords = listOfKeywords;
Faculties = listOfFaculty;
}
The procedure OnGetAscyn() in razor page cs file, gets data from API. Here is the get method in the controller of API that connects to the DB and fetch data.
[HttpGet]
public async Task<ActionResult<IEnumerable<FacultyInterestItems>>> GetFacultyInterestItems()
{
return await _context.FacultyInterestItems.ToListAsync();
}
Here is the model:
The Faculties Table
public partial class Faculties
{
public Faculties()
{
FacultyInterestItems = new HashSet<FacultyInterestItems>();
SuggestedKeywords = new HashSet<SuggestedKeywords>();
}
public long Id { get; set; }
public string FacultyId { get; set; }
public DateTime? UpdateDate { get; set; }
public DateTime? InsertDate { get; set; }
public virtual ICollection<FacultyInterestItems> FacultyInterestItems { get; set; }
public virtual ICollection<SuggestedKeywords> SuggestedKeywords { get; set; }
}
The FacultyInterestItems tables:
public partial class FacultyInterestItems
{
public long Id { get; set; }
public long? FacultyId { get; set; }
public int? KeywordId { get; set; }
public DateTime InsertDate { get; set; }
public DateTime UpdateDate { get; set; }
public virtual Faculties Faculty { get; set; }
public virtual Keywords Keyword { get; set; }
}
the Keywords table:
public partial class Keywords
{
public Keywords()
{
FacultyInterestItems = new HashSet<FacultyInterestItems>();
}
public int Id { get; set; }
public string Name { get; set; }
public DateTime InsertDate { get; set; }
public DateTime UpdateDate { get; set; }
public int? DepartmentId { get; set; }
public virtual Departments Department { get; set; }
public virtual ICollection<FacultyInterestItems> FacultyInterestItems { get; set; }
}
Data of Faculty and Keyword is not fetched from the DB. Please let me know the solution
Try to call Include method
_context.FacultyInterestItems.Include(x => x.Faculty).Include(x => x.Keyword).ToListAsync()
As of right now, I have a table on my view that looks like so:
The purpose of this table is to show a count of how many occurrences happened at each location (on the left) during the current week.
I have 3 tables in my database that I am using to create this table.
Table One
public partial class code_WeighLocation
{
public code_WeighLocation()
{
tbl_WeighAssc = new HashSet<tbl_WeighAssc>();
}
public int ID { get; set; }
[Required]
[StringLength(50)]
public string Weigh_Location { get; set; }
public bool Active { get; set; }
public virtual ICollection<tbl_WeighAssc> tbl_WeighAssc { get; set; }
}
Table Two - Association Table
public partial class tbl_WeighAssc
{
public int Id { get; set; }
public int WeighLocationId { get; set; }
public int TEUId { get; set; }
public int OccurenceCount { get; set; }
public virtual code_WeighLocation code_WeighLocation { get; set; }
public virtual tbl_TEUForm tbl_TEUForm { get; set; }
}
Table Three
public partial class tbl_TEUForm
{
public tbl_TEUForm()
{
tbl_TEUArrestAssc = new HashSet<tbl_TEUArrestAssc>();
tbl_WeighAssc = new HashSet<tbl_WeighAssc>();
tblTEUInspectionAsscs = new HashSet<tblTEUInspectionAssc>();
}
public int Id { get; set; }
public string PersonnelIBM { get; set; }
[Column(TypeName = "date")]
public DateTime EventDate { get; set; }
public bool Active { get; set; }
public virtual ICollection<tbl_TEUArrestAssc> tbl_TEUArrestAssc { get; set; }
public virtual tblPersonnel tblPersonnel { get; set; }
public virtual ICollection<tbl_WeighAssc> tbl_WeighAssc { get; set; }
public virtual ICollection<tblTEUInspectionAssc> tblTEUInspectionAsscs { get; set; }
}
Now, my view is taking in a viewmodel:
ViewModel
public class PersonnelDetailsVm
{
private static ConnectionStringName db = new ConnectionStringName();
public PersonnelDetailsVm()
{
CurrentWeekDates = new List<DateTime>();
}
public string IBM { get; set; }
[Display(Name = "Name")]
public string UserName { get; set; }
[Display(Name = "TEU OT Rate")]
public string Teu_OT_Rate { get; set; }
[Display(Name = "MCSAP OT Rate")]
public string Mcsap_OT_Rate { get; set; }
[StringLength(10)]
public string Division { get; set; }
public bool Active { get; set; }
public List<DateTime> CurrentWeekDates { get; set; }
public List<tbl_WeighAssc> WeighAssociations { get; set; }
public List<code_WeighLocation> WeighLocations => db.code_WeighLocation.ToList();
}
In my view to create the table that I am showing above, my code looks like this:
<table class="table table-bordered table-hover mt-3">
<thead>
<tr>
<th></th>
#foreach (var date in Model.CurrentWeekDates)
{
<th>#date.ToString("ddd") <br /> #date.ToShortDateString()</th>
}
</tr>
</thead>
<tbody>
#foreach (var weighLocation in Model.WeighLocations)
{
<tr>
<td>#weighLocation.Weigh_Location</td>
</tr>
}
</tbody>
</table>
Now, in my database, in the association table I only have 2 records, and both records were entered on Friday, 9/7/2018. One record is for WIMS/SR-1 with an occurence count of 2. The other is for FIXED/Blackbird with an occurence count for 2. So, my goal is to show those counts under Fri 9/7/2018 in their respective rows/cells and every other cell be filled with a 0 because there aren't any other records in the association table for those locations during this current week.
Here is my controller code to show how I'm populating the days of the week and getting the correct records based off of those dates.
var startOfWeek = DateTime.Today.AddDays((int) CultureInfo.CurrentCulture.DateTimeFormat.FirstDayOfWeek -
(int) DateTime.Today.DayOfWeek);
person.CurrentWeekDates = Enumerable.Range(0, 7).Select(i => startOfWeek.AddDays(i)).ToList();
var teuFormIds = db.tbl_TEUForm
.Where(x => person.CurrentWeekDates.Contains(x.EventDate) && x.PersonnelIBM == person.IBM).Select(t => t.Id).ToList();
person.WeighAssociations = db.tbl_WeighAssc.Where(x => teuFormIds.Contains(x.TEUId)).ToList();
Any help is appreciated
I am not sure if I get this right, but I guess what you need is this,
for each time you are looping your locations, you should loop your dates again, and then do count or sum occurencecount (depending on your system design I didn't get it) and display it.
You don't need to worry about the cell order because you are looping the same days always so they will align first col is always the first day and so on.
also please double check the conditions I used, I am not sure if it is correct, but anyway this is the approach.
<!-- Loop through locations -->
#foreach (var weighLocation in Model.WeighLocations)
{
<tr>
<td>#weighLocation.Weigh_Location</td>
<!-- loop through current days week days for each location-->
#foreach(var currentDay in Model.CurrentWeekDates)
{
<!-- Here you count the rows or maybe sum the OccurenceCount I am not sure how you design it, I used count but you can use sum OccurenceCount -->
<td>
<!-- Compare the location id and the teuForm date -->
#Model.WeighAssociations.Where(e => e.WeighLocationId == weighLocation.Id && e.tbl_TEUForm.EventDate == currentDay).Count()
</td>
}
</tr>
}
I have figured this out.
In my view I edited the table tbody code to this:
<tbody>
#foreach (var weighLocation in Model.WeighLocations)
{
<tr>
<td>#weighLocation.Weigh_Location</td>
#foreach (var date in Model.CurrentWeekDates)
{
if (Model.WeighAssociations.Any(x => x.tbl_TEUForm.EventDate == date && x.WeighLocationId == weighLocation.ID))
{
<td>#Model.WeighAssociations.Single(x => x.tbl_TEUForm.EventDate == date && x.WeighLocationId == weighLocation.ID).OccurenceCount</td>
}
else
{
<td>0</td>
}
}
</tr>
}
</tbody>
I have a table with 4 rows (mobile, work, cell, email), and 5+ columns. When I POST I don't get back any data. Can I refactor the code to make it work?
Model:
public class ContactInfoViewModel {
public string HomePhone { get; set; }
public ICollection<bool> HomePhoneChecks { get; set; }
public string MobilePhone { get; set; }
public ICollection<bool> MobilePhoneChecks { get; set; }
public string WorkPhone { get; set; }
public ICollection<bool> WorkPhoneChecks { get; set; }
public string Email { get; set; }
public ICollection<bool> EmailChecks { get; set; }
public string Email2 { get; set; }
public IEnumerable<RowData> Rows { get; set; }
public IEnumerable<RowData> GetAllRows() {
return new List<RowData> {
new RowData { Name = "HomePhone", Label = "Home Phone", Heading = HomePhone, Columns = HomePhoneChecks},
new RowData { Name = "MobilePhone", Label = "Mobile Phone", Heading = MobilePhone, Columns = MobilePhoneChecks},
new RowData { Name = "WorkPhone", Label = "Work Phone", Heading = WorkPhone, Columns = WorkPhoneChecks},
new RowData { Name = "Email", Label = "Email", Heading = Email, Columns = EmailChecks},
};
}
public class RowData {
public string Name { get; set; }
public string Label { get; set; }
public string Heading { get; set; }
public ICollection<bool> Columns { get; set; }
}
View:
#foreach (var row in Model.ContactInfo.GetAllRows()) {
<tr>
<td class="boxRows noMargin">
<div>
<div class="boxLabel">#row.Label</div>
<div class="boxValue">#Html.TextBoxFor(m => row.Heading)</div>
</div>
</td>
#foreach (var item in row.Columns) {
<td>#Html.CheckBoxFor(m => item)</td>
}
</tr>
}
I would change your model collections to use List properties that are capable of model binding.
As an example:
public List<RowData> AllRows { get; set; }
Then change your loop to this which will be picked up by the model binder.
#for (int i = 0; i < Model.AllRows.Count; i++)
{
.....
#Html.EditorFor(model => Model.AllRows[i].Heading)
.....
}
They will then be posted back to the server.
For more info on it see here:
http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/