頁面加載后加載局部視圖

Question

我有一個包含加載下拉列表的視圖，當更改下拉列表值時，它將加載包含輸入窗體的下拉列表的局部視圖。 這可以正常工作。

現在，當我打開頁面時，但是已經選擇了下拉值時，我需要加載相同的局部視圖。

但是，當我這樣做時，整個布局將再次加載，而不是局部視圖。 這些都發布回相同的動作。 有誰有主意。

請查看下面的圖像以獲取輸出。

 $('#DbDropdown').on('change', function (evt) { LoadBody(); }); $(window).bind("load", function () { var e = document.getElementById("DbDropdown"); var text = e.options[e.selectedIndex].value; if (text != "Please select") { LoadBody(); } }); function LoadBody() { var url = "GetHeader"; var $Detail = $("#HeaderSection") $.ajax({ data: $("#PRForm").serialize(), type: 'GET', cache: false, dataType: 'html', url: url, success: function (result) { $Detail.html(result); }, error: function (ex) { alert(ex); } }); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> @model PRHeaderVM <section> <h2>Purchase Requesition @Model.PrNumber </h2> <form asp-action="SubmitPR" role="form" id="PRForm" style="width: 100%;top:0;right:0;left: 10px; bottom:10px" enctype="multipart/form-data"> @Html.HiddenFor(x => x.PrNumber) @Html.HiddenFor(x => x.Status) <div style="margin-top : 10px; position:fixed;top:50px;right:50px;width : 150px"> @if (Model.Status == 1) { Html.RenderPartial("_CreateButtonTemplate"); } @if (Model.Status == 2) { Html.RenderPartial("_ApproveButtonTemplate"); } </div> <div class="form-horizontal"> <div class="row"> <div class="col-lg-3"> <div class="form-group"> <div style="padding-bottom: 40px;"> <label class="col-lg-4 control-label">Company</label> <div class="col-lg-8"> <select id="DbDropdown" asp-for="CompanyID" asp-items="@Model.Companies" class="form-control"> <option>Please select</option> </select> </div> </div> </div> </div> </div> <div id="HeaderSection"> </div> </div> </form> </section> 

自己選擇價值

自己選擇價值

從模型 加載的 值從模型 加載的值

Answer 1

下面的答案應該做到這一點（已刪除，請參見注釋）。 再輸入一次：

從jQuery 3.0開始，不推薦使用.bind（）。 您正在第一行.on和第四行.bind使用。 .on替換了.live和.bind，因此您應在每個元素上都使用.on進行將來的開發。

$('#DbDropdown') *.on* ('change', function (evt) {
   LoadBody();
});

$(window) *.bind* ("load", function () {

Answer 2

通過為表單加載ajax調用指定url來解決。

 function LoadPRBody(url) { var $Detail = $("#HeaderSection"); alert($("#PRForm").serialize().toString()); $.ajax({ data: $("#PRForm").serialize(), type: 'GET', cache: false, dataType: 'html', url: url, success: function (result) { $Detail.html(result); }, error: function (ex) { alert(ex); } }); } $('#DbDropdown').on('change', function (evt) { LoadPRBody("GetHeader"); }); $(window).on("load", function () { var val = $('#DbDropdown').val(); alert(val); if (val != 0) { LoadPRBody("@Url.Action("GetHeader", "Requests")"); } }); 

問題似乎是URL沒有正確地加載到進行ajax請求的時間點，因此不知道在哪個控制器中查找動作。