I am doing a web application in Visual Studio in C#. The application should be able to write out students and courses which they attend. Anyway, I added a "Create view", where I can create new courses, but now I want to add a COMBOBOX there so that I am able to choose students and for the chosen one enter a new course. Can somebody tell me how to add a combobox WITHOUT using Windows Forms? I need code, and explanation where to insert it! I hope you can help me. Thank you.
You need to use <select> in html,to fill your list and dynamically create you need to fill your list in your controller like this:
List<Student> students = new List<Student>();
Student std = new Student();
....
students.Add(std);
Then return your View and pass it your list:
return View(students);
In your View set your View Model like this:
#model IEnumerable<Student>
Then add a foreach loop and create your comboBox:
<select id="studentList">
foreach(Student s in Model)
{
<option>#s.Name</option>
}
</select>
Or you can use Html.DropDownListForHelper method, and it will create a list automatically for you:
#Html.DropDownListFor(m => m.Name)
I give you a sample,you can change it like whatever you want,you didn't provide enough information...
Since I read that you did the "Create View" action, I assume you're making a web application in the ASP.NET MVC framework. A combobox on the web is merely this:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
-> Each "option" tag represents a choice in the dropdown.
Reference & more info on the "select" tag: http://www.w3schools.com/tags/tag_select.asp
But for full guidance on how to use the MVC framework I'd recommend you'd start a tutorial of some sorts, for example this one: http://www.asp.net/mvc/tutorials/mvc-5/introduction/getting-started
The solution is not ASP.net specific, rather its part of html. The input control you're looking for is the select element. If you're using MVC, you can use the DropdownListFor extension method.
If you're using other server technologies they may have their own html rendering helpers.
Related
This is probably super obvious, but I'm incredibly new at MVC (and C# in general) and I just can't figure it out.
I have a viewModel that holds several bits of data about a project, which is then displayed in a table on the view using #foreach.
I want to set up a filter so that only the data belonging to the specified project is shown. I've figured out how to do this with filter buttons by using #foreach to create a new filter button for every distinct ProjectName present in the viewModel:
<div class="btn-group">
<button type="button" class="btn btn-default btn-filter" data-target="all">All</button>
#foreach (var item in Model.Select(s => s.ProjectName).Distinct().ToArray())
{
{<button type="button" class="btn btn-default btn-filter" data-target="#item">#item</button>}
}
</div>
The actual filtering is done with Chosen and jQuery, which I'm find with, but I can't figure out to to transfer the data from creating buttons to filling a DropDown menu.
I don't want to fill the DropDown with EVERY available ProjectName because there's hundreds, I only want the ones that actually exist in the viewModel at the time the page is loaded.
All the tutorials and guides I've found online involve creating more viewModels and List<> classes, which I would rather avoid if possible.
What am I missing?
I figured it out!
I was trying to use HTML Helpers, but with Chosen you can just do it in a SELECT statement:
<select class="chosen-select" style="width:200px;">
<option data-target="all">All</option>
#foreach (var item in Model.Select(s => s.ProjectName).Distinct().ToArray())
{ <option data-target="#item">#item</option>
}
</select>
I want to do dropdown list with input field. I use Blazor-client-side framework.
Here is my code
<div>
<datalist id="suggestions">
#if (cityList != null)
{
#foreach (var city in cityList)
{
<option value="#city.CityName">#city.CityName</option>
}
}
</datalist>
<input autoComplete="on" list="suggestions" />
</div>
And it is work, but if i try to print in input the nonexisting value - the result is ok. I need to block the selection of nonexistent elements. How can i do it with datalist? Or maybe i need to use select - options? Thanks in advance!
If you wish to block the selection of nonexistent elements, use the InputSelect component.
If you want to create a search mechanism that display a list of suggestions to select (in the form of autocomplete) for search, and yet allow the user to enter other values for search, then use the datalist with input tag. This is after all how search tools work, right ? I know it is tempting to use datalist with input tag as it is more attractive to the eye. But you should use it only if it fits the required functionality.
Having said that, I believe you can create a component with datalist and input tag that can block the selection of nonexistent elements. This may involve Blazor databinding, C# code, and perhaps JSInterop. I wouldn't try to do this unless...
Hope this helps...
Im trying to change the code in an existing project to make a DropDownListFor to select an item. I have read countless of threads but i do not get an specific item to get selected;
This is what i got;
Controller;
ViewData("MyDropDownList") = new SelectList(_myRepository.GetData, "data_id", "name"})
View;
#Html.DropDownListFor(Function(m) m.data_id, TryCast(ViewData("MyDropDownList"), SelectList))
And this produces a nice list that looks something like this;
<select id="someId" name="someName" data-val="true">
<option value="aec385a7-bd77-4b94-9fbb-130487e3e62e">Option1</option>
<option value="5edee514-e6ca-456f-a8fa-71bde67351a1">Option2</option>
<option value="8a293328-8b11-47b7-bc9a-ceddf2e6a355">Option3</option>
</select>
After abit of reading i was pretty sure that this would work for making "Option2" selected;
ViewData("MyDropDownList") = new SelectList(_myRepository.GetData, "data_id", "name", "5edee514-e6ca-456f-a8fa-71bde67351a1"})
But it didn't, i have also tried this;
ViewData("MyDropDownList") = new SelectList(_myRepository.GetData, "data_id", "name", New With {Key .id = "5edee514-e6ca-456f-a8fa-71bde67351a1"} })
What am i doing wrong? VB is not my cup of tea so it might as well just be a syntax screw up. Any input is appreciated.
In MVC if the view is strongly typed the selectlist’s selected option will be overridden and the selected option property set on the constructor will never reach the view and the first option in the dropdown will be selected instead (why is still a bit of a mystery). To overcome this issue all that needs to be done is to rename the DropDownList in the view and also the name of the ViewData’s key in the controller to something other than the name set in the model , and the selected option will then reach the view. Unfortunately when posting the form you will have to access the selected option’s value from the FormCollection rather than a strongly typed object which is a little annoying.
Source :http://www.dotnetguy.co.uk/post/2009/06/25/net-mvc-selectlists-selected-value-does-not-get-set-in-the-view/
I do:
#Html.DropDownList("ddBrand", (IEnumerable<SelectListItem>)ViewBag.Brands, new {onchange = "JavaScript:Act()"})
But when I press submit it needs the field "ddBrand" in View Model.
How can I add DropDownList to View without binding to ViewData? (without adding field "ddBrand" in View Model)
Simply generate the HTML. You can create the options in a for loop. You can give different name to the id and name attributes.
<select id="ddBrand" name="ddBrand">
<option value="value">Text</option>
</select>
I am building a screen in my C# Asp.Net MVC application, which has a few related drop downs.So, for example, I select 'Category', and then a 2nd drop down should display all related sub categories for the selected category.
So, would the model contain a List, used to build the Category drop down, and then a List, initially empty. On the selection of the category, I need to do a post back, passing back the id if the selected Category, then populate the List<> Sub Categories... and then build the Sub Category drop down?
Hopefully someone can assist with the design of my model. The model would also have quite a few non-list related data for the item being edited. And I think the model would also need a 'CategorySelectedId', so that I know what was selected?
The nicest way is to use AJAX for this. You'll have to hook the change event to your first select box, and once it is changed, you'll do a AJAX request with the selected value to some Action. The action will return a JSON list, which will be parsed and put in the next select box.
Update
The model for the JSON returning action can be an anonymous type really, or a IEnumerable of SelectListItem. Use Linq: `mycollection.select(item=> new SelectListItem() { Name = item.Name, Value = item.ID.ToString() });
If we assume the page looks like this:
<form>
<select id="MainCat" name="MainCatID">
<option value="1">First option</option>
<option value="2">First option</option>
<option value="3">First option</option>
</select>
<select id="SubCat" name="SubCatID" disabled="disabled">
<option value=""> -- Please select a main category -- </option>
</select>
</form>
Your model would look like:
public class MyModel {
public int MainCatID {get;set;}
public int SubCatID {get;set;}
public IEnumerable<SelectListItem> MainCats {get;set;}
}
Of course you could add validation attributes etc.