jquery - 通过特殊属性Jquery隐藏页面上的按钮

Question

我是网络新手。我有这样的表:

<tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @item.DateStart.ToShortDateString()
                </td>
                <td>
                    @item.DateEnd.ToShortDateString()
                </td>
                <td data-name="@item.Id" data-approved="@item.Approved.ToString()">
                    @item.Approved.ToString()
                </td>                
                <td>
                    @item.FirstName.ToString() @item.LastName.ToString()
                </td>
                <td>
                    @item.Position.ToString()
                </td>

                <td>
                    <button class="btn btn-primary accept-button" data-id="@item.Id">Accept</button>               
                    <button class="btn btn-danger decline-button" data-id="@item.Id"> Decline</button>
                </td>
            </tr>
        }
    </tbody>

我为此页面上的按钮编写了一个脚本:

$(document).ready(function () {
    $('#requestTable').DataTable(
        {
            aoColumns: [
            { mDataProp: "DateStart", sTitle: "Date Start" },
            { mDataProp: "DateEnd", sTitle: "Date End" },
            { mDataProp: "Approved", sTitle: "Approved" },
            { mDataProp: "Data", sTitle: "Employee" },
            { mDataProp: "Position", sTitle: "Position" },
            { mDataProp: "", sTitle: "" }
            ],
            columnDefs: [{
                targets: 'no-sort',
                orderable: false
            }]
        });

    $('button.accept-button').click(function () {
        var id = $(this).attr('data-id')
        var appr = $('td[data-name="' + id + '"]');
        appr[0].textContent = "True";
        $.ajax({
            type: "POST",
            url: "/TableRequest/AcceptRequest",
            data: { 'id': id },
            success: function (msg) {
            }
        });
    });
    var tempId;
    $('button.decline-button').click(function () {
        tempId = $(this).attr('data-id')
        var appr = $('td[data-name="' + tempId + '"]');
        appr[0].textContent = "False";
        $("#dialog").dialog()
    });
    $('button.ok-request').click(function () {
        var message = $('textarea#commentForDecline').val();

        $.ajax({
            type: "POST",
            url: "/TableRequest/DeclineRequest",
            data: { 'message': message, 'id': tempId },
            success: function (msg) {
            }
        });
        $("#dialog").dialog('close');
        $('textarea#commentForDecline').val('');
    });

    hideButtons();

}); 
function hideButtons(){
        // var appr = $('td[data-name="' + id + '"]');
       var appr = $("td[data-approved='false']");
       var 
       if(appr[0].textContent == "True")
       {
           $('button.accept-button').hide();
       }
       if(appr[0].textContent == "False")
       {
           $('button.decline-button').hide();
       }
    };

我想隐藏依赖于表中Approved字段的按钮。如果 @item.Approved.ToString() 为 true - 需要隐藏“接受”按钮，否则 - “拒绝”。谁能帮我吗？

Answer 1

<td>
@if (item.Approved)
{              
    <button class="btn btn-danger decline-button" data-id="@item.Id"> Decline</button>
}
else
{
    <button class="btn btn-primary accept-button" data-id="@item.Id">Accept</button> 
}
</td>

我假设 item.Approved 是一个 bool 值。如果不是，您必须更改 if 子句。