title: Jquery Change event for Drop Down list not being called in Partial view inside Google maps infoview in MVC 5
body: <p>On my ASP.NET MVC index.cshtml page I'm successfully loading a partial view into a google maps info window using ajax like so:</p>
  
  <pre><code>$.ajax({
              url: '/Map/BusForm/@bus.Id',
              success: function(data)
              {
                  infoWindows["@bus.Id"].setContent(data);
              }
          });
  </code></pre>
  
  <p>Then in the partial view I have these form helpers to create drop down lists (this also works, the data is correctly populated and the form submits successfully).</p>
  
  <pre><code>@using (Ajax.BeginForm("BusForm", "Map", new AjaxOptions
  {
      InsertionMode = InsertionMode.Replace,
      UpdateTargetId = "results",
      LoadingElementId = "loader"
  }))
  {
      &lt;h4&gt;Line:&lt;/h4&gt;
      @*@Html.DropDownListFor(x =&gt; x.LineId, Model.GetLines(), "--Choose Train Line--")*@
      @Html.DropDownListFor(x =&gt; x.LineId, Model.GetLines(), "--Choose Train Line--", new { @class = "lineDDL" })
      &lt;h4&gt;Destination: &lt;/h4&gt;
      @Html.DropDownListFor(x =&gt; x.StationId, Model.GetStations(), "--Choose Destination--")
      &lt;div id="loader" style="display:none"&gt;Loading&lt;/div&gt;
      &lt;div id="results"&gt;&lt;/div&gt;
      &lt;input type="submit" value="Save" /&gt;
  }
  </code></pre>
  
  <p></p>
  
  <p>I want to make the values in the second drop down list dependent (cascade) from the first so I need to get the change event. So on Index.cshtml I have this script in the "Scripts Section" but it doesn't get called.</p>
  
  <pre><code>    $(document).ready(function() {
  
          $("#LineId").on("change", function() 
          {
              console.log('change was called');
          });
      });
  </code></pre>