Solved

ASP.Net MVC 4 C# -- DropDown List Selected Index Change EVENT ?

Posted on 2013-05-17
4
8,552 Views
Last Modified: 2013-05-31
Does anyone have other MVC examples for the below besides
http://asp-net-samples.blogspot.com/2013/04/dropdown-list-selected-index-change.html ?

Steps
 1. user makes a selection (i.e. "AW - Spec 123")
    from webpage's "Category" dropdown
 2. textbox1 and textbox2 automatically populate
    with details from MS SQL database, erasing previous text
 3. user manually changes textbox1 and textbox2 if needed
0
Comment
Question by:finance_teacher
  • 2
  • 2
4 Comments
 
LVL 16

Expert Comment

by:Stephan
ID: 39176986
Another approach is adding a attribute to the dropdownlist like so:

 @Html.DropDownListFor(model => model.Subbutton_Id, new SelectList(ViewBag.Subbutton, "Id", "series_name"), "-- Select --", new { onchange = "changeTextboxes" })

Open in new window


And add some javascript code:
<script type="text/javascript">
  function changeTextboxes(event) { 
       var selectBox = document.getElementById("Subbutton_Id");
       var tb1 = document.getElementById("textbox1");
       var tb2 = document.getElementById("textbox2");
       if (selectBox.value == "someValue") {
                 tb1.value = "Some value 1";
                 tb2.value = "Some value 2";
       }
  }
</script>

Open in new window


This is just an example. if you have something set you would like to implement it this way, please post the code and we'll make the modifications in order to get it to work.
0
 

Author Comment

by:finance_teacher
ID: 39192056
Do you have an example website showing this ?
0
 

Author Comment

by:finance_teacher
ID: 39200056
Please reply.
0
 
LVL 16

Accepted Solution

by:
Stephan earned 500 total points
ID: 39200343
Sorry for the late response.

I have a very simple version of this using jquery Ajax to set the values.

This is the model:
public class HomeModel
    {
        public string Category { get; set; }
    }

Open in new window


This is the view
@model MvcApplication4.Models.HomeModel
@{

    ViewBag.Title = "Index";
}

<h2>Index</h2>


@Html.DropDownListFor(model => model.Category, ((string[])ViewBag.Categories).Select(x => new SelectListItem { Text = x, Value = x }), new { onchange = "changeTextboxes()" })
<input type="text" id="tb1" />
<input type="text" id="tb2" />
<script type="text/javascript">
    function changeTextboxes() {
        var category = document.getElementById("Category");
        $.post("/Home/GetValues", { category: category.value }, function (data) {
            document.getElementById("tb1").value = data.tb1;
            document.getElementById("tb2").value = data.tb2;
        });
    }
</script>

Open in new window


And this is the controller:
public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            ViewBag.Categories = new string[] { "AW - Spec 123", "AC - Spec 456", "AC - Spec 789" };
            return View();
        }

        public JsonResult GetValues(string category)
        {
            return Json(new { tb1 = category + "tb1", tb2 = category + "tb2" });
        }
    }

Open in new window

0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
User art_snob (http://www.experts-exchange.com/M_6114203.html) encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
In this tutorial you'll learn about bandwidth monitoring with flows and packet sniffing with our network monitoring solution PRTG Network Monitor (https://www.paessler.com/prtg). If you're interested in additional methods for monitoring bandwidt…
This demo shows you how to set up the containerized NetScaler CPX with NetScaler Management and Analytics System in a non-routable Mesos/Marathon environment for use with Micro-Services applications.

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now