jquery - HTML MVC C# Using a DropDownListFor to populate a ListBoxFor -

i'm having problems here. user select team dropdownlist , have method through jquery or something, populate list box. want show players team can trade them team.

what have set up: trade players view

currently, have made showing players in listbox. need display nothing until user selects team.

code tradeplayersview:

@model baseball.models.viewmodels.tradevm @{     viewbag.title = "tradeplayers"; }  <h2 align="center">trade players</h2>  <div class="col-xs-12" align="center">     <div class="row">         @using (html.beginform())         {             <div class="col-sm-6 col-lg-offset-3">                 <div class="panel panel-primary">                     <div class="panel-heading">                         <h4 class="panel-title">select teams</h4>                     </div>                     <div class="panel-body">                         <div class="form-group">                             <label>trade player team:</label>                             @html.dropdownlistfor(m => m.team1.id, model.team1items, "-choose team-", new { @class = "form-control" })                             @html.listboxfor(m => m.players1, model.players1, new { @class = "form-control" })                         </div>                         <div class="form-group">                             <label>to team:</label>                             @html.dropdownlistfor(m => m.team2.id, model.team2items, "-choose team-", new { @class = "form-control" })                             @html.listboxfor(m => m.players1, model.players1, new { @class = "form-control" })                         </div>                          <button class="btn btn-sm btn-success">trade</button>                         @html.actionlink("cancel", "index", "home", null, new { @class = "btn btn-sm btn-danger" })                     </div>                 </div>             </div>         }     </div> </div> <br/> 

code tradevm:

public class tradevm     {         public team team1 { get; set; }         public team team2 { get; set; }         public list<selectlistitem> players1 { get; set; }         public list<selectlistitem> players2 { get; set; }         public list<selectlistitem> team1items { get; set; }         public list<selectlistitem> team2items { get; set; }          public tradevm()         {             players1 = new list<selectlistitem>();             players2 = new list<selectlistitem>();             team1 = new team();             team2 = new team();             team1items = new list<selectlistitem>();             team2items = new list<selectlistitem>();         }          public void setplayer1items(ienumerable<player> players)         {             foreach (var player in players)             {                 players1.add(new selectlistitem()                 {                     value = player.id.tostring(),                     text = player.lastname                 });             }         }          public void setplayer2items(ienumerable<player> players)         {             foreach (var player in players)             {                 players2.add(new selectlistitem()                 {                     value = player.id.tostring(),                     text = player.lastname                 });             }         }          public void setteam1items(ienumerable<team> teams)         {             foreach (var team in teams)             {                 team1items.add(new selectlistitem()                 {                     value = team.id.tostring(),                     text = team.name                 });             }         }          public void setteam2items(ienumerable<team> teams)         {             foreach (var team in teams)             {                 team2items.add(new selectlistitem()                 {                     value = team.id.tostring(),                     text = team.name                 });             }         }     } 

i can't find answer around.. appreciate answers.

edit: should have included code in controller.

[httpget]         public actionresult tradeplayers()         {             var trade = new tradevm();             var manager = new teammanager();             var playermanager = new playermanager();              //var team1 = manager.getteambyid(trade.team1.id);             //var team2 = manager.getteambyid(trade.team2.id);             //var player1 = team1.players;             //var player2 = team2.players;              trade.setteam1items(manager.getallteams());             trade.setteam2items(manager.getallteams());             trade.setplayer1items(playermanager.getallplayers());             trade.setplayer2items(playermanager.getallplayers());              // need specify players team.              return view(trade);         }          //work in progress         //[httppost]         //public actionresult tradeplayers(tradevm trade)         //{         //    var manager = new teammanager();         //    manager.tradeplayers(trade.team1, trade.team2, trade.team1.player, trade.team1.player);         //    return redirecttoaction("teams");         //}