#Html.DropDownListFor(model => model.ZipFile, new SelectList(ViewBag.ZipFiles))
The above code creates me a select list just fine. But I want to make the selection optional. Unfortunately there is no empty option and I'd like to add one in. How would I do this?
By using the proper DropDownListFor overload:
#Html.DropDownListFor(
model => model.ZipFile,
new SelectList(ViewBag.ZipFiles),
"-- please select a zip file --"
)
#Html.DropDownListFor(model => model.Country, new List<SelectListItem>
{
new SelectListItem { Text = "India", Value = "1"},
new SelectListItem { Text = "USA", Value = "2"},
new SelectListItem { Text = "Sreelanka", Value = "3"},
new SelectListItem {Text = "Africa",Value="4"},
new SelectListItem { Text = "China", Value = "5" },
new SelectListItem { Text = "Austraila", Value = "6" },
new SelectListItem { Text = "UK", Value = "7" }
}, "Select Country",
new {#Style = "Width:500px;height:40px;",
#class = "form-control input-lg"})
In the controller, when you set ViewBag.ZipFiles, add a SelectListItem to that collection.
Related
I am stuck with very common problem, in my application I want to put search-navbar which will be available in every page.
I mean search with query to write and dropdownlist with category of item to search.
Because I want to have acces in every page, I implemented it in Layout page like below:
<div class="col-xs-10 search-field">
#Html.Editor(" ", new {htmlAttributes = new {#class = "search-input", #id = "searchQuery", #placeholder = ResourcesPolish.Search_WhatAreYouLookingFor}})
</div>
<div class="col-xs-4 category-field">
#Html.DropDownList(" ",
new SelectList(new[]
{
new SelectListItem {Value = "1", Text = "Elektronika"},
new SelectListItem {Value = "2", Text = "Moda i uroda"},
new SelectListItem {Value = "3", Text = "Dom i zdrowie"},
new SelectListItem {Value = "4", Text = "Dziecko"},
new SelectListItem {Value = "5", Text = "Kultura i rozrywka"},
new SelectListItem {Value = "6", Text = "Elektronika"},
new SelectListItem {Value = "7", Text = "Sport i wypoczynek"},
new SelectListItem {Value = "8", Text = "Motoryzacja"},
new SelectListItem { Value = "9", Text = "Kolekcje i sztuka"},
new SelectListItem {Value = "10", Text = "Firma"},
new SelectListItem {Value = "11", Text = "Inne"},
}, "Value", "Text"), "wszystkie działy", new { #class = "category-input", #id = "category" })
</div>
<div class="col-xs-1 search-button" onclick="search()">
</div>
Then, I have javascript which take value, that is selected:
function search() {
var categoryId = $('#category').val();
var query = $('#searchQuery').val();
if (query) {
window.location.href = '#Url.Action("SearchItem","Item")?query=' + query + '&categoryId=' + categoryId;
}
}
It work's fine, but all categories are hardcode'd, and maybe better solution is to read them from Db, because admin may change part of them? But I haven't got any way to do this via Layout page (I mean to pass them via model), so I don't know, is there any better solution for stuffs like that?
This is the same situation like at ebay.com, always at the top of the page there should be search-area with dropdown for categories.
Any ideas?
One solution is to create a controller for your navbars, like this:
public class NavbarController : Controller
{
public ActionResult Categories()
{
// you might want to return this from database, of course
var model = new SelectList(new[]
{
new SelectListItem {Value = "1", Text = "Elektronika"},
new SelectListItem {Value = "2", Text = "Moda i uroda"},
new SelectListItem {Value = "3", Text = "Dom i zdrowie"},
new SelectListItem {Value = "4", Text = "Dziecko"},
new SelectListItem {Value = "5", Text = "Kultura i rozrywka"},
new SelectListItem {Value = "6", Text = "Elektronika"},
new SelectListItem {Value = "7", Text = "Sport i wypoczynek"},
new SelectListItem {Value = "8", Text = "Motoryzacja"},
new SelectListItem { Value = "9", Text = "Kolekcje i sztuka"},
new SelectListItem {Value = "10", Text = "Firma"},
new SelectListItem {Value = "11", Text = "Inne"},
}, "Value", "Text");
return View(model);
}
}
Then a separate view called Categories.cshtml inside a Navbar folder, which would look like this:
#model SelectList
#{
Layout = null;
}
<div class="col-xs-10 search-field">
#Html.Editor(" ", new {htmlAttributes = new {#class = "search-input", #id = "searchQuery", #placeholder = ResourcesPolish.Search_WhatAreYouLookingFor}})
</div>
<div class="col-xs-4 category-field">
#Html.DropDownList(" ", Model, "wszystkie działy", new { #class = "category-input", #id = "category" })
</div>
<div class="col-xs-1 search-button" onclick="search()">
</div>
In your layout, you replace all that html with this:
#Html.Action("Categories", "Navbar");
Actually, I wouldn't use a SelectList as a model, it's just to show how it could work. You might want to create a CategoriesViewModel holding the SelectList, or an IEnumerable<CategoryViewModel> and create the SelectList inside your view, by using your model.
I'm not sure that it's right way, but also you can change your _Layout.cshtml like that:
#using D.Models//namespace where your database described
#{ db a = new db();
SelectList list = new SelectList(a.Table/*table what you need*/, "value", "name");
}
and then:
<div class="col-xs-4 category-field">
#Html.DropDownList(" ",list, "wszystkie działy", new { #class = "category-input", #id = "category" })
</div>
#Html.DropDownList("FilterOptions", new List<SelectListItem>()
{ new SelectListItem { Text = "Begins with", Value = "1" },
new SelectListItem { Text = "Contains", Value = "2" } ,
new SelectListItem { Text = "Doesn't contain", Value = "3" } ,
new SelectListItem { Text = "Ends with", Value = "4" },
new SelectListItem { Text = "Doesn't equal", Value = "5" }
}, "Select filter options", new { #class = "large" })
The code given above is for a static dropdown for my search functionality.
How can I access the value of the dropdown in my Controller?
This is my current razor code for a simple select.
#Html.DropDownList("Season", Model.Seasons.Select(s => new SelectListItem { Text = s.Name, Value = s.SeasonId.ToString() }), new { #class = "sel_season" })
What I want to do is add/insert an additional option item called "All".
I have tried Concat, but I can't seem to get it to work.
#Html.DropDownList("Season", Model.Seasons.Select(s => new SelectListItem { Text = s.Name, Value = s.SeasonId.ToString() }).Concat( new {"All", "0"}), new { #class = "sel_season" })
The following sample uses an overloaded extension method in the HtmlHelper class:
#Html.DropDownList("Season"
, Model.Seasons.Select(s => new SelectListItem {
Text = s.Name,
Value = s.SeasonId.ToString()
})
, "All"
, new { #class = "sel_season" }
)
Try This
#Html.DropDownList("Season",
Model.Seasons
.Select(s =>
new SelectListItem { Text = s.Name, Value = s.SeasonId.ToString() })
.ToList().Insert(0, SelectListItem { Text = "All",Value = "0"}),
new { #class = "sel_season" })
I am making a MVC4 webapp for peers at 2 colleges to use, and later on I will expand to other schools. In my model I currently have
public string school { get; set; }
I would like it so when I do
#Html.EditorFor(model => model.school)
It would be a drop down of "school 1" and "School 2".
How can I go about doing this cleanly? If I can, I would like to be able to make the change in the model and not have to do anything in the view besides call #Html.EditorFor. If the only way to accomplish this is do something in the view, that is OK as well.
Instead of Html.EditorFor you can use Html.DropDownListFor
#{
var items = new SelectList(new[]
{
new SelectListItem {Text = "School1", Value = "School1"},
new SelectListItem {Text = "School2", Value = "School2"},
}, "Text", "Value");
}
#Html.DropDownListFor(x => x.school, #items)
Either you can use above code or you can go with this code in your page.
#Html.DropDownListFor(model => model.Status, new List<SelectListItem>
{
new SelectListItem{ Text="New", Value = "New" },
new SelectListItem{ Text="InProcess", Value = "InProcess" },
new SelectListItem{ Text="Completed", Value = "Completed" },
new SelectListItem{ Text="Rejected",Value="Rejected"},
}, "Select Status", new { #class = "form-control select2_demo_4" })
This will surely help you out and you can get value in your model when you select any of it.
I have to bind an Html.DropDownList with just two items statically.
Text="Yes" Value="1"
Text="No" Value="0"
The important thing is that, I have to set the text and value fields.
How can I do this?
I used this is properly working
#Html.DropDownList("Status", new List<SelectListItem>
{
new SelectListItem{ Text="Active", Value = "1" },
new SelectListItem{ Text="Not-Active", Value = "0" }
})
It is a best practice not to create the SelectList in the view. You should create it in the controller and pass it using the ViewData.
Example:
var list = new SelectList(new []
{
new { ID = "1", Name = "name1" },
new { ID = "2", Name = "name2" },
new { ID = "3", Name = "name3" },
},
"ID", "Name", 1);
ViewData["list"]=list;
return View();
you pass to the constratctor: the IEnumerable objec,the value field the text field and the selected value.
in the View:
<%=Html.DropDownList("list",ViewData["list"] as SelectList) %>
Code below assumes you are using razor view engine if not you will need to convert it.
#{
var listItems = new List<ListItem>();
listItems.Add(new ListItem{Text="Yes", Value="1"});
listItems.Add(new ListItem{Text="No", Value="0"});
}
#Html.DropDownListFor(m=>m.SelectedValue, listItem);
You should consider creating the model in your code instead of the view. Also this would be a good candidate for an editor template.
if you want to be alittle explicity then try
#{
var domainsList = new SelectList(new []
{
new SelectListItem { Text = ".Com", Value = ".com", Selected = true },
new SelectListItem { Text = ".Shopping", Value = ".shopping"},
new SelectListItem { Text = ".Org", Value = ".org"},
new SelectListItem { Text = ".Net", Value = ".net"},
new SelectListItem { Text = ".AE", Value = ".ae"},
new SelectListItem { Text = ".Info", Value = ".info"},
}, "Value", "Text");
}
#Html.DropDownList("TopLevelDomains", domainsList)
This solved it for me:
<td>
#{ var RlistItems = new List<SelectListItem>();
RlistItems.Add(new SelectListItem { Text = "Select Room Type", Value = "0" });
RlistItems.Add(new SelectListItem { Text = "Meeting Room", Value = "1" });
RlistItems.Add(new SelectListItem { Text = "Office", Value = "2" });
RlistItems.Add(new SelectListItem { Text = "Cafeteria", Value = "3" });
}
#Html.DropDownListFor(model=>model.FirstOrDefault().RoomType
,RlistItems,RlistItems[item.RoomType.Value].Selected=true )
</td>
<select asp-for="CountryName" asp-items=#(new List<SelectListItem> { new SelectListItem {Text="India",Value="1" } ,new SelectListItem {Text="Japan",Value="2" }} ) class="form-control">
<option>SELECT COUNTRY -- </option>