使用 Ajax 将消息的状态从未读更新为已读 - MVC

Question

我正在尝试更新每条消息的状态，从未读到已读，当我点击列表中第一条消息的按钮时，更新状态会起作用，但是当我点击列表中第二条或第三条消息的按钮时，更新状态不会上班。任何人都可以帮助我或指出我正确的方向！提前致谢 ：）看法： <div class="content">    @{ int i = 0;}    foreach (var item in Model.Comment_Lists.GroupBy(l => l.MSG).Select(g => .First()))    {            if (item.se == "Kunde")            {              <div  class="bs-callout bs-callout-success">              <div class="col-xs-3 text-right">              <button data-toggle="collapse"  data-target="#ShowMSG_@i" id="btnChangestu" class="btn btn-sm btn-success btn-icon"></button></div>              <span class="text-muted"><small> @item.Date.ToString("dd/MMMM/yyy")</small></span><br />              <span class="text-muted"><small> @item.MSGType</small></span>              <input type="hidden" name="IDMSG" id="IDMSG" value="@item.id" />              <input type="hidden" name="ChangeStu" id="ChangeStu" value="Read Message" />              <div class="collapse" id="ShowMSG_@i">                  <p><span>@item.MSG </span></p>              </div>              </div>              }                i++;           }         </div>JavaScript：<script>    $(document).ready(function () {            $("#btnChangestu").click(function (e) {            e.preventDefault();                $.ajax({                type: "POST",                url: "/Account/UpdateMSGStatus",                data: {                    IDMSG: $("#IDMSG").val(),                    ChangeStu: $("#ChangeStu").val()                },                dataType: 'json',                success: function (result) {                        if (!$.trim(result)) {                        alert("What follows is blank: ");                    }                    else {                                                    result.ID = IDMSG;                        result.MSGType = ChangeStu;                            console.log("Send");                        }                    },   

Answer 1

重复的id属性是无效的 html，您的 jQuery 选择器（IDMSG: $("#IDMSG").val()等）只会选择带有该id.

在这种情况下没有理由使用隐藏输入。相反，将值作为data属性添加并在.click()事件中读取，然后使用class按钮名称而不是id.

注意我只包含了IDMSG, 不是ChangeStu因为您对该值进行了硬编码

<button data-id="@item.id" class="btn btn-sm btn-success btn-icon edit" data-toggle="collapse" data-target="#ShowMSG_@i></button>

然后脚本变成

$('.edit.).click(function (e) {

    e.preventDefault(); 

    // read the value

    var id = $(this).data('id');

        $.ajax({

            type: "POST",

            url: '@Url.Action("UpdateMSGStatus", "Account"), // don't hard code urls

            data: {

                IDMSG: id,

                ChangeStu: 'Read Message' 

            },

            dataType: 'json',

            success: function (result) {