Я получил представление с таблицей и частичное представление с информацией о строке. Когда я нажимаю кнопку, она должна добавить новую строку в таблицу. Мой код работает, как ожидалось, но новая добавленная строка появляется без какого-либо стиля. Добавлена новая строка без стилей родительской таблицы.
@model List<LandPortal.Models.AdditionalLeaseInfo>
@using LandPortal.Models;
<table id='myAdditionalLeaseInfoNewTable' class="table table-striped">
<thead>
<tr>
<th colspan="10" scope="colgroup" style="background-color:lightgray; text-align:center; width:100%">Lease Depth Info</th>
</tr>
<tr style="background-color:whitesmoke">
<th>Landman</th>
<th>Review Complete Date</th>
<th>All Depths</th>
<th>Burket</th>
<th>Marcellus</th>
<th>Utica</th>
<th>Point Pleasants</th>
<th>Depth Summary</th>
<th>Additional Depth Summary</th>
<th>
<button id="loadAdditionalLeaseInfoView" data-url='@Url.Action("NewAdditionalLeaseInfo","Leases")' type="button" class="btn btn-success" onclick="addNewRowPrepend('#loadAdditionalLeaseInfoView','#myAdditionalLeaseInfoNewTable')">
<span class="glyphicon glyphicon-plus-sign"></span>
</button>
</th>
</tr>
</thead>
<tbody>
@foreach (AdditionalLeaseInfo item in Model)
{
{ Html.RenderPartial("~/Views/Shared/Lease/_LeaseDepthInfo.cshtml", item); }
}
</tbody>
</table>
частичный вид
@model LandPortal.Models.AdditionalLeaseInfo
@using (Html.BeginCollectionItem("AdditionalLeaseInfos"))
{
<tr>
<td>
@Html.TextBoxFor(m => m.Landman)
@Html.HiddenFor(m => m.Id)
</td>
<td>
@Html.TextBoxFor(m => m.ReviewCompletedDate)
</td>
<td>
@Html.CheckBoxFor(m => m.AllDepths)
</td>
<td>
@Html.CheckBoxFor(m => m.Burket)
</td>
<td>
@Html.CheckBoxFor(m => m.Marcellus)
</td>
<td>
@Html.CheckBoxFor(m => m.Utica)
</td>
<td>
@Html.CheckBoxFor(m => m.PointPleasant)
</td>
<td>
@Html.TextAreaFor(m => m.DepthSummary, 3, 3, htmlAttributes: new { style = "width: 300px; max-width: 300px;" })
</td>
<td>
@Html.TextAreaFor(m => m.AdditionalDepthSummary, 3, 3, htmlAttributes: new { style = "width: 300px; max-width: 300px;" })
</td>
</tr>
}
Вот мой Java-скрипт для добавления новой строки при нажатии кнопки
function addNewRowPrepend(btnID, tableID) {
var myurl = $(btnID).attr('data-url');
$.ajax({
url: myurl,
success: function (result) {
$(tableID).find('tbody:first').prepend(result);
}
});
}
Вот мой контроллер, который вызывается при нажатии кнопки.
[HttpGet]
public ActionResult NewAdditionalLeaseInfo()
{
return PartialView("~/Views/Shared/Lease/_LeaseDepthInfo.cshtml", new AdditionalLeaseInfo());
}
Вот как это выглядит, я нажимаю кнопку добавления
После обновления моего частичного представления все это работало как положено
@model LandPortal.Models.AdditionalLeaseInfo
<tr>
@using (Html.BeginCollectionItem("AdditionalLeaseInfos"))
{
<td>
@Html.TextBoxFor(m => m.Landman)
@Html.HiddenFor(m => m.Id)
</td>
<td>
@Html.TextBoxFor(m => m.ReviewCompletedDate)
</td>
<td>
@Html.CheckBoxFor(m => m.AllDepths)
</td>
<td>
@Html.CheckBoxFor(m => m.Burket)
</td>
<td>
@Html.CheckBoxFor(m => m.Marcellus)
</td>
<td>
@Html.CheckBoxFor(m => m.Utica)
</td>
<td>
@Html.CheckBoxFor(m => m.PointPleasant)
</td>
<td>
@Html.TextAreaFor(m => m.DepthSummary, 3, 3, htmlAttributes: new { style = "width: 300px; max-width: 300px;" })
</td>
<td>
@Html.TextAreaFor(m => m.AdditionalDepthSummary, 3, 3, htmlAttributes: new { style = "width: 300px; max-width: 300px;" })
</td>
}
</tr>