Question

我有一个应用程序，可以为慈善机构捐赠房屋。

我正在使用一个只显示信息的表格，在我的页面底部我有一个总数，这只是看起来不漂亮的文字。

我更喜欢附着在我的细胞上，最好是在我桌子的右下角。

除了W3Schools教程之外我无法找到任何可以帮助我做的事情，这个教程增加了一个带按钮的新单元格，这是我不想要的。

这是我的HTML（旁注：我使用C＃和Razor）

@using (Html.BeginForm("Index", "Donations", FormMethod.Get))
{ <div>
        <fieldset>
            <table style="border:none">
                <tr>
                    <td><label class="editor-label">Search Address:</label></td>
                    <td id="searchBar1">@Html.TextBox("SearchStringAddress")</td>
                    <td><label class="editor-label">Search House ID:</label></td>
                    <td></td>
                    <td id="searchBar2">@Html.TextBox("SearchStringHouseNumber")</td>
                    <td>
                        <input type="submit" value="Search" />

                    </td>
                </tr>
               </table>
            @if (TempData["Error"] != null)
            {
                <div style="color:red">@TempData["Error"]</div>
            }


        </fieldset>
    </div>

        <h2>List of Donations</h2>

        <p>
            <u> @Html.ActionLink("Add New Donation", "Create")</u>
        </p>
        <table class="tftable" id="tftable">
            <tr>
                <th>
                    @Html.DisplayName("Church Name")
                </th>
                <th>
                    @Html.DisplayName("House ID")
                </th>
                <th>
                    @Html.DisplayName("House Address")
                </th>
                <th>
                    @Html.DisplayName("Type of Donation")
                </th>
                <th>
                    @Html.ActionLink("Date Recieved", "Index", new { sortOrder = ViewBag.DateSortParm })
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Amount)
                </th>
                <th>
                    @Html.DisplayName("TOTAL")
                </th>

            </tr>

            @if (Model != null)
            {
                foreach (var item in Model)
                {
                    {
                        runningTotal += item.Amount;
                    }
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.Church.Name)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.HouseId)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.House.AddressLine1)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.TypeOfDonation)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.DateRecieved)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Amount)
                        </td>


                    </tr>
                }
            }


        </table>


        <b>TOTAL: @runningTotal </b>
}

有没有办法解决这个问题？

Answer 1

如果您被允许使用Javascript，您可以使用简单的javascript将td元素添加到现有表中：

var node = document.createElement("td");
var textnode = document.createTextNode("Some Text");
node.appendChild(textnode);
document.querySelector("table #row1").appendChild(node);

例如，您可以使用fetch或xmlhttprequest并在服务器中查询数据，然后遍历返回的json / xml / txt以向表中添加新元素。

如何将单元格动态添加到已定义的表

1 个答案: