Thursday, April 25, 2013

DropDown List Selected Index Change Event In MVC 3 Razor



 View:



<script type=”text/javascript”>
    $(document).ready(function () {
        $("#cat_type_id").change(function () {

            var url = '@Url.Content("~/")' + "Home/CatType_SelectedState";
            var ddlsource = "#cat_type_id";
            var ddltarget = "#Subbutton_Id";
            $.getJSON(url, { id: $(ddlsource).val() }, function (data) {
                $(ddltarget).empty();
                $.each(data, function (index, optionData) {
                    $(ddltarget).append("<option value='" + optionData.Value + "'>" + optionData.Text + "</option>");
                });

            });
        });
    });


</script>

<div>
            <div class="td_l">
                Category Type
            </div>
            <div class="td_r">                             
                @Html.DropDownListFor(model => model.cat_type_id,new SelectList(ViewBag.CategoryType, "Id", "Type_Name"), "-- Select --")     
            </div>
        </div>

         <div>
            <div class="td_l">
                Pet Category
            </div>
            <div class="td_r">
                @Html.DropDownListFor(model => model.Subbutton_Id, new SelectList(ViewBag.Subbutton, "Id", "series_name"), "-- Select --")  
                @Html.ValidationMessageFor(model => model.Subbutton_Id)
            </div>
        </div>

Controller:


public JsonResult CatType_SelectedState(string id)
        {
            int cid = int.Parse(id);
            JsonResult result = new JsonResult();          
            result.Data = GetSubbuttonsSelectListItem(cid);
            result.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
            return result;
        }

        private List<SelectListItem> GetSubbuttonsSelectListItem(int cat_type_id)
        {
            var subbutton = (from subbtn in _SubbuttonService.GetSubbuttonByCatTypeID(cat_type_id)           
                             select new SelectListItem
                             {
                                 Text = subbtn.series_name,
                                 Value = subbtn.Id.ToString()
                             }).ToList();

            return subbutton;
        }