JQuery, получить текст каждого div, созданного в цикле foreach в ядре asp.net?

Question

Я работаю над проектом Asp.net core, и в моем представлении index.cshtml у меня есть что-то вроде этого

index.cshtml

@model IEnumerable<jquery.Models.Comment>

<div>
    @foreach (var item in Model)
    {
        <ul style="list-style:none;">
            <li>
                <button class="btn btn-success"  id="btnlike">
                @item.LikeCount
            </button>

            <div id="cmid">@item.Id</div>
        </li>
    </ul>
}
</div>


@section Scripts{
<script>
    $(document).delegate('#btnlike', 'click', function (e) {
        e.preventDefault();
        var post_data = $('#cmid').text();

        $.ajax({
            type: 'POST',
            url: '@Url.Action("Like", "Home")',
            data: { 'cid': post_data }
        })
    });
</script>
}

InВ моем представлении index есть цикл foreach, который создает некоторый li, и каждый li содержит button.Я хочу нажать на любую кнопку, чтобы опубликовать @item.id точно так же, как HomeController и Like Действие.Но теперь нажмите любую кнопку, только первый id из div будет опубликован в параметре controller И cid в Like Действие равно 1.

HomeController

public class HomeController : Controller
{
    public IActionResult Index()
    {
        var model = new List<Comment>
        {
            new Comment {Id = 1,LikeCount = 5},
            new Comment {Id = 2,LikeCount =15},
            new Comment {Id = 3, LikeCount = 20},
            new Comment {Id = 4, LikeCount = 14},
        };
        return View(model);
    }

    [HttpPost]
    public IActionResult Like(int cid)
    {
        return View();
    }

Комментарий модели

public class Comment
{
    [Key]
    public int Id { get; set; }

    public int LikeCount { get; set; }

}

Answer 1

Как упоминалось выше, вы не можете дублировать идентификаторы ...

Почему бы не попробовать другой подход:

@model IEnumerable<jquery.Models.Comment>

<div>
    @foreach (var item in Model)
    {
        <ul style="list-style:none;">
            <li>
                <button class="btn btn-success"  onclick="submitPost(@item.Id)">
                @item.LikeCount
            </button>

            <div id="cmid">@item.Id</div>
        </li>
    </ul>
}
</div>


@section Scripts{
<script>
    function submitPost(postId)
    {
        $.ajax({
            type: 'POST',
            url: '@Url.Action("Like", "Home")',
            data: { cid: postId }
        });
    }
</script>
}