如何在mvc剃鬚刀中更新兩個局部視圖的最佳方式? 我需要從Ajax調用中更新多個。這裏是更新的主體並且工作正確完成。這是真的嗎?有沒有更好的方法?我嘗試過搜索,但沒有看到任何東西。我做到了,如下所示: 我使用這種方式:在mvc剃鬚刀中更新兩個局部視圖的最佳方式
我的觀點:
@using (Ajax.BeginForm("Information", "Classes",
new AjaxOptions
{
HttpMethod = "get",
}))
{
<div id="Search">
<input type="text" placeholder="Search" id="txtSearch" />
<a id="StartSearch" href="javascript:void(0);" style="background-color: burlywood">Search</a>
</div>
<select id="dropDown">
<option>10</option>
<option>20</option>
<option>30</option>
</select>
<div id="Paging">
@Html.Partial("_PagingNumbers", Model.Page)
</div>
<div id="gridItems">
@{ Html.RenderPartial("ClassesList", Model); }
</div>
}
<script type="text/javascript">
$(document).ready(function() {
$("#StartSearch").click(function() {
changeContent('@Model.Page.CountRecordInPage', $("#txtSearch").val());
});
$("#dropDown").change(function() {
changeContent($("#dropDown").val(), '@Model.Page.TextSearch');
});
function changeContent(count, search) {
var currentUrl = '/' + '@Model.Page.Controller' + '/' + '@Model.Page.ActionName';
var dataForChangeContent = {
typeNo: '@Model.Page.ValueIdParametr',
countryNo: '@Model.Page.CountryNo',
count: count,
search: search
};
$.ajax({
url: currentUrl,
data: dataForChangeContent,
success: function (data) {
$('body').html(data);
}
});
}
});
局部視圖_PagingNumbers:
@model DGM.Common.Page
<script>
function ChangeCurrentPage(obj) {
var page = $(obj).text();
GoToPage(page);
}
function GoToPage(page) {
var dataForChangeCurrentPage = {
'@Model.NameIdParametr': '@Model.ValueIdParametr',
countryNo: '@Model.CountryNo',
count: '@Model.CountRecordInPage',
search: '@Model.TextSearch',
page: page
};
var urlChangeCurrentPage = '/' + '@Model.Controller' + '/' + '@Model.ActionName';
$.ajax({
url: urlChangeCurrentPage,
data: dataForChangeCurrentPage,
success: function (data) {
$('body').html(data);
var requestedUrl = this.url.replace(/[&?]X-Requested-With=XMLHttpRequest/i, "");
history.pushState({ html: '' }, document.title, requestedUrl);
}
});
}
</script>
<div style="margin: 0 auto; text-align: center;">
<div style="display: inline-table">
@{
var countPage = Model.CountPage;
var currentPage = Model.CurrentPage;
}
@for (int i = 1; i < countPage + 1; i++)
{
<a class="scroll-content-item ui-widget-header" onclick=" ChangeCurrentPage(this) " href="javascript:void(0);">@i</a>
}
</div>
</div>
我的控制器:
public ActionResult Information(short No, int count = 10,
int page = 1, string search = "")
{
var Page = new Page();
var ClassesService = new ClassesService();
var viewModeltClasses = new viewModeltClasses();
int totalCountRecord;
if (string.IsNullOrWhiteSpace(search))
{
totalCountRecord = ClassesService.GetCount(d => d.No == No);
viewModeltClasses .AirCraftClasseses = ClassesService.GetMany(d => d.No == No,
page - 1,
count);
}
else
{
Page.IsSearch = true;
Page.TextSearch = search;
var predicateSearch = GetSearchPredicateAirCraftClasses(search, TypeSearch.Contains, No, country);
var predicateOrder = GetOrderPredicateAirCraftClasses();
totalCountRecord = ClassesService.GetCountSearch(predicateSearch.Expand());
viewModeltClasses .AirCraftClasseses = ClassesService.Search(predicateSearch.Expand(), predicateOrder,
page - 1, count);
}
viewModeltClasses .IsAllCountries = country == -1;
Page.AllRecord = totalCountRecord;
Page.CountPage = CommonMethods.GetCountPage(totalCountRecord, count);
Page.NameIdParametr = "No";
Page.ValueIdParametr = No;
Page.CountRecordInPage = count;
Page.ActionName = "ClassesInformation";
Page.Controller = "Classes";
Page.CurrentPage = page;
viewModeltClasses .Page = Page;
return View(viewModeltClasses);
}
編輯:
該程序正常工作。但我想知道這是否是一種系統的方式?我肯定改變了我的身體?
我只需要更改表單中的數據。但它確實改變了整個身體的方式。
如果我寫以下代碼:
$('form').html(data);
數據的表格的被重複。
你的問題到底是什麼?有什麼不工作? –
該程序正常工作。但我想知道這是否是一種系統的方式?我肯定改變了我的身體? – john
我只需要更改表單中的數據。但它確實改變了我在控制器中更改了整個主體 – john