How to get text from DropDownList in .Net-MVC?

Question

Here is my code : @Html.DropDownListFor(model => model.Category new List {new SelectListItem { Text = Select Value= 0} new SelectListItem { Text = Creator Value= C}new SelectListItem { Text = Assignee Value= A} new SelectListItem { Text = Reporter Value= R} })

Rajeev Punhani · Answer

Hi Jithil You cannot get the text of a dropdown directly in MVC using forms collection.By default the value of dropdown is posted in forms collectionbut you can access the same using hidden field.Below is the snippet for the same. $(document).ready( function (){ $( #Category ).change( function (){ var catText=$( #Categoryoption:selected ).text(); $( #hidCategory ).val(catText); }); }); In the controller action you can access the same . public ActionResult Index(FormCollection collection) { varcat=collection[ hidCategory ]; } If the above solution is helpful then accept the answer.

Rohit Mane · Answer

You may not get this easily with the default model binding. You have to a small workaround like this. 1) Add a new property to your model/viewmodel to store the selected text public class DocumentModel { public int TypeID { get ; set ; } public List SelectListItem > DocumentTypes { get ; set ; } public string SelctedType { set ; get ;} } 2) Use Html.HiddenFor Helper method to create a hidden variable in the form for this property @Html . HiddenFor ( x => x . SelctedType ) 3) Use little javascript to override the submit ! ie; When user submits the form Get the selected Text from the dropdown and set that value as the value of the Hidden field. $ ( function () { $ ( form ). submit ( function (){ var selTypeText = $ ( #TypeID option:selected ). text (); $ ( #SelctedType ). val ( selTypeText ); }); }); Now in your HTTPPost action method This will be available in the SelectedType property. [ HttpPost ] public void UploadDocument ( DocumentModel model ) { if ( ModelState . IsValid ) { string thatValue = model . SelectedType ; } }

Vd Tripathi · Answer

@Vandana Here I am posting one sample code that can help you 1). First create a model like below posted.. public class EmployeeModel { public int EmployeeId { get; set; } public string EmpName { get; set; } public double Salary { get; set; } public List listEmp { get; set; } public IEnumerable EmployeeListItems { get { return new SelectList(listEmp EmployeeId EmpName); } } } 2.) Now you create these two Actions in your controller. public ActionResult EmpTest() { var employeeModel = new EmployeeModel(); employeeModel.listEmp = GetEmployeeDataFromDB(); //Set default emp records employeeModel.EmployeeId = employeeModel.listEmp.First().EmployeeId; employeeModel.EmpName = employeeModel.listEmp.First().EmpName; employeeModel.Salary = employeeModel.listEmp.First().Salary; return View(employeeModel); } [HttpPost] public ActionResult EmpTest(EmployeeModel model) { var employeeModel = new EmployeeModel(); employeeModel.listEmp = GetEmployeeDataFromDB(); //Filter empData based on empId //This filter part you can do through ado.net method //Dropdownlist selected EmployeeId will be model.EmployeeId that can be passed in to ado.net method var emp = employeeModel.listEmp.Where(e => e.EmployeeId == model.EmployeeId).FirstOrDefault(); //Set default emp records employeeModel.EmployeeId = emp.EmployeeId; employeeModel.EmpName = emp.EmpName; employeeModel.Salary = emp.Salary; return View(employeeModel); } 3.) Put this private method into controller. But it is actually your ado.net where you can write query to fetch data from database. private List GetEmployeeDataFromDB() { //Here you can write your query to fetch data from db var listEmp = new List (); var emp1 = new EmployeeModel(); emp1.EmployeeId = 1; emp1.EmpName = Employee1; emp1.Salary = 50000; var emp2 = new EmployeeModel(); emp2.EmployeeId = 2; emp2.EmpName = Employee2; emp2.Salary = 56000; var emp3 = new EmployeeModel(); emp3.EmployeeId = 3; emp3.EmpName = Employee3; emp3.Salary = 60000; listEmp.Add(emp1); listEmp.Add(emp2); listEmp.Add(emp3); return listEmp; } 4.) This is View sample.(You can customize it) @model MvcApplication1.Models.EmployeeModel @{ ViewBag.Title = EmpTest; } EmpTest @using (Html.BeginForm(EmpTestHomeFormMethod.Post new { id = demoForm name = demoForm })) { @Html.DropDownListFor(m => m.EmployeeId Model.EmployeeListItems ---Select Employee--- new { Class = ddlStyle onchange = SelectedIndexChanged() }) EmployeeModel @Html.DisplayNameFor(model => model.EmployeeId) @Html.DisplayFor(model => model.EmployeeId) @Html.DisplayNameFor(model => model.EmpName) @Html.DisplayFor(model => model.EmpName) @Html.DisplayNameFor(model => model.Salary) @Html.DisplayFor(model => model.Salary) } function SelectedIndexChanged() { //Form post document.demoForm.submit(); } 5.) And finally you page will look like this. Yellow marked line indicates data coming from codebehind. I hope it will help you a lot. First try to make a sample with above example and then customize as your requirement. All the best.

vandana rathi · Answer

Thanks for the reply Vd Tripathi I want to get the vale of EmpName Salary Dept by selecting the EmpId on selected index change event in mvc

Vd Tripathi · Answer

@Vandana Rathi Do you want to get dropdownlist select value in ado.net method? If it is better you should call your Controller's action method through jquery/javascript as ajax get/post method. Your action should have one parameter for dropdownlist selected value and same parameter name should be passed in ajax call with dropdown selected value. you can follow this thread how to get dropdownlist selected value on change event. 1.) http://stackoverflow.com/questions/20225823/jquery-ajax-callback-onchange-from-dropdownlist 2.) https://api.jquery.com/change/ And how to do ajax call follow this link 1.) http://stackoverflow.com/questions/18697034/how-to-pass-parameters-in-ajax-post 2.) http://www.w3schools.com/jquery/ajax_ajax.asp 3.) http://api.jquery.com/jquery.ajax/ Edit- And in last from controller's action you can call selected value to your ado.net method. Hope this information will help you.

vandana rathi · Answer

I wanted to get the value by clicking on dropdown to the textboxes by ado.net method in mvc

Vincent Maverick Durano · Answer

Also if you are new to ASPNET MVC then here's a step by step tutorial about doing insertupdate and delete using Entity Framework: http://geekswithblogs.net/dotNETvinz/archive/2011/06/03/asp.net-mvc-3-creating-a-simple-sign-up-form.aspx http://geekswithblogs.net/dotNETvinz/archive/2012/01/09/asp.net-mvc-3---editing-and-updating-the-form.aspx

Vincent Maverick Durano · Answer

When submitting I want to insert that drop down value in to the DB and the text to the UI. The code provided should enable you to get the dropdownlist value. You should be able to insert that value to your database. You can also use ViewBag to pass the selected value to your Index. A Quick example for inserting is something like this using the traditional ADO.NET: public ActionResult(string dropDownSelected){ //the dropDownSelected will contain the selected value from the list (the value of the selected option) //Otherwise you can access it through the Request.Form collection string selected = Request.Form[YourDropDownName]; InsertData(selected); ViewBag.Selected = selected; return View(Index); } private void InsertData(string selectedItem){ using (SqlConnection connection = new SqlConnection(YOUR CONNECTION STRING HERE)) { string sql = INSERT INTO TableName (FieldName) VALUES (@Val1); using (SqlCommand cmd = new SqlCommand(sql connection)) { connection.Open(); cmd.Parameters.AddWithValue(@Val1 selectedItem); cmd.ExecuteNonQuery(); } } } Then you can display the value of the ViewBag like this in your Index view: @ViewBag.Selected

Jithil John · Answer

When submitting I want to insert that drop down value in to the DB and the text to the UI.

Vd Tripathi · Answer

There is little bit confusion in your question now like you asked you want to get text from dropdownlist now you want to show it on some different page. can you please be more clear on how many pages you have in this scenario and which page have dropdownlist control and on which page you want to show it.

Jithil John · Answer

I want to display it in the index page.

Vd Tripathi · Answer

If you want to show dropdown selected text on UI as user select it then you need to use jQuery for dropdownlist selection event.And for db i think my previous answer will help you because as you will get selected value in Controller through model you can do save operation. //in above example selectedValue is id of dropdownlist.

Jithil John · Answer

I want to display that text in my UI and the value in my db

Vincent Maverick Durano · Answer

As long as your DropDownList is within a form and then submit this form to an MVC action you can grab the value that was selected from your DropDownList by it's name : public ActionResult(string dropDownSelected){ //the dropDownSelected will contain the selected value from the list (the value of the selected option) //Otherwise you can access it through the Request.Form collection string selected = Request.Form[YourDropDownName]; return View(); }

Vd Tripathi · Answer

If you want to get drop down list selected value in controller so you will be able to get it through model property in below example I added one selectedValue property in my model and through that property you can get it on controller. @Html.DropDownListFor(model => model.selectedValue new List { new SelectListItem { Text = Select Value= 0} new SelectListItem { Text = Creator Value= C} new SelectListItem { Text = Assignee Value= A} new SelectListItem { Text = Reporter Value= R} }) Let me know It helps you.

Shailesh Uke · Answer

you use the form collection public void getdata( FormCollection fomr) { string name = Request.Form[ name ]; } // [ name ]; is control name property