title: How to Refresh a part of a Page, based on DropDownList selection in MVC?
body: <p>I'm working on ASP.Net MVC. 
  I have a ViewPage <code>SaveStallMenu.cshtml</code>, which has 2 DropDown Lists
  (MF Dropdown, Stalls Dropdown) and a FilerMenu Button</p>
  
  <p>When the page is loaded for the first time, it holds MenuItem of Stall 1.</p>
  
  <p>Now, My question is, when I select an option from <code>MF Dropdownlist</code> and <code>Stall DropdownList</code>, and click Filter Menu button, the contents in the <code>&lt;div id="partialViewDiv"&gt;&lt;/div&gt;</code> should be refreshed with the Menu Item related to the Stall Selection.</p>
  
  <p>I'm using AJAX for this purpose.</p>
  
  <p>When I click the FilterMenu button</p>
  
  <pre><code> @using (Ajax.BeginForm("uppendStallData", "Admin", new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.Replace, LoadingElementId = "", UpdateTargetId = "partialViewDiv" }))
              {
  }
  </code></pre>
  
  <p>This Should submit my form to <code>uppendStallData</code> ActionMethod, but I don't know why It's not working.</p>
  
  <p>Pardon me, if you find flaws in my explanation of Question. And please try to go through My code and provide your guidance. </p>
  
  <p>I tried many solutions as you can see the Scripts below,but didn't get what I'm trying to do.</p>
  
  <p><strong>Trial 1:</strong>
  If I use above <code>Ajax.BeginForm</code>, then <code>uppendStallData</code>doesn't get ViewModel data POSTed.</p>
  
  <pre><code>[HttpPost]
  public PartialViewResult uppendStallData(AdminVM VM)
  { 
  
      List&lt;StallsModel&gt; data = _provider.GetStallsList();
      VM.StallNameDDl = data.ToDictionary(x =&gt; x.StallId, x =&gt; x.StallName);
  
      List&lt;MFDetailsModel&gt; data1 = _provider.GetMFDetailsList();
      VM.MFNameDDl = data1.ToDictionary(x =&gt; x.Id, x =&gt; x.MFName);
  
      long MFID1 = Convert.ToInt64(VM.StallMenuModel.MFId);
  
      long STallId = Convert.ToInt64(VM.StallMenuModel.StallId);
  
      VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);   
  
      return PartialView("_MenuTabs", VM);
  
  }
  </code></pre>
  
  <p><strong>Trial 2:</strong>
  If I call a  as shown below, on FilterMenu button click, 
      this script sends the dropdownlist selected values to <code>uppendStallData</code>, but after successful execution of the Method in Contoller, fails to return the PartialView and append to <code>&lt;div id="partialViewDiv"&gt;</code>.</p>
  
  <p>With Trial2, my script and contoller method is as follow,</p>
  
  <pre><code>&lt;script&gt;
      $('#Filter').click(function () {
          var MF_Id = $('#StallMenuModel_MFId').val();
          var Stall_Id = $('#StallMenuModel_StallId').val();
  
          $.ajax({
              url: '@Url.Action("uppendStallData", "Admin")',
              data: { MFID: $("#StallMenuModel_MFId").val(), STID: $("#StallMenuModel_StallId").val() },
              type: 'POST',
              success: function (data) {
                  $("#partialViewDiv").html(data);
              }
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>         public PartialViewResult uppendStallData(string MFID,string STID)
           {
  
  
               List&lt;StallsModel&gt; data = _provider.GetStallsList();
               VM.StallNameDDl = data.ToDictionary(x =&gt; x.StallId, x =&gt; x.StallName);
  
               List&lt;MFDetailsModel&gt; data1 = _provider.GetMFDetailsList();
               VM.MFNameDDl = data1.ToDictionary(x =&gt; x.Id, x =&gt; x.MFName);
  
  
               long MFID1 = Convert.ToInt64(MFID);
  
               long STallId = Convert.ToInt64(STID);
  
               VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);    
               return PartialView("_MenuTabs", VM);
           }
  </code></pre>
  
  <p>This is Controller code:</p>
  
  <pre><code>[HttpGet]
  public ActionResult SaveStallMenu()
  {
      AdminVM VM = new AdminVM();
      List&lt;StallsModel&gt; data = _provider.GetStallsList();
      VM.StallNameDDl = data.ToDictionary(x =&gt; x.StallId, x =&gt; x.StallName);
  
      List&lt;MFDetailsModel&gt; data1 = _provider.GetMFDetailsList();
      VM.MFNameDDl = data1.ToDictionary(x =&gt; x.Id, x =&gt; x.MFName);
      VM.StallMenuModel = new StallMenuModel();
  
  
      VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(1);                     
      return View(VM);
  }
  
  
  [HttpPost]
  public PartialViewResult uppendStallData(string MFID,string STID)
  {
  
      List&lt;StallsModel&gt; data = _provider.GetStallsList();
      VM.StallNameDDl = data.ToDictionary(x =&gt; x.StallId, x =&gt; x.StallName);
  
      List&lt;MFDetailsModel&gt; data1 = _provider.GetMFDetailsList();
      VM.MFNameDDl = data1.ToDictionary(x =&gt; x.Id, x =&gt; x.MFName);
  
  
      long MFID1 = Convert.ToInt64(MFID);
  
      long STallId = Convert.ToInt64(STID);
  
      VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);    
      return PartialView("_MenuTabs", VM);
  
  }
  </code></pre>