ajax即时修改

需求：对是否启用进行即时勾选

实现：

News602 新华社新闻 Cotroller中：
        /// <summary>
        /// 修改启用不启用  Enabled 
        /// </summary>
        /// <param name="lcid"></param>
        /// <param name="id"></param>
        /// <param name="enable"></param>
        /// <returns></returns>
        [HttpPost]
        public async Task<IActionResult> EditEnable([FromForm]string lcid, string id, [FromForm]bool enable)
        {
            try
            {
                switch (lcid)   //根据 语言 Lcid 判断
                {
                    case "2052":
                        {
                            var entity = await _context.News2052.FindAsync(id);
                            entity.Enabled = enable;
                            await _context.SaveChangesAsync();
                        }
                        break;
                    case "1033":
                        {
                            var entity = await _context.News1033.FindAsync(id);
                            entity.Enabled = enable;
                            await _context.SaveChangesAsync();
                        }
                        break;
                    case "1034":
                        {
                            var entity = await _context.News1034.FindAsync(id);
                            entity.Enabled = enable;
                            await _context.SaveChangesAsync();
                        }
                        break;
                    case "1025":
                        {
                            var entity = await _context.News1025.FindAsync(id);
                            entity.Enabled = enable;
                            await _context.SaveChangesAsync();
                        }
                        break;
                    case "1049":
                        {
                            var entity = await _context.News1049.FindAsync(id);
                            entity.Enabled = enable;
                            await _context.SaveChangesAsync();
                        }
                        break;
                }
                return Ok();
            }
            catch (Exception)
            {
                throw;
            }
        }        

　　

 

首先是否启用该字段是bool？ 类型 ，得先写一个bool？ 类型的模板

在Shared文件夹下新建 BoolTemplate.cshtml 页面

@model object

@{
    bool value = Convert.ToBoolean(Model);
}

@Html.CheckBox("", value)

　

在显示视图Index.cshtml页面引入该模板    
　　<tbody>
        @foreach (var item in Model as List<CnpiecNRP.Areas.Maintain.ViewModels.AllNewsViewModel>)
        {
            <tr>
                <td>
                    @Html.HiddenFor(modelItem => item.Nid)
                    @Html.HiddenFor(modelItem => item.Lcid)
                    @if ((ViewBag.searchKeyWord as string[]).Length >= 1)  @*多个关键字高亮显示*@

                    {
                        var title = item.SourceTitle;
                        var keywords = ViewBag.searchKeyWord as string[];
                        for (int i = 0; i < (ViewBag.searchKeyWord as string[]).Length; i++)
                        {
                            var current = keywords[i];
                            title = new System.Text.RegularExpressions.Regex(current).Replace(title, "<span style='background:yellow;font-weight: bold;'>" + current + "</span>");
                        }
                        @Html.Raw(title);
                    }
                    else
                    {
                        @Html.DisplayFor(modelItem => item.SourceTitle)
                    }
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.SourcePubDate, "MyDatetime")  @*时间模板*@

                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Enabled, "BoolTemplate") 　　　@*bool? 模板*@ 

                </td>

                <td>  
                    <a asp-action="Edit" asp-route-id="@item.Nid" asp-route-lcid="@item.Lcid">编辑</a> |
                    <a asp-action="Delete" asp-route-id="@item.Nid" asp-route-lcid="@item.Lcid">删除</a>  |
                    <a class="ContentDetails">展开</a>
                </td>
            </tr>
            <tr class="Content">
                <td colspan="4">
                    <h5 style="color:cyan;">详细内容：</h5>
                    <p>@Html.Raw(item.HtmlContext)</p>
                </td>
            </tr>
        }
    </tbody>

　　

显示视图 Index.cshtml 中 ajax 调用
<script>
//选择复选框绑定点击事件
   $(".table.table-hover tbody tr td input[type=checkbox]").on('click', function () {
        var $this = $(this);
        var IsChecked = $(this).is(':checked');  //获取复选框的状态
        var id = $(this).parent().siblings().eq(0).find("[name$=Nid]")[0].value;
        var lcid = $(this).parent().siblings().eq(0).find("[name$=Lcid]")[0].value;  //获取 Nid 和 Lcid 的值

        $.ajax({
            url: "/Maintain/News602/EditEnable/" + id,
            type: "post",
            data: { lcid: lcid, enable: IsChecked },
            success: function (result, state) {
                if (state != "success") {
                    alert("修改启用状态失败");
                    $this.prop("checked", !$this.prop("checked"));
                }
            },

            error: function (result) {
                alert("失败");
            }
        })
    })
</script>