javascript - 如何在 jquery 的表格中找到与单击按钮相关的 数据？

Question

这是用户界面

我想要的是，当用户单击任何“批准”或“拒绝”按钮时，我想获取该特定行的“备注”值。

这是我目前的 cshtml 代码

@model IEnumerable<HrmsMvc.Models.DataContext.LeaveRecord>

@{
    using (Html.BeginForm())
    {
    <fieldset>
        <legend>Approve Leave</legend>

        <div style="font-family: Verdana; font-size: 10px;"overflow-scrolling: auto>

            @{
            if (Model != null)
            {
                <table>

                    <thead>
                        <tr>
                            <th>Apply Date</th>
                            <th>Name</th>
                            <th>From</th>
                            <th>To</th>
                            <th>Type</th>
                            <th>Reason</th>
                            <th>Status</th>
                            <th>Remarks</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>

                    @{
                        try
                        {
                            foreach (var leave in Model)
                            {
                                <tr>
                                    <td>@Html.LabelForModel(leave.ApplicationDate.Value.ToString("dd-MMM-yyyy"))</td>
                                    <td>@Html.LabelForModel(leave.EmployeeInfo.FullName)</td>
                                    <td>@Html.LabelForModel(leave.EffectiveFrom.Value.ToString("dd-MMM-yyyy"))</td>
                                    <td>@Html.LabelForModel(leave.EffectiveTo.Value.ToString("dd-MMM-yyyy"))</td>
                                    <td>@Html.LabelForModel(leave.LeaveType)</td>
                                    <td>@Html.LabelForModel(leave.Reason)</td>
                                    <td>@Html.LabelForModel(leave.LeaveStatus)</td>
                                    <td>
                                        <input type="text" style="width: 200px;" data-text-id="@leave.LeaveRecordID" />
                                    </td>
                                    <td style="display: block; width: 200px;">
                                        <input type="submit" style="width: 80px; height: 25px; background-color: greenyellow;" value="Approve" data-id="@leave.LeaveRecordID" />
                                        <input type="submit" style="width: 80px; height: 25px; background-color: lightcoral;" value="Reject" data-id="@leave.LeaveRecordID" />
                                    </td>
                                </tr>    
                            }
                        }
                        catch
                        {

                        }
                    }
                    </tbody>
                </table>
            }

            }

        </div>

    </fieldset>
    }
}




@section scripts
{
    <script type="text/javascript">

        var leaveRecordId = 0;
        var applicantEmid = "";
        var leaveType = "";
        var applicationDate = "";
        var leaveStatus = "Pending";
        var reason = "";
        var entryEmid = "";
        var entryDate = "";
        var lastUpdateEmid = "";
        var lastUpdateDate = "";
        var effectiveFrom = "";
        var effectiveTo = "";

        $(document).ready(function () {
                   // here I want to get the button and the related remarks data
            });


        });

    </script>

}

每个按钮都有一个包含相关 RecordID 的 data-id 属性。我不明白如何得到这个或从哪里开始？

Answer 1

只需给批准和拒绝按钮类 'btn' 并尝试以下答案:

$(.btn).click(function(){
  var textvalue = $(this).closest('tr').find('td').eq(7).find('input[type=text]').val();
});

或者如果你想在点击时获得按钮的 RecordID 然后这样做:

$(.btn).click(function(){
  var id = $(this).attr("data-id");
});