I am dynamically generating a table to present some tabular data. Normally I would not go near tables, but for this kind of data it is appropriate.
I am noticing my view code is becoming very spaghetti like. Assigning classes on cells and rows in the body of loops is starting to look just awful (bad flashbacks to my asp 3.0 days).
I looked into using the runtime serialization to json for my DTOs and then using a JQuery plugin for templated rendering of JSON. It seems like a "cool" idea, but is more of a programming exercise than I care to do at the moment.
How are people building more involved UIs with asp.net mvc?
If you're concerned about how your view markup mixed with code looks, you can try an alternate view engine:
Spark
NVelocity
Brail
NHaml
All of these view engines take different approaches to combining code and markup that can make your view markup "cleaner".
I've written some HtmlHelper extensions to help with table building. These extensions use a TagBuilder in code to generate the rows according to the values and HTMl attributes defined. The view code is considerably cleaner using these extension methods and the extension methods themselves are testable to ensure that they produce clean code reliably.
Sample view code:
<% var alternating = false;
foreach (var model in Model) { %>
<% using (Html.BeginTableRow( new { #class = alternating ? "alternating-row" : "" } )) { %>
<%= Html.TableElement( model.Column1 ) %>
<%= Html.TableElement( model.Column2, new { #class = 'some-class' } ); %>
<%= Html.TableElement( model.Column3 ) %>
<% }
alternating = !alternating;
%>
<% } %>
In addition, I've actually create a grid control that will generate a styled table using the above and most of my view code consists of rendering the grid control with the proper model.
<% Html.RenderPartial( "GridControl", Model, ViewData ); %>
Related
i have written the following code in my view and i have to print value of variables of my forloop variables company in my view how can i do this
<table><tr>
<td>
<%
var ResDet1 = (from r in db.Res_Exp
where r.Resume.ResumeID == 191
select new{r.ResExpID,r.Company}).ToList();
string company;
int exprinceid;
if (ResDet1 != null)
{
foreach (var rc in ResDet1)
{
exprinceid = rc.ResExpID;
company = rc.Company;
}
}
%>
</td></tr></table>
i believe following code
var ResDet1 = (from r in db.Res_Exp
where r.Resume.ResumeID == 191
select new{r.ResExpID,r.Company}).ToList();
belongs to repository and
string company;
int exprinceid;
should be included in your model. Only foreach should appear in the view. In your controller you should call method of your repository and wrap everything in a view model and pass it to the view. In view you should only iterate and render values (either in display mode or in edit mode). Look at this question for how to implement repository pattern in asp.net mvc
Answer - as requested.
Why use a loop? Make use of MVC's templating.
Create a display template called MyModel, where MyModel is whatever type ResDet1 is:
Shared\DisplayTemplates\MyModel.cshtml
<tr>
<td><% Html.DisplayFor(model => model.ResExpID) %></td>
<td><% Html.DisplayFor(model => model.Company) %></td>
</tr>
Then your main View simply becomes this:
<table>
<% Html.DisplayForModel() %>
</table>
How does that work? Well, your View should be strongly-typed to an IEnumerable<ResDet>, which as #Muhammad mention's, should be fetched via a Repository.
Your action should be something like this:
[HttpGet]
public ActionResult Index()
{
var results = _repository.ResDets();
return View(results);
}
Ideally, you should be using the Repository pattern to talk to the model, use AutoMapper to flatten the model into a ViewModel, and use interface-driven Dependency Injection to handle the dependencies (e.g _repository).
But if that's too much for you, at the very least, put the data access code in the action method, never, i repeat, never in the View.
Now isn't that nicer?
Controller has 2 lines of code - one to retrieve the model, another to call the View. Textbook stuff.
View is dumb. It renders out what it needs to, and is focused on presentation only.
The foreach loop is avoided, as MVC will do an implicit foreach loop, since it sees the model is of IEnumerable<Something>, so it looks for a template matching that Something, and finds your custom template.
Try not to forget the principles of MVC. If your mixing code and markup in your View, you've already lost and may as well be coding in classic ASP.
Usually you'd do something like:
<% foreach (var someVar in someCollection)
{ %>
<%: someVar %>
<% } %>
To print in a loop.
Well, presently, your foreach loop is running entirely within your view engine's code block. The code is running, and those variables are being reassigned a number of times, but you're never telling the C# to write any HTML. I don't write in ASPX, I write in the Razor, so I don't know much for how to escape in and out of C# mode, but I think it'd be something like this:
<table>
<%
var ResDet1 = (from r in db.Res_Exp
where r.Resume.ResumeID == 191
select new{r.ResExpID,r.Company}).ToList();
string company;
int exprinceid;
if (ResDet1 != null)
{
foreach (var rc in ResDet1)
{ %>
<tr>
<td><% rc.ResExpID; %></td>
<td><% company = rc.Company; %></td>
</tr>
<% }
}
%>
</table>
EDIT: To be specific, the point is that you want to leave the code to write HTML to the page, and return to finish the code block. As I understand it, MVC is consistent with this principal in both rendering engines.
In my code I am using a partial view (call it PV1)
<div id="div_1">
<% Html.Partial("PV1", Model); %>
</div>
and in that partial view I am using "Ajax.BeginForm" to redirect it to a particular action, hence it is doing so ...
using (Ajax.BeginForm("action1", "Forms", null, new AjaxOptions { UpdateTargetId = "div_1" }, new { id = "form1" }))
{
Response.write("I am here.");
}
public ActionResult action1(XYZ Model)
{
//
return PartialView("PV1", Model);
}
at the last line of action I am again calling the same partial 'PV1', hence it is doing this too ...
but when rendering the view it don't print or do the steps written with in partial view, it override them with and show nothing ...
Html.Partial actually returns the result of rendering the view, you want to do <%= Html.Partial() %> or <% Html.RenderPartial(); %>
Html.Partial() returns the Html and thusly must be output on the page via <%= %> and Html.RenderPartial() uses Response.Write to output onto the page and can be used with <% %>.
This is not what you would use Ajax.BeginForm for. That helper is used to create actual <form> tags that will later be submitted to the server using MVC's unobtrusive ajax (so you still need some kind of a trigger action - a button, javascript - anything that submits the form).
I'm am not very clear on what you're trying to achieve. If you want to load a partial view with ajax, I would suggest using something like jQuery's ajax load method.
In my code behind I have a public IEnumerable<dynamic> AllTransactions{ get; set; } that is composed of {Transaction, String} (created via linq-to-sql as a new anonymous object) where Transaction is a custom class I have created.
In my aspx page I would like to do the following
<% foreach (dynamic trans in AllTransactions) { %>
<span><%= trans.transaction.Amount %></span>
<% } %>
In my code behind I can refer to trans.transaction.Amount inside a foreach but I don't seem to have any luck on aspx pages. I get an exception:
Microsoft.CSharp.RuntimeBinder.RuntimeBinderException: 'object' does not contain a definition for 'transaction'
At the same time, if I have the debugger running I can look at 'trans' and I see it has a Transaction object inside it called 'transaction' and it has my string as well. Further, the 'transaction' object inside it contains a value for Amount. It seems that Microsoft is somewhere converting my dynamic to an object.
One other test I did was spit out what the type of trans is with GetType() and got this:
<>f__AnonymousTypef`2[ProjectName.Packages.Investment.Business.Transaction,System.String]
This is not a regular 'object', so I'm not sure what the type of this is. Any ideas as to why my foreach doesn't work and what I can do differently?
Try binding your data to a repeater control. It was designed to output html for items in lists, and will help you separate your design from your logic, which is generally considered a much better practice than trying to dynamically generate html in script.
Can you try this as below?
<% foreach (dynamic trans in AllTransactions) { %>
<span><%= trans.Amount %></span>
<% } %>
Or can you check whether the definition of the custom class Transaction includes a member variable whose name is "Transaction"?
I'm trying to do this: Editing a variable length list, ASP.NET MVC 2-style
In the post he mentions that it could be done with less code using Html.EditorFor(), but that it would be more difficult because of the indexes. Well, that's exactly what I want to do, and I don't know where to begin.
I'm an ASP.NET novice who just completed the Nerd Dinner tutorial before jumping into a project at work, so any help would be appreciated.
Update 1: Instead of generating a GUID for each item in the collection, I'd like to generate incremental indexes starting with 0. Right now the field names look like "gifts[GUID].value"; I would like them to be "gifts[0].value","gifts1.value" etc. but I don't understand how the collection keeps track and generates these indices.
In response to your update about generating indexes instead of GUIDs, the original linked article had a few comments from others that tried to solve the same issue but none of them worked for me. What I found was the collection with index was referenced in the following location:
html.ViewContext.ViewData.TemplateInfo.HtmlFieldPrefix
So I wrote a helper function to parse out the index (and if there is a problem then the GUID would be generated)
public static string GetCollectionItemIndex(this HtmlHelper html, string collectionName)
{
int idx;
string sIdx;
if (Int32.TryParse(Regex.Match(html.ViewContext.ViewData.TemplateInfo.HtmlFieldPrefix, #"\d+").Value, out idx))
{
sIdx = idx.ToString();
}
else
{
sIdx = Guid.NewGuid().ToString();
}
return sIdx;
}
I edited the BeginCollectionItem(..) function to call this helper function when setting the item index:
string itemIndex = idsToReuse.Count > 0 ? idsToReuse.Dequeue() : GetCollectionItemIndex(html, collectionName);
Hope this helps someone else!
Well, you begin by defining an editor template (~/Views/Shared/EditorTemplates/Gift.ascx):
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<MyApp.Models.Gift>" %>
<div class="editorRow">
<% using(Html.BeginCollectionItem("gifts")) { %>
Item: <%= Html.TextBoxFor(x => x.Name) %>
Value: $<%= Html.TextBoxFor(x => x.Price, new { size = 4 }) %>
<% } %>
</div>
And then replace the RenderPartial call with EditorForModel:
<% using(Html.BeginForm()) { %>
<div id="editorRows">
<%= Html.EditorForModel() %>
</div>
<input type="submit" value="Finished" />
<% } %>
Once you've tried this you may come back and ask if you have any problems by explaining the symptoms.
Previous post
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%
MvcApplication1.Models.FeaturesRepository _model = new MvcApplication1.Models.FeaturesRepository();
%>
<% foreach (var md in _model.GetAllFeatures())
{ %>
<li><%= md.vcr_FeaturesName %></li>
<% } %>
It is with reference to the previous post above.Is there something wrong with the foreach loop(The result is correct but it is displaying the series of Add,Add,Add,Add,Add,Add...,which is the last record of the getallfeatures.
#mazhar, instead of creating your model like you are, in MVC you should return the model to the view.
In your controller you would say something like return View(MyModel);
I don't see anything wrong, per-sey, with your foreach but if you are going to replicate a control over and over you may want to consider a PartialView and rendering that by passing the appropriate model to it.
<% foreach ( var md in model.features ) Html.RenderPartial(md); %>
The above is untested but close I think.
I haven't looked at the previous post because I think you need to get this into the MVC way first. I don't think there is technically anything incorrect in your code and suspect it's your controller and model code.
I've edited your post to remove the commented out code. Very confusing leaving it in.