通过来自ajax调用的AnitForgeryToken触发来自checkboxfor的更新操作

时间:2018-08-13 21:07:32

标签: javascript c# jquery ajax asp.net-mvc-5

我有一个从实体中获取所有数据的视图:

@model MyApplication.Application.TableModel<Entities.FPDrinkingWater>
@{
Layout = null;

var insertionMode = InsertionMode.Replace;
var fail = "displayFailure";
var target = "UnverifiedDrinkingWatersContent";
var ajax = "UnverifiedDrinkingWaterLogLoader";
var verify = Html.UserHasClaim("FP/DrinkingWater/VerifyDrinkingWater");
var action = "VerifyDrinkingWater";
string form = action + "Form";
}

<br />

@if (Model != null && Model.Alert != null && Model.Alert.Message != null)
{
@Html.Alert(Model.Alert)
}

@MyHelper.Loader(ajax)

<div class="form-group">
<table id="UnverifiedDrinkingWaterTable" class="table table-hover">
    <thead>
        <tr>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().SID)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Location)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Replicate)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().CollectionDate) 
   </th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().CollectionTime) 
   </th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Collectors)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Clorinated)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Comments)</th>
            <th>@Html.LabelFor(m => m.Data.FirstOrDefault().Verified)</th>
        </tr>
    </thead>
    <tbody>

        @for (int i = 0; i < Model.Data.Count(); i++)
        {
            using (Ajax.BeginForm(actionName: action, routeValues: null,

    htmlAttributes: new { id = form, @class = "form-horizontal" }, 
ajaxOptions: 
new AjaxOptions
            {
                InsertionMode = InsertionMode.Replace,
                UpdateTargetId = target,
                OnSuccess = "success",
                LoadingElementId = ajax
            }))
            {
                @Html.AntiForgeryToken()

                <tr>
                    <td>@Html.DisplayFor(m => m.Data[i].SID)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].Location)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].Replicate)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].CollectionDate)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].CollectionTime)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].Collectors)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].Clorinated)</td>
                    <td>@Html.DisplayFor(m => m.Data[i].Comments)</td>
                    <td>@Html.CheckBoxFor(v => v.Data[i].Verified, new { 
data_url = Url.Action("VerifyDrinkingWater", "DrinkingWater"), id = 
"checkboxid" }) </td>
                </tr>
           }
        }

    </tbody>
</table>
</div>

<hr />

        @if (Model.Data.Count > 0)
        {
            <script>
                $(document).ready(function () {
                    makeDataTable('UnverifiedDrinkingWaterTable');
                });

                (function () {
                    $('#checkboxid').change(function () {
                        var data = {};
                        data[$(this).attr('name')] = $(this).is('checked');

                        $.ajax({
                            url: $(this).data('url'),
                            type: 'POST',
                            data: data,
                            success: function (result) {
                            }

                        });
                    });

                    });

            </script>
        }

我的目标是要通过选中“已验证”复选框来更新表中显示的记录上的3个字段。我跟随This Link在复选框上启用了点击事件。但是,我收到一个错误消息,声称该The required anti-forgery form field __RequestVerificationToken is not present.。这是我收到的唯一错误。

所以我的问题是,如何结合Ajax调用 AND 来创建AntiForgeryToken,同时将复选框的选中状态传递给控制器​​?现在,它甚至都没有碰到控制器,只是给了我AntiForgeryToken错误。

1 个答案:

答案 0 :(得分:0)

只需使用

即可获取令牌
var token = $('input[name="__RequestVerificationToken"]').val();

并放入这样的数据

var data = { 
__RequestVerificationToken: token 
}

请注意,您多次渲染了AntiForgeryToken,因此请修改您的代码以具有获取每种形式正确的AntiForgeryToke的能力