<div class="col-md-5">
<div class="card border-0 shadow">
<div class="card-body ">
<table class="table table-bordered">
<thead class="thead-light">
<tr>
<th style="text-align:center;">
#Html.DisplayNameFor(model => model.Barangay)
</th>
<th style="text-align:center;">
#Html.DisplayNameFor(model => model.Confirmed)
</th>
<th style="text-align:center;">
#Html.DisplayNameFor(model => model.PUI)
</th>
<th style="text-align:center;">
#Html.DisplayNameFor(model => model.PUM)
</th>
<th></th>
</tr>
</thead>
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.Barangay)
</td>
<td style="text-align:center;">
#Html.DisplayFor(modelItem => item.Confirmed)
</td>
<td style="text-align:center;">
#Html.DisplayFor(modelItem => item.PUI)
</td>
<td style="text-align:center;">
#Html.DisplayFor(modelItem => item.PUM)
</td>
</tr>
}
</table>
</div>
</div>
</div>
</div>
I can't remove it although I tried using different styles of table.
Sorry for this dumb question for I am new to web development and ASP.Net MVC.
Please see image below for reference.
Thanks in advance for any help.
https://i.stack.imgur.com/LosFA.png
This is because you have an extra th tag in your code:
<th style="text-align:center;">
Html.DisplayNameFor(model => model.PUM)
</th>
<th></th> <!------------------delete this->
if your table have 5 head table columns and your table body have 4, the body expect 1 column and keeps the space
Related
I want to align the webpage content at the start of the screen.I have tried many solutions but nothing work.
the below image will help in understanding my issue.
the index.cshtml view is below:
<div style="height: 100%">
<table class="table align-content-lg-start">
<thead>
<tr>
<th class="col-1">
#Html.SortableHeaderFor(model => model.DBId)
</th>
<th class="col-1">
#Html.SortableHeaderFor(model => model.Name)
</th>
<th class="col-1">
#Html.SortableHeaderFor(model => model.NID)
</th>
<th class="col-1">
#Html.SortableHeaderFor(model => model.Address)
</th>
<th class="col-5">
#Html.SortableHeaderFor(model => model.Mobile)
</th>
</thead>
<tbody>
<td class="col-1">
#Html.DisplayFor(modelItem => item.DBId)
</td>
<th class="col-1">
#Html.DisplayFor(model => model.Name)
</th>
<td class="col-1">
#Html.DisplayFor(modelItem => item.NID)
</td>
<td class="col-1">
#Html.DisplayFor(modelItem => item.Address)
</td>
<td class="col-5">
#Html.DisplayFor(modelItem => item.Mobile)
</td>
</tbody>
</table>
</div>
I'm assuming you're using bootstrap. what you need to do is to find the class= "container". and change it to "container-fluid"
I have those 2 columns and I want to put the row where's the travel consultant = Username1 with green color on the letters and username2 with red color on the letters.
How can I do this ?
<table class="table table-striped table-hover table-bordered tablesModel">
<thead>
<tr>
<th data-field="#Html.DisplayNameFor(model => model.Travel_Consultant)" data-sortable="true">
#Html.DisplayNameFor(model => model.Travel_Consultant)
</th>
#*scope1, scope2*#
<th data-field="#Html.DisplayNameFor(model => model.Description)">
#Html.DisplayNameFor(model => model.Description)
</th>
</tr>
</thead>
<tbody>
#foreach (var item in Model)
{
<tr>
<td data-field="#Html.DisplayNameFor(model => model.Travel_Consultant)" data-sortable="true">
#Html.DisplayFor(modelItem => item.Travel_Consultant)
</td>
<td data-field="#Html.DisplayNameFor(model => model.Description)">
#Html.DisplayFor(modelItem => item.Description)
</td>
<td style="text-align:center;">
<button onclick="createOrEdit(#item.ExtraJobsID)" type="button" class="btn-xs buttongreenpt">
<i class="fa fa-edit fa-20px"></i>
</button>
</td>
</tr>
}
</tbody>
</table>
If you want to apply code inside your view, try something like this inside your #foreach:
<tr>
#if (model.Travel_Consultant == "Username1")
{
<td data-field="#Html.DisplayNameFor(model => model.Travel_Consultant)"
data-sortable="true" style="color: red">
#Html.DisplayFor(modelItem => item.Travel_Consultant, new { #style =
"color:green;" })
</td>
}
else if(model.Travel_Consultant == "username2")
{
<td data-field="#Html.DisplayNameFor(model => model.Description)">
#Html.DisplayFor(modelItem => item.Description, new { #style =
"color:red;" })
</td>
}
<td style="text-align:center;">
<button onclick="createOrEdit(#item.ExtraJobsID)" type="button" class="btn-xs buttongreenpt">
<i class="fa fa-edit fa-20px"></i>
</button>
</td>
</tr>
In foreach loop
if(consultant = Username1)
assign class Green to that row
.Green{color: green;}
else if(consultant = Username1)
assign class Red to that row
.Red{color: red;}
Hope this will solve your problem.
I have 1000 records and I am able to fetch them from database like in one second. But they are taking like 9s for rendering. It is maybe because of data tables or I am looping through each record to display. If I disable the data tables performance is better but still not good. Following is my code, could you give your suggestions. I am pretty sure it is slow because of rendering and scripting.
<div class="table-responsive">
<table class="display" id="list" cellspacing="0">
<thead>
<tr>
<th>
#Content.Code
</th>
<th> #Content.Name </th>
<th>
#Content.Location
</th>
<th>
#Content.Date
</th>
<th> #Content.Remaining </th>
<th>
#Content.Status
</th>
<th>
</th>
</tr>
</thead>
<tbody>
#foreach (var item in Model)
{
<tr>
<td>
#item.Code
</td>
<td>
#item.Name
</td>
<td>
#item.Location
</td>
<td>
#item.Date
</td>
<td>
#item.ReDays
</td>
<td>
#item.Status
</td>
<td width="15%">
<i class="fa fa-pencil" aria-hidden="true"></i>
#if (User.IsInRole("Admin") || ViewBag.HavePermission == true)
{
<i class="fa fa-trash" aria-hidden="true"></i>
}
</td>
</tr>
}
</tbody>
</table>
</div>
I don't want to use server-side processing because I don't know how to control this HavePermisson and UserRole part. Please, give a suggestion?
I'm new in MVC5 and i don't know much about dealing with view controls . I create an MVC project , but I need to get the data of checked Rows when submit in the controller , Please can anyone help me ??
this is my view code for the table
<table class="table" id="Table_Session">
<tr>
<th>
<label> </label>
</th>
<th>
<label>User Id</label>
</th>
<th>
<label>IP Address</label>
</th>
<th>
<label>Licence Type</label>
</th>
<th>
<label>Login Date</label>
</th>
<th>
<label>Login Time</label>
</th>
<th></th>
</tr>
#For Each item In Model
#<tr>
<td>
#If Not IsNothing(item) Then
#Html.Hidden("SessionID", item.SessionID)
#<input type="checkbox" id="chboxRow" value="item.SessionID" onclick="">
End If
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.sUserId)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.IpAddress)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.licencetype)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.LoginDate)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.Logintime)
</td>
</tr>
Next
</table>
<div>
#Using Html.BeginForm("KillSession", "KillSession", FormMethod.Post)
#<input type="submit"
class="btn btn-default btn-xs"
value="Kill Session" />
End Using
#Using Html.BeginForm("s_Continue", "KillSession")
#<input type="submit"
class="btn btn-default btn-xs"
value="s_Continue" />
End Using
</div>
So you need to wrap all of the checkboxes in the form or the data will not be included when you post the form. Try this as a stating place.
#Using Html.BeginForm("KillSession", "KillSession", FormMethod.Post)
<table class="table" id="Table_Session">
<tr>
<th>
<label> </label>
</th>
<th>
<label>User Id</label>
</th>
<th>
<label>IP Address</label>
</th>
<th>
<label>Licence Type</label>
</th>
<th>
<label>Login Date</label>
</th>
<th>
<label>Login Time</label>
</th>
<th></th>
</tr>
#For Each item In Model
#<tr>
<td>
#If Not IsNothing(item) Then
#Html.Hidden("SessionID", item.SessionID)
#<input type="checkbox" id="chboxRow" value="item.SessionID" onclick="">
End If
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.sUserId)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.IpAddress)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.licencetype)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.LoginDate)
</td>
<td>
#Html.DisplayFor(Function(modelItem) item.Logintime)
</td>
</tr>
Next
</table>
#<input type="submit" class="btn btn-default btn-xs" value="Kill Session" />
End Using
Then maybe read this and do some Googling, the answers to this are out there, over and over and over again!
I am new at MVC asp .net.
I have a grid in which I am adding rows.
Now I want to perform mulitple rows insertion in a table at once.
How can I do that. SO multiple rows will be added in MVC.
Any help would be appericiated.
You want to learn how to ModelBind to a Collection. There are many answers here already for this technique.
https://stackoverflow.com/search?q=model+binding+to+a+collection
http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx
Do you mean something like this?.
<table class="table" style="vertical-align: middle;">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model.title)
</th>
<th style="text-align: center;">
#Html.DisplayNameFor(model => model.imgAr)
</th>
<th>
#Html.DisplayNameFor(model => model.created)
</th>
<th></th>
</tr>
</thead>
<tbody id="tblOfContent">
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.title)
</td>
<td style="text-align: center;">
<img src="~/newsImages/#item.imgAr" class="img-thumbnail" />
</td>
<td>
#item.created.ToShortDateString()
</td>
<td>
#Html.ActionLink("Details", "Edit", new { id = item.id }) |
#Html.ActionLink("Details", "Details", new { id = item.id })
</td>
</tr>
}
</tbody>
</table>
and in the Controller something like this:
public ActionResult Index()
{
return View(newsService.GetAll().OrderByDescending(x => x.created));
}