Display Dropdownlist selected data in textbox.

Question

Hello friends I am working on MVC project.I have stucked on some event.I am using a Dropdownlist in View which is populted from database called ID. When we select ID from Dropdownlist I want to display Name on Textbox which is related to that ID. Like If we have a record- ID=1Name=Karan; when we select ID 1 in list name karan must be display on textbox. I have tried more but did not get the solution.

Ujjval Shukla · Answer

Here Empmasters also showing the Name not ID. ea.Emp_Id = Convert.ToInt32( Empmasters ); I think it is becauseof we have used this- ViewBag.Empmasters = new SelectList(db.Empmasters Emp_Name Emp_Id); Is there any way to do same.

Ujjval Shukla · Answer

Here Empmasters also showing the Name not ID. ea.Emp_Id = Convert.ToInt32( Empmasters ); I think it is becauseof we have used this- ViewBag.Empmasters = new SelectList(db.Empmasters Emp_Name Emp_Id);

Ravi Patel · Answer

view page $(document).ready(function () $(#Empmasters).change(function () { $(#Text1).val($(#Empmasters option:selected).text()); }); }); And this is the .cshtml view code- @Html.LabelFor(model => model.Empid) @*@Html.EditorFor(model => model.Empid)*@ //@Html.DropDownList(attemp ViewBag.attemp as SelectList -Select Emp ID- new { id=EmpID @Html.DropDownList(Empmasters null --select---- new { @class = dropdown }) }) @Html.ValidationMessageFor(model => model.Empid) @Html.LabelFor(model => model.Ename) @Html.EditorFor(model => model.Ename new {id=name}) @Html.ValidationMessageFor(model => model.Ename) action method [HttpPost] public ActionResult show(Models.att att string Empmasters string Text1 ) { Empat ea = new Empat(); ea.AttID = att.Attid; ea.Emp_Id = Convert.ToInt32(Empmasters); ea.Emp_Name = Text1; ea.Dept = att.dept; ea.AttendMonth = att.attmonth; ea.AttendDate = att.attdate; ea.AttendanceType = att.atttype; db.EmpAttends.InsertOnSubmit(ea); db.SubmitChanges(); return view(); }

Ujjval Shukla · Answer

The value of Empmasters is showing name not ID.I think it is becauseof we have used this- ViewBag.Empmasters = new SelectList(db.Empmasters Emp_Name Emp_Id); [HttpPost] public ActionResult show(Models.att att string Empmasters ) { Empat ea = new Empat(); ea.AttID = att.Attid; ea.Emp_Id = Convert.ToInt32(Empmasters); ea.Emp_Name = att.Ename; ea.Dept = att.dept; ea.AttendMonth = att.attmonth; ea.AttendDate = att.attdate; ea.AttendanceType = att.atttype; db.EmpAttends.InsertOnSubmit(ea); db.SubmitChanges(); return view(); }

Ravi Patel · Answer

Hi try this [HttpPost] public ActionResult show(Models.att att string Empmasters ) { Empat ea = new Empat(); ea.AttID = att.Attid; ea.Emp_Id = Convert.ToInt32(Empmasters); ea.Emp_Name = att.Ename; ea.Dept = att.dept; ea.AttendMonth = att.attmonth; ea.AttendDate = att.attdate; ea.AttendanceType = att.atttype; db.EmpAttends.InsertOnSubmit(ea); db.SubmitChanges(); return view(); }

Ujjval Shukla · Answer

But I am using other Actionresult- [HttpGet] public ActionResult show() { ViewBag.Empmasters = new SelectList(db.Empmasters Emp_Name Emp_Id); return View(); } [HttpPost] public ActionResult show(Models.att att) { Empat ea = new Empat(); ea.AttID = att.Attid; ea.Emp_Id = att.Empid; ea.Emp_Name = att.Ename; ea.Dept = att.dept; ea.AttendMonth = att.attmonth; ea.AttendDate = att.attdate; ea.AttendanceType = att.atttype; db.EmpAttends.InsertOnSubmit(ea); db.SubmitChanges(); return view(); }

Ravi Patel · Answer

Hi  try this [HttpGet] public ActionResult show() { ViewBag.attemp = new SelectList(db.Empmasters  Emp_NameEmp_Id ); } [HttpPost] public ActionResult show(string Empmasters ) // in Empmasters selected drop down value will come { // now you can use this value }

Ujjval Shukla · Answer

Thanks Ravi it is working.but when i insert dropdownlist ID data in database i shows 0 instead of actual ID and throws an error of NULL reference.

Ujjval Shukla · Answer

sorry my mistake first function's open bracket was missing in script. $(document).ready(function () { $(#SecurityUser ).change(function () { $(#Text1).val($(#SecurityUser option:selected).text()); //for id // var selectedValue = $(this).val(); // $(#Text1).val(selectedValue); }); }); script is running but it display the selected data.but i want to display Name not selected id. dropdownlist has IDs when i select an ID the related name should be display in textbox not ID.

Ravi Patel · Answer

ok if alertbox is not popup it means you have not included jquery libray in page now $(document).ready(function () { alert('hello'); $(#Empmasters).change(function () { alert('hello'); $(#Text1).val($(#Empmasters option:selected).text()); }); });

Ujjval Shukla · Answer

Yes dropdownlist is populating data with id.

Ravi Patel · Answer

dropdownlist populated with data or not?

Ravi Patel · Answer

Hi i tried its working for me. may be you are missing something.

Ujjval Shukla · Answer

Hello Ravi It is not working for me.

Ravi Patel · Answer

[HttpGet] public ActionResult show() { ViewBag. Empmasters = new SelectList(db.Empmasters Emp_NameEmp_Id); } This is the script- $(document).ready(function () $(# Empmasters ).change(function () { $(#Text1).val($(# Empmasters option:selected).text()); }); }); And this is the .cshtml view code- @Html.LabelFor(model => model.Empid) @*@Html.EditorFor(model => model.Empid)*@ //@Html.DropDownList(attemp ViewBag.attemp as SelectList -Select Emp ID- new { id=EmpID @Html.DropDownList(Empmasters null --select---- new { @class = dropdown }) }) @Html.ValidationMessageFor(model => model.Empid) @Html.LabelFor(model => model.Ename) @Html.EditorFor(model => model.Ename new {id=name}) @Html.ValidationMessageFor(model => model.Ename)

Ujjval Shukla · Answer

Hi friends Thanx for your reply but it is not working for me. Here I have code- [HttpGet] public ActionResult show() { ViewBag.attemp = new SelectList(db.Empmasters Emp_NameEmp_Id); } This is the script- $(document).ready(function () $(#EmpID).change(function () { $(#Text1).val($(#EmpID option:selected).text()); }); }); And this is the .cshtml view code- @Html.LabelFor(model => model.Empid) @*@Html.EditorFor(model => model.Empid)*@ @Html.DropDownList(EmpID ViewBag.attemp as SelectList -Select Emp ID- new { id=EmpID }) @Html.ValidationMessageFor(model => model.Empid) @Html.LabelFor(model => model.Ename) @Html.EditorFor(model => model.Ename new {id=name}) @Html.ValidationMessageFor(model => model.Ename)

Manas Mohapatra · Answer

Try below code: Make sure that jQuery reference is added to your page. Write below code inside document.ready() $(document).ready(function(){ $(#d ropdownlist ).change(function () { $(#textbox).val( $(#d ropdownlist option:selected).val()); }); }); Here d ropdownlist textbox is ID attribute value of Dropdownlist and textbox respectively.

Ravi Patel · Answer

Hi try this model class public class SecurityUser { [Key] public int securityUserId { get; set; } public string firstName { get; set; } } controller action method public ActionResult my() { DataContext db = new DataContext (); ViewBag.SecurityUser = new SelectList(db.securityuser securityUserId firstName); return View(); } view page @{ ViewBag.Title = my; } my $(document).ready(function () $(#SecurityUser ).change(function () { $(#Text1).val($(#SecurityUser option:selected).text()); //for id // var selectedValue = $(this).val(); // $(#Text1).val(selectedValue); }); }); @Html.DropDownList(SecurityUser null --select---- new { @class = dropdown })

Ranjit Powar · Answer

You can do this in jquery. $(#d ropdownlist ).change(function () { $(#textbox).val( $(#d ropdownlist option:selected).text()); }); If it solve your problem accept it as Correct Answer.

Shuvojit Halder · Answer

Use this jquery code.I think it will work. $(document).on(change#yourdropdownidfunction() { var name=$('#yourdropdownid').text(); if(name!='') { $('#Yourtextboxid').val(name); } });