I'm a little new to ASP.NET MVC3.
I have this code in a cshtml file
#grid.GetHtml(
htmlAttributes: new { id = "grid" },
tableStyle: "grid",
headerStyle: "header",
rowStyle: "row",
footerStyle: "footer",
alternatingRowStyle: "altRow",
columns: grid.Columns(
grid.Column(header: "", format: #<text><input name="Checked" type="checkbox" value="#item.Key" /></text>, style: "CheckboxColumn", canSort: true),
grid.Column("Name", "Name"),
grid.Column("Address", "Address"),
grid.Column("City", "City"),
grid.Column("PhoneNumber", "Phone Number"),
grid.Column("", format: (item) =>
{
if (item.ID.Length > 0)
{
//CODE GOES HERE
return Html.Raw(string.Format("<text><img src=\"{0}\" alt=\"Image\" class=\"ToolTip\" title=\"ID # {1} <br> \" /></text>", Url.Content("~/images/coupled.png"), #item.ID.ToString()));
}
else
{
return Html.Raw("<text></text>");
}
}),
))
What I want is to write a C# Code at the //CODE GOES HERE section. in order to change the Url.Content("~/images/coupled.png")
epending on item ID.
So basically I want something like:
string URLOfPic;
if(item.ID > 1000)
{
URLOfPic="~/images/aaa.png
}
else
{
URLOfPic="~/images/bbb.png
}
and finally to use Url.Content(URLOfPic)
So how can I use that C# code in the page?
I hope I was clear.
Thank you very much for any help
PS: I want it to be a C# code and not a javascript or anything else.
In normal ASP.NET I can just use the code behind to do it. but in MVC3 I have no idea how
Being new to Asp.net mvc let me give you some advice, Don't Do That! The most code you should have in a view is a for loop, all of that kind of logic should be done in the action.
basically take your data and do all logic and formatting in the action and add it to a view model then pass that to the view. Other wise your going to create very brittle code blocks that won't error until run time
Modify your item class to add an image class. In the image class you can add Image.URL, Image.Title. This way in the controller you can assign the item an image based on it's ID. This will also allow you to more easily modify the image URLs at a single point of code, instead of modifying in every view that you use this logic in.
I think you are close, did this not work?
if (item.ID.Length > 0)
{
string URLOfPic;
if(item.ID > 1000)
{
URLOfPic="~/images/aaa.png";
} else {
URLOfPic="~/images/bbb.png";
}
return Html.Raw(string.Format("<text><img src=\"{0}\" alt=\"Image\" class=\"ToolTip\" title=\"ID # {1} <br> \" /></text>", Url.Content(URLOfPic), #item.ID.ToString()));
}
Related
Rite now i am using two tabs one for countries and one for cities.IF i click first tab, countries will be loaded and second tab, cities will be loaded.Now what i want to achieve is when i click any of countries coming under the grid of first tab,then second tab is filled with corresponding countries cities only ,how will i do that,, country id and city c_id has Primary key and foreign key relation ship
<ul>
<li>Tab Header 1</li>
<li>#Html.ActionLink("Tab Header 2", "_gridsecondtab")</li>
</ul>
<div id="tabs-1">
#Html.Action("_gridfirsttab");
</div>
firstgrid
<div id="gridfirstContent">
#grid.GetHtml(tableStyle: "webGrid",
headerStyle: "header",
alternatingRowStyle: "alt",
selectedRowStyle: "select",
columns: grid.Columns(
grid.Column("id", format: (item) => item.GetSelectLink(item.id.ToString())),
grid.Column("countryname", "CountryName"),
grid.Column("continent", "Continent", style: "description"),
grid.Column("language", "Language")
))
#{
firstmvc4.Models.Country conuntry = new firstmvc4.Models.Country();
}
Controller
public ActionResult _gridfirsttab()
{
return PartialView(db.Countries.ToList());
}
public ActionResult _gridsecondtab()
{
return PartialView(db.Citynews.ToList());
}
The way this would normally be done is to use AJAX callbacks to populate the cities based on the user's country selection. You mentioned jQuery in your title so that's what I assume you want.
Have your main page return a grid of countries, as you've done. To populate the cities, normally one would return the data in JSON format and write some JavaScript to render the city list client-side. Alternatively you could render HTML server-side and display it directly but that's less efficient.
Also read http://api.jquery.com/jQuery.ajax/ for how jQuery can be used to do an AJAX call from JavaScript.
Hope that helps.
I'm quite new to asp .net and I'm working with a WebGrid in MVC5 and I've created the folowing code in my strongly typed view:
#{
var grid = new WebGrid(Model.CustomerArticles, defaultSort: "Name");
}
#grid.GetHtml(columns: new[]{
grid.Column("ArticleNr", "ArtikelNr"),
grid.Column("Name", "Namn"),
grid.Column("Category", "Kategori"),
grid.Column("CustomerArticleNr", "Kundens artikelNr"),
grid.Column("InventoryCount", "Inventerat antal"),
grid.Column("WasSyncronized", "Synkroniserades"),
grid.Column(
header: "Action",
format: #<text> #Html.ActionLink("Ta bort", "RemoveArticle", "Article", new { id = Model.SelectedID, articleId = item.ID }, null) </text>)
})
It's working fine and it's currently possible to filter by clicking the columns but I wonder if there is any simple solutions to filtering it futher? Like for example as the aspx gridview: http://csharpdotnetfreak.blogspot.com/2011/04/gridview-filterexpression-dropdownlist.html
Is there any equivalient or any other biolerplate implementations that aren't to complicated to implement?
The important thing with my solution is to make it simpler to work with the grid if there is a lot of data in it. Which I believe it not the current situation. So other suggetions to make is clearer is also welcome.
I have a case where I have a page displaying an order and tabs that display the order details. The order details are quite complex and since they are the same layout, I want to use a partial view or editor template that will generate the form.
The problem is the result is multiple duplicate form input id's are generated (one for each order detail. For example, I have:
foreach (var orderDetail in Model.OrderDetils)
{
#Html.EditorFor(model => orderDetail, "WorkOrder", orderDetail)
}
I've read much about this and see solutions where it is recommended to use an editortemplate, but that solution only works when you have the same form to render, but passing it different model properties so the control id's prefixes will differ...ie. like this solution.
In my case, this won't work as the model property I am passing is always the same.
So how else can I create unique Id's in the partial or editor template that will also bind.
I know instead of:
#Html.EditorFor(model => model.WOHdr.Attribute1)
I could do:
#Html.TextBoxFor(model => model.WOHdr.Attribute1, new { id = Model.Id + "_Attribute1" })
But then it won't bind when it passes to the controller.
Thoughts?
Try this
#Html.TextBoxFor(model => model.WOHdr.Attribute1, new { #id = #Model.Id + "_Attribute1" })
Use "#"+dynamic value. Now You will get unique Id's
In EditorFor you can use like this
#Html.EditorFor(model => model.WOHdr.Attribute1, null, "id=" + #Model.Id + "" )
the id will generate like this
id="id_1", id="id_2" and so on..
<input id="Checkbox1_#(test.TestId)" type="checkbox" />
i hope upper code will help you
I'm trying to use a WebGrid to display data in my model and am having a huge number of issues. My model contains among other things this:
public IEnumerable<Auction> Auctions { get; set; }
What I have done is:
#{
var grid = new WebGrid(Model.Auctions, rowsPerPage: Model.PagingInfo.ItemsPerPage, defaultSort: "Title", canPage: true, canSort: true)
{SortDirection = SortDirection.Ascending};
grid.Pager(WebGridPagerModes.NextPrevious);
}
I want to display some text in the first column depending on the type of the auction in the current row, so I have written a method in the model:
public string GetAuctionType(Auction auction)
{
var type = string.Empty;
if (auction is LubAuction)
{
type = "Lowest unique wins";
}
else if (auction is EsfAuction)
{
type = "Highest wins";
}
return type;
}
Now, my view also contains:
#grid.GetHtml(
columns: grid.Columns(
grid.Column("OwnerReference", header: "Owner reference")
)
);
Question is how do I add a grid.Columns line in the above to display the text in GetAuctionType?
Also, the other issue is that there is no pager appearing and sorting does not work.
I would appreciate all help.
Thanks,
Sachin
I would move GetAuctionType logic to a Partial Class so you can access it like a normal property on each object in your collection. You may also want to take a look at question ASP.NET MVC3 WebGrid format: parameter that is covering usage of WebGrid's column format syntax.
Regarding your other issues, do you see any errors in javascript console ?
Using an asp.net mvc webgrid, is it possible to render a column using Html.DisplayFor for the current row/column?
grid.Column("Roller", "Roller", canSort: true, format: #<text>#Html.DisplayFor( <the row result here> )</text>)
The Html.DisplayFor(m) helper uses the page model, not the current row item. Is there a way around this.
Thanks
// Johan
Yes, it is possible. For an example, consider you are binding a list of Banner objects to your WebGrid. Also consider the Banner.Active property, which is a boolean value that you want to be rendered as a CheckBox. You can do this:
format: (item) => { var banner = item.Value as Banner;
return Html.DisplayFor(modelItem => banner.Active);
}
You could also do this:
format: (item) => Html.DisplayFor(modelItem => ((item as WebGridRow).Value as Banner).Active)
But I would consider the first option more readable.
try this
var grid = new WebGrid(Model);
than do
grid.Column("Roller", "Roller", canSort: true, format: #<text>#Html.DisplayFor(modelItem => item.blabla)</text>)
Using item.blabla"whatever ur item name is" may work but im not really experienced about this.
also there is not much difference between
#<text>#Html.DisplayFor(modelItem => item.blabla)</text>
&
#<text>#item.blabla</text>
both usage does the job.