This is my view code.
#model IEnumerable<TestApplication.Models.ApplicationUser>
#{
Layout = null;
ViewBag.Title = //what goes here? Model.FirstName?
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
</head>
<body>
<p>
#Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>
<th>
#Html.DisplayNameFor(model => model.FirstName)
</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.FirstName)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
#Html.ActionLink("Details", "Details", new { id=item.Id }) |
#Html.ActionLink("Delete", "Delete", new { id=item.Id })
</td>
</tr>
}
</table>
</body>
</html>
I want to change the ViewBag's title to whatever the FirstName is in the model. I am expecting something like ViewBag.Title = Model.FirstName. However doing so, I got an error. So what's the syntax?
The issue is that your Model is of type IEnumerable<TestApplication.Models.ApplicationUser> so you cannot call a Property of the ApplicationUser
To demonstrate the problem, try this:
ViewBag.Title = Model.First().FirstName;
The error should disapear, but this is not the correct solution. You should consider which first name out of the list of users you want to display
Related
I have an MVC view that displays a list of items. The table that was automatically generated with the view has this action link on every row:
#Html.ActionLink("Delete", "Delete", new { id = item.section_detail_id }).
This works fine but my requirement is to allow the user to highlight a row and click on a delete button at the bottom of the list. I need a way for the button to know which row is currently highlighted. So I created this local variable:
#{int sectionDetailId = 0; }
Then I added an onclick event on the table rows to store the the id of the row that is clicked:
tr id="#item.section_detail_id" onclick="addClass(this.id); sectionDetailId = #item.section_detail_id">
Here is the button that is supposed to bring up the delete view:
input type="button" value="Delete Employee" onclick="location.href='#Url.Action("Delete", "EmployeeList", new { id = sectionDetailId })'; alert(sectionDetailId)" />
The value that is passed to the view is always zero no matter what row is clicked. I added the alert function to the button to show that the variable has the correct value.
Is there a way to get the Action method to use the variable or to get the value from the table in some other way? The Action method works correctly if I hard code an ID.
Here is the complete view:
#model IEnumerable<VCPDS2.Models.EmployeeListViewModel>
#{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<style>
tr.highlight {
background-color: blue !important;
}
</style>
#{int sectionDetailId = 0; }
<h2>Index</h2>
#*<p>
#Html.ActionLink("Create New", "Create")
</p>*#
#if (Model != null)
{
<table id="employeeTable" class="table table-responsive table-striped">
<tr>
<th>
Last Name
</th>
<th>
First Name
</th>
<th>
Employee ID
</th>
<th>
Phone
</th>
<th>
Budget Unit
</th>
<th>
Division
</th>
</tr>
<tbody id="employeeList">
#foreach (var item in Model)
{
<tr id="#item.section_detail_id" onclick="addClass(this.id); sectionDetailId = #item.section_detail_id">
<td>
#Html.DisplayFor(modelItem => item.last_name)
</td>
<td>
#Html.DisplayFor(modelItem => item.first_name)
</td>
<td>
#Html.DisplayFor(modelItem => item.employee_id)
</td>
<td>
#item.phone_nbr
#* #Html.DisplayFor(modelItem => item.phone.area_code) #Html.DisplayFor(modelItem => item.phone.phone_nbr)*#
</td>
<td>
#item.BU
#*#Html.DisplayFor(modelItem => item.phone.BU)*#
</td>
<td>
#item.description
#*#Html.DisplayFor(modelItem => item.department.description)*#
</td>
<td>
#*#Html.ActionLink("Edit", "Edit", new { id = item.section_detail_id }) |
#Html.ActionLink("Details", "Details", new { id = item.section_detail_id }) |*#
#Html.ActionLink("Delete", "Delete", new { id = item.section_detail_id })
</td>
</tr>
}
</tbody>
</table>
<p>
#*#Html.ActionLink("Create New", "Create")*#
<input type="button" value="Add Employee"
onclick="location.href='#Url.Action("Create", "EmployeeList")'" />
<input type="button" value="Delete Employee"
onclick="location.href='#Url.Action("Delete", "EmployeeList", new { id =
#sectionDetailId })'; alert(sectionDetailId)" />
</p>
}
<script src="jquery-3.4.1.min.js"></script>
<script>
function addClass(row) {
//alert(row);
$('#employeeList').children().removeClass('highlight');
var element = document.getElementById(row);
element.classList.add("highlight");
}
</script>
#*#Html.ActionLink("Edit", "Edit", new { id = item.section_detail_id }) |
#Html.ActionLink("Details", "Details", new { id = item.section_detail_id }) |
#Html.ActionLink("Delete", "Delete", new { id = item.section_detail_id
})*#
This is the rendered HTML for the delete button:
<input type="button" value="Delete Employee" onclick="location.href='/EmployeeList/Delete/0'; alert(sectionDetailId)">
I want to replace those three fields Edit/Details/Delete with icons I just downloaded. The icons are with size 512x512, will this be a problem? Can I resize them in the code (how), or I should resize them using some program.
I've been searching through the net and I found some very long pieces of C# code but I have no idea where to put it in order to replace the text of those properties with the icons.
Here is my HTML:
#using PagedList.Mvc;
#model PagedList.IPagedList<Rating_System.Models.tblTeacher>
<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
#{
ViewBag.Title = "Teachers List";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Teachers</h2>
<p>
#Html.ActionLink("Add new", "Create")
</p>
#using (Html.BeginForm("Index", "Teachers", FormMethod.Get))
{
<p>
Търсене: #Html.TextBox("SearchString", ViewBag.CurrentFilter as string)
<input type="submit" value="Search" />
</p>
}
<table class="table">
<tr>
<th>
</th>
<th>
#Html.DisplayNameFor(model => model.First().FirstName)
</th>
<th>
#Html.DisplayNameFor(model => model.First().SecondName)
</th>
<th>
#Html.DisplayNameFor(model => model.First().Title)
</th>
<th></th>
</tr>
#foreach (var item in Model)
{
<tr>
<td>
<img src="#Url.Action("GetImage", "Teachers", new {item.ID})" width="45" height="45" />
</td>
<td>
#Html.DisplayFor(modelItem => item.FirstName)
</td>
<td>
#Html.DisplayFor(modelItem => item.SecondName)
</td>
<td>
#Html.DisplayFor(modelItem => item.Title)
</td>
<td>
#Html.ActionLink("Редактирай", "Edit", new { id = item.ID }) |
#Html.ActionLink("Детайли", "Details", new { id = item.ID }) |
#Html.ActionLink("Изтрий", "Delete", new { id = item.ID })
</td>
</tr>
}
</table>
#Html.PagedListPager(Model, page => Url.Action("Index", new { page, pageSize = Model.PageSize }))
Results #Model.FirstItemOnPage - #Model.LastItemOnPage от общо #Model.TotalItemCount Teachers
try with this code
<a href="#Url.Action("ActionName", "ControllerName", new { id = item.ID })">
<img src="#Url.Content("~/Content/imgname.jpg")" />
</a>
If you want to use an icon (Image) use the following code:
#Html.ActionLink("Редактирай", "Edit", new { id = item.ID }, new { #class="class" })
Then write you css class to include a background image
a.class
{
background: url(../Images/image.gif) no-repeat top left;
width: 50px;
height: 50px;
display: block;
text-indent: -9999px; /* hides the link text */
}
However, I would suggest using bootstrap glyphicons for example
<a href="#Url.Action("Action", "Controller")" class="btn btn-info">
Your link text
<span class="glyphicon glyphicon-time" aria-hidden="true"></span>
</a>
Or
<span class="glyphicon glyphicon-ok" style="cursor:pointer" onclick="JavascriptFunction()"></span>
And in Javascript
function JavascriptFunction() {
window.location.href = encodeURI("/Controller/Action/");
}
You can pass the ID through the javascript function
I am using .Net MVC5 and I am trying to create an Index view with an Edit Link(or button) that will POST(so I can't use ActionLink) an entire Model item Entity from the list of entities presented in the View. How do I do it?
my code(so far) is below
#model IEnumerable<Projname.Models.MyEntity>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<p>
#Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>
<th>
#Html.DisplayNameFor(model => model.Name)
</th>
<th>Hello there</th>
<th>life is good</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
#using (Html.BeginForm("Edit", "Edit", FormMethod.Post))
{
#Html.Hidden(mytem => item);
<input type="submit" value="Edit" class="btn btn-default" />
}
</td>
<td>
#Html.ActionLink("Details", "Details", new { id = item.PrimeKey }) |
#Html.ActionLink("Delete", "Delete", new { id = item.PrimeKey })
</td>
</tr>
}
</table>
</body>
</html>
I am assuming that there is a better way to do it instead of creating a hidden field for each of the properties of the entity.
You need to put the items you want to edit or change into a form
<form class="form-horizontal" action="GetItemsFromView" method="post">
<input type="text" name="EditedModelItem">
</form>
Afterwards you can call any edited item in your controller, through
string hold = Request.Form["EditedModelItem"];
in the GetItemsFromView method.
Wrap everything in:
#using (Html.BeginForm("Edit", "Edit", FormMethod.Post))
{
}
Then:
public ActionResult Edit(Model model)
{
if (ModelState.IsValid)
{
}
}
Or:
public ActionResult Edit(FormCollection formCollection)
{
}
I am at my first MVC project. I want to create a page with a header and in this header to be placed a partial view with category list.
This is what I did so far:
I created the master page (_Home.cshtml). Than in Shared folder I created a View (Category.cshtml). See my picture.
My Category.cshtml content:
#model IEnumerable<ArtSchool.Models.Category>
<p>
#Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
#Html.DisplayNameFor(model => model.Name)
</th>
<th>
#Html.DisplayNameFor(model => model.Visible)
</th>
<th></th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
#Html.DisplayFor(modelItem => item.Visible)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
#Html.ActionLink("Details", "Details", new { id=item.ID }) |
#Html.ActionLink("Delete", "Delete", new { id=item.ID })
</td>
</tr>
}
My master page file:
#{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>_Home</title>
</head>
<body>
<div>
#Html.Partial("ASCX/Header")
#Html.Partial("Category")
#RenderBody()
</div>
When I run the project I got the error:
I know that is a newbie question but it's my first MVC project.
Thanks!
Solution 1
If you want to use partial view you need to pass model to this helper this way
#Html.Partial("Category", CategoryModel)
before you pass this model you have to fill it with some data.
Solution 2
also you can use #Html.Action() Method with name of ActionResult method which will return partial view for you.
for example:
#Html.Action("GetCategories", "ControllerName")
public ActionResult GetCategories() {
// fill some data for your model here
return PartialView("Category", model);
}
If you want to interpret those partials as some static sections inside your HTML, then I would suggest you to call Html.Action() which returns your partials:
#Html.Action("GetPageHeader","Home")
#Html.Action("GetPageCategories","Home")
HomeController
[HttpGet]
public ActionResult GetPageHeader()
{
return PartialView(#"~/Views/Shared/_PageHeader.cshtml");
}
[HttpGet]
public ActionResult GetPageCategories()
{
var categories = databaseContext.GetAllCategories(); //Get your categs
return PartialView(#"~/Views/Shared/_Categories.cshtml",categories);
}
public ActionResult Index(int? page)
{
var model = db.Posts.ToList();
int pageNumber = page ?? 1;
int pageSize = 10;
return View(model.ToPagedList(pageNumber, pageSize));}
in the "index" I have a box with tags, it takes the name of the tag and goes into the "Tag"
(#foreach (Webtion8.Models.Tag tag in item.Tags){
<span>#tag.Name</span>}):
#model PagedList.IPagedList<Webtion8.Models.Post>
#using PagedList.Mvc
#{
ViewBag.Title = "Index";
}
<link href="#Url.Content("/Content/PagedList.css")" rel="stylesheet" type="text/css" />
<h2>Index</h2>
<p>
#Html.ActionLink("Create New", "Create")
</p>
<table class="table">
#foreach (var item in Model)
{<tr>
<td>
post: #Html.DisplayFor(modelItem => item.Title)
</td>
<td>
date: #Html.DisplayFor(modelItem => item.DateTime)
</td>
<td>
avtor: #Html.DisplayFor(modelItem => item.Avtor)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
#Html.ActionLink("Details", "Details", new { id=item.Id }) |
#Html.ActionLink("Delete", "Delete", new { id=item.Id })
</td>
</tr>
<tr><td colspan="4"> tegs:
#foreach (Webtion8.Models.Tag tag in item.Tags)
{
<span>#tag.Name</span>
}
</td></tr>
<tr></tr>
<tr>
<td colspan="4">
#Html.DisplayFor(modelItem => item.Body)</td>
</tr>
<tr><td colspan="4"></td></tr>
}</table>
<div style="text-align: center;">
#Html.PagedListPager(Model, page => Url.Action("Index", new { page }),
new PagedListRenderOptions {
LinkToFirstPageFormat = "<<",
LinkToPreviousPageFormat = "<",
LinkToNextPageFormat = ">",
LinkToLastPageFormat = ">>" })
</div>
they go to here
public ActionResult Tags(string id)
{ Tag tag = GetTag(id);
return View("Index", tag.Posts);}
and here start the problem I can not solve. In theory this code should return the page index with a sample blog entries by tag on which we clicked. But the program gives an error
The model item passed into the dictionary is of type 'System.Collections.Generic.HashSet`1[Webtion8.Models.Post]', but this dictionary requires a model item of type 'PagedList.IPagedList`1[Webtion8.Models.Post]'.
and
System.InvalidOperationException: The model item passed into the dictionary is of type 'System.Collections.Generic.HashSet`1[Webtion8.Models.Post]', but this dictionary requires a model item of type 'PagedList.IPagedList`1[Webtion8.Models.Post]'.`
Please explain to me where I'm wrong, because the other pages I have not found an answer.
It is connected with the fact that your view is strongly typed to IPagedList<Post>
#model PagedList.IPagedList<Webtion8.Models.Post>
whereas you try to pass a HashSet of Posts as a result of your Tags action.
So instead of this:
public ActionResult Tags(string id)
{
Tag tag = GetTag(id);
return View("Index", tag.Posts);
}
You should do this:
public ActionResult Tags(string id)
{
Tag tag = GetTag(id);
//TODO define pageNumber and pageSize or pass them as parameters to your action method
return View("Index",tag.Posts.ToPagedList(pageNumber, pageSize));
}