如果数据表单元格中没有数据,则显示数据表单元格为空

时间:2020-04-24 04:55:29

标签: javascript jquery ajax asp.net-mvc datatable

我正在尝试在数据表中应用return movie函数。 目前,这些功能运行良好。 如果DateReturned单元格中有日期,我只想显示一个简单的文本为“ Movie Returned”,否则我想显示一个按钮,说“ Return Movie”。 这就是我现在所拥有的。 This is my rentals datatable

从数据表中可以看到,我已经具有“返回影片”按钮,如果该行的“返回日期”单元格中有一个值,我只想显示简单文本。

这是我在asp.net中的View / Rentals / Index.cshtml的代码

@model IEnumerable<Vidly.Models.Rental>

@{
    ViewBag.Title = "Rentals";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Rentals </h2>
<p>
    @Html.ActionLink("New Rental", "New", "Rentals", null, new { @class = "btn btn-primary" })
</p>
<table id="rentals" class="table table-bordered table-hover">
    <thead>
        <tr>
            <th>Customer Name</th>
            <th>Movies Rented</th>
            <th>Date Rented</th>
            <th>Date Returned</th>
            <th>Return Movie</th>

        </tr>
    </thead>
    <tbody></tbody>
</table>
@section scripts
{
    <script>
        $(document).ready(function () {
            var table = $("#rentals").DataTable({
                ajax: {
                    url: "/api/newRentals",
                    dataSrc: ""
                },
                columns: [
                    {
                        data: "customer.name"
                    },
                    {
                        data: "movie.name"
                    },
                    {
                        data: "dateRentedFormatted"
                    },
                    {
                        data: "dateReturnedFormatted"
                    },
                    {
                        data: "id",
                        render: function (data) {
                            var objData = table.data();
                            if (!table.data().hasOwnProperty('dateReturnedFormatted')) {
                                return "<button class='btn-link js-delete' data-rented-id=" + data + ">Return Movie</button>";
                            }
                            else {
                                return "<p>Movie Returned</p>";
                            }
                        }
                    },
                ]
            });
            $("#rentals").on("click", ".js-delete", function () {
                var button = $(this);
                bootbox.confirm("Are you sure you want to return this movie?", function (result) {
                    if (result) {
                        $.ajax({
                            url: "/api/newRentals/" + button.attr("data-rented-id"),
                            method: "PUT",
                            success: function () {
                                table.ajax.reload();
                            }
                        });
                    }
                });
            });
        });

    </script>
}

0 个答案:

没有答案