Я изо всех сил пытаюсь найти способ получить содержимое в одной из моих «вкладок» из действия, отличного от моего индекса.
<ul class = "nav nav-tabs" id = "myTab" role = "tablist">
<li class = "nav-item">
@Html.ActionLink("Analysis History", "Index", "Feedback", new { Tab = "Analysis" }, new { @class = "nav-link active" })
</li>
<li class = "nav-item">
@Html.ActionLink("Pending Analysis Requests", "PendingList", "Feedback", new { Tab = "Pending" }, new { @class = "nav-link active" })
</li>
</ul>
<div class = "tab-content" id = "myTabContent">
<div class = "tab-pane fade @(ViewBag.Hash == "Analysis" ? "show active" : "")" id = "Analysis" role = "tabpanel" aria-labelledby = "Analysis-tab">
<div> .... </div> // WORKS FINE
</div>
<div class = "tab-pane fade @(ViewBag.Hash == "Pending" ? "show active" : "")" id = "Pending" role = "tabpanel" aria-labelledby = "Pending-tab">
<div>
//HERE I WANT THE RESULT FROM PENDINGLIST ACTION
</div>
</div>
</div>
Действие
public async Task <IActionResult> PendingList (int AnalysisPage = 1, string Tab = "Pending")
{
ViewBag.Hash = Tab;
//POPULATING THE MODEL
return PartialView("_PendingAnlaysisRequestsList", model);
}
Партиал _PendingAnlaysisRequestsList содержит таблицу для отображения содержимого модели.
ps: в действии index я устанавливаю ViewBag.Hash, и все действие возвращает view()
Является ли использование ajax единственным решением или есть другие способы?
любые предложения приветствуются!
На мой взгляд, я предлагаю вам использовать содержимое ajax и вкладки для достижения ваших требований, вы можете использовать ajax для загрузки представления и создания гиперссылки для их отображения.
Более подробную информацию вы можете найти в приведенных ниже кодах:
Примечание. Вы должны заменить URL-адрес ajax своим собственным URL-адресом.
<div>
<ul class = "nav nav-tabs justify-content-center">
<li class = "nav-item">
<a class = "nav-link active" data-toggle = "tab" role = "tab" aria-controls = "Analysis" id = "Analysislink"
href = "#Analysis">Analysis</a>
</li>
<li class = "nav-item">
<a class = "nav-link" data-toggle = "tab" role = "tab" aria-controls = "Pending" id = "Pendinglink"
href = "#Pending">Pending</a>
</li>
</ul>
</div>
<div class = "tab-content" id = "myTabContent">
<div class = "tab-pane fade show active" id = "Analysis" role = "tabpanel" aria-labelledby = "Analysis-tab">
</div>
<div class = "tab-pane fade" id = "Pending" role = "tabpanel" aria-labelledby = "Pending-tab">
</div>
</div>
@section scripts
{
<script src = "~/lib/jquery-ajax-unobtrusive/jquery.unobtrusive-ajax.js"></script>
<script>
$("#Analysislink").click(function () {
$.ajax({
url: "/Staff/Onboarding/[email protected]",
type: "get",
success: function (result) {
$("#Analysis").html(result);
}
})
});
$("#Pendinglink").click(function () {
$.ajax({
url: "/Staff/Onboarding/Biodata",
type: "get",
success: function (result) {
$("#Pending").html(result);
}
})
});
$(function () {
$.ajax({
url: "/Staff/Onboarding/[email protected]",
type: "get",
success: function (result) {
$("#Analysis").html(result);
}
})
})
</script>
}
Результат:
Если вы считаете, что мой ответ помог вам, отметьте его как ответ, чтобы другим людям, столкнувшимся с той же проблемой, было легче найти решение. Спасибо.
Я решил это просто с помощью следующих модификаций:
Список ожидающих действий
public async Task <MyIndexModel> PendingList (int AnalysisPage, string Tab)
{
ViewBag.Hash = Tab;
//POPULATING THE MODEL
return model;
}
Индексное действие:
if (Tab == "Analysis")
{
//POPULATING THE MODEL WITH DEFFERENT DATA
}
if (Tab == "Pending")
{
model = PendingList(AnalysisPage,Tab).Result;
}
Вид:
<ul class = "nav nav-tabs" id = "myTab" role = "tablist">
<li class = "nav-item">
@Html.ActionLink("Analysis History", "Index", "Feedback", new { Tab = "Analysis" }, new { @class = "nav-link active" })
</li>
<li class = "nav-item">
@Html.ActionLink("Pending Analysis Requests", "PendingList", "Feedback", new { Tab = "Pending" }, new { @class = "nav-link active" })
</li>
</ul>
<div class = "tab-content" id = "myTabContent">
<div class = "tab-pane fade @(ViewBag.Hash == "Analysis" ? "show active" : "")" id = "Analysis" role = "tabpanel" aria-labelledby = "Analysis-tab">
<div> .... </div> // WORKS FINE
</div>
<div class = "tab-pane fade @(ViewBag.Hash == "Pending" ? "show active" : "")" id = "Pending" role = "tabpanel" aria-labelledby = "Pending-tab">
<div>
//HERE I LISTED THE RESULT IN A TABLE
</div>
</div>
</div>
С наилучшими пожеланиями
Большое спасибо, я ценю вашу помощь!