我如何告诉 ajax 选择从列表中单击的项目

Question

Im trying to make a list of people in vacations and I want to calculate their date of return when i click the "Data de Regresso" link. I managed to do that but when I click any of the buttons in the list it always passes the first ID in the list and not the ID of the item I clicked. I'm kinda new to this. I would really aprecciate any help. Im using asp.net framework MVC 5.

Here is the View Code:

<div class="col-4">
    <div class="card">
        <div class="card-header text-white" style="background-color: #4d4d4f;">
            Férias
        </div>
        <div class="card-body">
            <table class="table">
                <thead>
                    <tr>
                        <td>Nome</td>
                        <td></td>
                    </tr>
                </thead>
                <tbody>
                    @if (Model.PessoasDFVM.Count == 0)
                    {
                        <tr>
                            Ninguém de férias.
                        </tr>
                    }
                    else
                    {
                        foreach (PortalInternoBBG.Web.Models.HomePage.PessoaDFVM pessoaDeFerias in Model.PessoasDFVM)
                        {
                            <tr>
                                <td>@pessoaDeFerias.Nome</td>
                                <td>
                                    <div id="ResponseDiv">
                                        <a href="#" onclick="GetDataDeRetorno('@pessoaDeFerias.IDstring')">
                                            Data de Regresso
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        }
                    }
                </tbody>
            </table>
        </div>
    </div>

And the ajax function:

    function GetDataDeRetorno(id) {
        var stringID = id;
        $.ajax({
            url: urlCalculaDataDeRetorno,
            data: { "id": stringID },
            type: "POST",
            success: function (data) {
                $('#ResponseDiv').replaceWith("<div>" + data + "</div>");
            },
            failure: function (response) {
                alert(response.responseText);
            },
            error: function (response) {
                alert(response.responseText);
            }
        });
    }

Answer 1

Append div class with the unique Id so that you will change the div data in ajax response with the help of it.

Please change the below code in html.

<div class="ResponseDiv_@pessoaDeFerias.IDstring">
   <a href="#" onclick="GetDataDeRetorno('@pessoaDeFerias.IDstring')">
   Data de Regresso
   </a>
</div>

and in ajax success with the below code

success: function (data) {
                $('.ResponseDiv_' +stringID).replaceWith("<div>" + data + "</div>");
            }