Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Edit: OK so if I understand correctly, your view should look like this:</p> <pre><code>@model HobbyHomesWebApp.ViewModel.LearnerAssociationViewModel @{ Layout = "~/Views/Shared/_LayoutPostLogin.cshtml"; } @using (Html.BeginForm("LearnerAssociation", "Registration", FormMethod.Post)) { @Html.ValidationSummary(true) &lt;table&gt; &lt;tr&gt; &lt;td&gt; &lt;div&gt; @{Html.RenderPartial("_LearnerAssociationWebPartial", Model.learner);} &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;table&gt; &lt;tr&gt; &lt;td&gt; &lt;div id="result"&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; } </code></pre> <p>This means when you first load the page, nothing is displayed in the second <code>div</code>.</p> <p>You then want to load a partial view in to the <code>div</code> based on the value selected. Firstly, add the javascript to call the action you have already described.</p> <pre><code>$('#NameOfYourDropDownList').change(function () { var userid = $('#NameOfYourDropDownList').val(); var ProvincialStateID = $("#State").val(); var Hobbyid = $('#Hobby').val(); var Districtid = $('#DistrictNames').val(); var Homeid = $('#Hobbyhome_EstablishmentId').val(); var urlperson = "@Url.Action('FetchPersonByUserName')"; $.ajax({ type: 'POST', url: urlperson, data: { userid: userid, stateid: ProvincialStateID, hobbyid: Hobbyid, districtid: Districtid, homeid: Homeid }, success: function (data) { $('#result').html(data); } }); }); </code></pre> <p>The <code>ActionResult</code> will return the HTML. In your success function, you are assigning this to be the HTML of the <code>div</code>.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload