Блог

Я новичок в asp.net core и im работают над проектом, в котором я должен создать страницу, на которой я должен создать дублирующую страницу вкладки на основе номера. пользователь вводит номер в текстовое поле, и на основе номера должны быть созданы элементы вкладки, которые содержат те же элементы формы. Я попытался создать страницу вкладки, но не смог продолжить следующий шаг, пожалуйста, помогите мне с этим. заранее спасибо

я создал частичное представление в следующем коде, это модель, которую я передаю своему представлению в виде списка:

 public class DbContent : ContentPage
{
    public string Name { get; set; }
    public string Age { get; set; }
    public bool Gender{ get; set; }

    public string treatment{ get; set; }
    public List<string> treatmentlist{ get; set; }
}
  

в cshtml я вызвал свои модели и попытался создать вкладку на основе списка обработки

 <div class="example">

<!-- Nav tabs -->
<ul class="nav nav-tabs">
    foreach (var merit in item.treatmentlist)
                                 {
                                     <li>@treatmentlist</li>
                                 }
</ul>
</div>
  

до сих пор я пытался создать страницу динамической вкладки, но после этого мне нужно добавить элементы управления, аналогичные всем страницам вкладок.

Я остановился здесь, может кто-нибудь, пожалуйста, помогите мне, как скопировать элементы управления, размещенные в tab1, на все вкладки, например, создать дубликат или клонировать элементы управления.

Заранее спасибо

Предоставленный вами код все еще не завершен для воспроизведения вашей проблемы.

Я привел пример, основанный на моем понимании, вы можете ознакомиться с приведенными ниже кодами:

Index.cshtml:

 @{
    ViewData["Title"] = "Index";
}

<h1>Index</h1>

<div class="row">
    <div class="col-md-4">
        <div class="form-group">
            <label class="control-label">TabNumber:</label>
            <input id="tabNumber" type="text" class="form-control" />
        </div>
        <div class="form-group">
            <button id="addTab" class="btn btn-primary">Add Tab</button>
        </div>
    </div>

</div>


<ul class="nav nav-tabs" id="myTab" role="tablist">
    <li class="nav-item">
        <a class="nav-link active" id="tab-1" data-toggle="tab" href="#tab1" role="tab" aria-selected="true">Tab1</a>
    </li>
</ul>
<div class="tab-content" id="myTabContent">
    <div class="tab-pane fade show active" id="tab1" role="tabpanel" aria-labelledby="tab-1">
        @await Html.PartialAsync("_FormPartial")
    </div>
</div>

@section scripts{
    <script>
        $("#addTab").on("click", function () {
            var count = $("#myTab li").length;
            var tabnumber = $("#tabNumber").val();
            for (var i = 0; i < tabnumber; i  ) {
                count  ;
                var newTab = "<li class='nav-item'><a class='nav-link' id ='tab-"   count   "' data-toggle='tab' href ='#tab"   count   "' role ='tab' aria-selected='false'>Tab"   count   "</a ></li >"
                $("#myTab").append(newTab);
                var newTabContent = "<div class='tab-pane fade' id='tab"   count   "' role='tabpanel' aria-labelledby='tab-"   count   "'></div>"
                $("#myTabContent").append(newTabContent);
                loadContent(count)
            }
        })

        function loadContent(i) {
            var count = i;
            $.ajax({
                method: 'get',
                url: '/Tab/GetNewTab',
                success: function (res) {
                    $("#tab"   count).append(res);
                }
            });
        }
    </script>
}
  

_FormPartial.cshtml(частичное представление):

 @model User

<div class="row">
    <div class="col-md-4">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Age" class="control-label"></label>
                <input asp-for="Age" class="form-control" />
                <span asp-validation-for="Age" class="text-danger"></span>
            </div>

            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>
  

Результат: