asp.net - How can i get data on change event of dropdownlist in MVC4? -

hi using partial view in mvc. put dropdown in partial view , render partial view in index page.

i have data on change event of dropdown list.i prefer angularjs instead of java script.but not able call controller action view using angularjs.

in controller:

public class homecontroller : athcontroller {     public actionresult index()     {         var dashboardlist = getalldashboards() list<dashboarddefinition>;         return view(dashboardlist);     }     public actionresult getdashboard()     {         return view();     }  ...  ... } 

in view:

@model ienumerable<portal.domain.reportingmodule.reportdefinition.dashboarddefinition>  @{     viewbag.title = "reporting";     layout = "~/views/shared/_layout.cshtml"; }  <h2>reporting view</h2> @html.actionlink("add new chart", "create", "chart", new { area = "reporting" }, null)    @section submenu{     @html.partial("_reportingmenu") } 

in partialview:

@model ienumerable<portal.domain.reportingmodule.reportdefinition.dashboarddefinition> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <div data-ng-app="">     <div class="nav navbar navbar-default navbar-no-margin submenu" data-ng-controller="dashboardcontroller">         <select class="btn btn-default" id="drpdashboard" data-ng-model="dashboard" data-ng-change="dashboardchange(dashboard)">             @foreach (var dashboard in @model)             {                    <option value="@dashboard.id">@dashboard.dashboardname</option>             }         </select>         <a id="submenuintegratornew" class="btn btn-default submenu-item" href="#">             <i class="fa fa-file-o fa-lg"></i>             <span class="submenu-item-text">new</span>         </a>         <a id="submenuintegratorsave" class="btn btn-default submenu-item" href="#">             <i class="fa fa-floppy-o fa-lg"></i>             <span class="submenu-item-text">save</span>         </a>         <a id="submenuintegratorsaveas" class="btn btn-default submenu-item" href="#">             <i class="fa fa-files-o  fa-lg"></i>             <span class="submenu-item-text">save as</span>         </a>         <a id="submenuintegratoraddchart" class="btn btn-default submenu-item" href="#">             <i class="fa fa-picture-o fa-lg"></i>             <span class="submenu-item-text">add chart</span>         </a>     </div> </div> <script type="text/javascript">     function dashboardcontroller($scope) {         $scope.dashboardchange = function (item) {             $http({                 url: "/home/getdashboard",                 method: "get"             });         }     } </script> 

in code checked using debauging dashboardchage metho calling getdashboard action can't call.

you can put drop down inside form , include change attribute dropdown this

@{ html.beginform("action", "controller", formmethod.post, new { enctype = "multipart/form-data" }); } @html.dropdownlist("id", viewdata["id"] list<selectlistitem>, new { onchange = "this.form.submit();" }) @{ html.endform(); }