title: Running MVC application on IIS behaves differently than on running Visual studio localhost
body: <p>I have asp.net mvc application deployed as application under one website in IIS.</p>
  
  <p><strong>Controller:</strong></p>
  
  <pre><code>public ActionResult Index()
  {
      List&lt;SelectListItem&gt; ddlCountry = countryService.GetCountries().Select(d =&gt; new SelectListItem() { Text = d.Name, Value = d.Id.ToString() }).ToList();
      ddlCountry.Insert(0, new SelectListItem() { Text = string.Empty, Value = string.Empty });
      ViewData["ddlCountry"] = ddlCountry;
  }
  
  public ActionResult GetCities(int Id)
  {
      if (!Convert.ToBoolean(ConfigurationManager.AppSettings["InDev"]))
      {
          return Redirect("http://example.com/");
      }
      var list = cityService.GetCities(Id).Select(d =&gt; new {Id = d.Id, Name = d.Name }).ToList();
      return Json(list, JsonRequestBehavior.AllowGet);
  }
  </code></pre>
  
  <p><strong>View:</strong></p>
  
  <pre><code>&lt;tr&gt;
      &lt;td&gt;@Html.LabelFor(model =&gt; model.CountryId, "Country Name")&lt;/td&gt;
      &lt;td&gt;@Html.DropDownListFor(model =&gt; model.CountryId, ViewData["ddlCountry"] as List&lt;SelectListItem&gt;)&lt;/td&gt;
      &lt;td&gt;@Html.ValidationMessageFor(model =&gt; model.CountryId)&lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
      &lt;td&gt;@Html.LabelFor(model =&gt; model.CityId, "City Name")&lt;/td&gt;
      &lt;td&gt;@Html.DropDownListFor(model =&gt; model.CityId, ViewData["ddlCity"] as List&lt;SelectListItem&gt;)&lt;/td&gt;
      &lt;td&gt;@Html.ValidationMessageFor(model =&gt; model.CityId)&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p><strong>JavaScript:</strong></p>
  
  <pre><code>$(document).ready(function () {
  
      $('#CountryId').change(function () {
          loadDropDown("CityId", "BookingRequest/GetCities/" + $('#CountryId').val())
          $('#AreaId').html($('&lt;option&gt;&lt;/option&gt;').val("").html(""));
      });
  
      function loadDropDown(destinationId, Url) {
          $.getJSON(Url, function (data) {
              $('#' + destinationId).html($('&lt;option&gt;&lt;/option&gt;').val("").html(""));
              $.each(data, function (index, item) {
                  $('#' + destinationId).append(
                       $('&lt;option&gt;&lt;/option&gt;').val(item.Id).html(item.Name)
                   );
              });
          });
      }
  });
  </code></pre>
  
  <p>When I deployed it to IIS as an application under website it loads the cities properly. URL was like <code>http://www.example.com/applicationname/BookingRequest</code>. and When I change the country dropdown value it executes get on <code>http://www.example.com/applicationname/BookingRequest/GetCities/2</code> and all things are working fine.</p>
  
  <p>but when I hit run on the visual studio it and change the country it executes getCities on wrong URL: <code>http://localhost:506084/BookingRequest/BookingRequest/GetCities/2</code></p>
  
  <p>My question is why this behaves differently on the localhost running from the visual studio and on the IIS? Is it due to the deployment as web application inside the website at IIS? Or is it anything to do with my browser?</p>
  
  <p>Here is snap of that request from web developer tool of IE.</p>
  
  <p><img src="https://i.stack.imgur.com/kr7vr.png" alt="enter image description here"></p>