title: populate drop down list with Jquery on button click in mvc
body: <p>I am very new to jQuery, is there by any chance some code using jQuery that I can use to populate a drop-down list with in MVC?</p>
  
  <p>I am using MVC models to populate drop-down lists at the moment. How can I populate a drop-down list with jQuery to avoid posting back to the server?</p>
  
  <p>At the moment I am using json as follows:</p>
  
  <p>Controller:</p>
  
  <pre><code>   [AcceptVerbs(HttpVerbs.Post)]
      public JsonResult GetTeams(StatisticModel model)
      {
          StatisticModel newModel = new StatisticModel(model.leagueId);
          var teams = newModel.getTeams;
          return Json(teams);
  }
  </code></pre>
  
  <p>View:</p>
  
  <pre><code>&lt;%: Html.DropDownListFor(model =&gt; model.leagueId, Model.getLeagues, new { @class = "dropdownlistLeagueStyle" })%&gt;&lt;/td&gt;&lt;td&gt;&lt;input id="leagueButton" class="loginButton" value="GetTeams" type="submit" /&gt;
  
  &lt;select id="LeagueTeams"&gt;&lt;/select&gt;
  </code></pre>
  
  <p>Javascript</p>
  
  <pre><code>$(function() {
  $(".dropdownlistLeagueStyle").change(function () {
      $.getJSON("/Admin/GetTeams", { LeagueId: $(".dropdownlistLeagueStyle").val() },
    function (teams) {
        $("#LeagueTeams").empty();
        $.each(teams, function (i, team) {
           $("#LeagueTeams").append($("&lt;option&gt;" + team.Text + "&lt;/option&gt;"));
       });
    });
    });
    })
  </code></pre>
  
  <p>However, I am getting an "expecting more source characters" error in the last bracket, and getting this data when testing:</p>
  
  <pre><code>[{"Selected":false,"Text":"Arsenal","Value":"1"},
  {"Selected":false,"Text":"Aston Villa","Value":"3"},
  {"Selected":false,"Text":"Cardiff City","Value":"20"},
  {"Selected":false,"Text":"Chelsea","Value":"4"},
  {"Selected":false,"Text":"Crystal Palace","Value":"22"}, 
  {"Selected":false,"Text":"Everton","Value":"5"},
  {"Selected":false,"Text":"Fulham","Value":"6"},
  {"Selected":false,"Text":"Hull City","Value":"21"},
  {"Selected":false,"Text":"Liverpool","Value":"7"},
  {"Selected":false,"Text":"Manchester City","Value":"8"},
  {"Selected":false,"Text":"Manchester United","Value":"9"},
  {"Selected":false,"Text":"Newcastle United","Value":"10"},
  {"Selected":false,"Text":"Norwich","Value":"11"},
  {"Selected":false,"Text":"Southampton","Value":"13"},
  {"Selected":false,"Text":"Stoke City","Value":"14"},
  {"Selected":false,"Text":"Sunderland","Value":"15"},
  {"Selected":false,"Text":"Swansea City","Value":"16"},
  {"Selected":false,"Text":"Tottenham Hotspur","Value":"17"},
  {"Selected":false,"Text":"West Bromwich Albion","Value":"18"},
  {"Selected":false,"Text":"West Ham United","Value":"19"}]
  </code></pre>
  
  <p>Not in the drop down list </p>