Dynamic Controller Method name in Java Script MVC

Question

I have a view which has check boxes allowing the administrator to remove a user's ability to download a given file. I want to change the underlying user property CanDownloadA/CanDownloadB when the administrator changes the check box. My view is

<table class="table">
    <tr>
        <th>Username</th>
        <th>Email Addres</th>
        <th>UserCost Access</th>
        <th>DrGroup Access</th>
        <th>Last Login</th>
    </tr>
    @{
        if (Model != null)
        {
            foreach (var item in Model.UserList)
            {
                <tr>
                    <td>@Html.DisplayFor(modelItem => item.UserName)</td>
                    <td>@Html.DisplayFor(modelItem => item.EmailAddress)</td>
                    <td>@Html.CheckBoxFor(modelItem => item.CanDownloadA.Value, 
                         new { data_item = item.UserName, action = "EditAAccess"})</td>
                    <td>@Html.CheckBoxFor(modelItem => item.CanDownloadB.Value,
                         new { data_item = item.UserName, action = "EditBAccess" })</td>
                    <td>@Html.DisplayFor(modelItem => item.LastLoginDateTime)</td>
                    <td>
                        @Ajax.ActionLink(
                            "Remove",
                            "UpdateUserInfo",
                            "Tools",
                            new
                            {
                                userName = item.UserName
                            },
                            new AjaxOptions
                            {
                                HttpMethod = "GET"
                            },
                            new { onclick = "return confirm('Are you sure you wish to delete user?');" })
                    </td>
                </tr>
            }
        }
    }
</table>
...
 <script>
    $(function () {
        $("input[type=checkbox]").click(function () {
            var data_item = $(this).data("userName");
            $.ajax({
                url: 'Tools/' + $(this).data("action"),
                type: 'POST',
                data: { userName: data_item, isChecked: $(this).is(':checked') },
                success: function (result) {

                }
            });
        });
    });
</script>

Where the script is calling the appropriate controller method, either

[HttpPost]
[AllowAnonymous]
public async Task<ActionResult> EditUserCostAccess(
    string userName, bool isChecked)
{
    return await EditAccess(userName, isChecked, DownloadType.UserCost);
}

or

[HttpPost]
[AllowAnonymous]
public async Task<ActionResult> EditDrGrouptAccess(
    string userName, bool isChecked)
{
    return await EditAccess(userName, isChecked, DownloadType.DrGroup);
}

if I remove action = "EditBAccess" from the check box HtmlParameters and write

url: 'Tools/EditDrGrouptAccess',

in the JQuery script, the appropriate method fires. However, I don't want to have two scripts to fire each method so I have written url: 'Tools/' + $(this).data("action"), which does not work.

1. Why does my JavaScript function (particular url: 'Tools/' + $(this).data("action"),) not work?
2. userName is null when passed to the controller, why?

Thanks for your time.

---

Edit. Problem 2 has been solved by @Samuel Caillerie below. But 1. is not. I have changed the script to

<script>
    $(function () {
        $("input[type=checkbox]").click(function () {
            var data_item = $(this).data("item");
            var data_action = $(this).data("action");
            $.ajax({
                url: 'Tools/' + data_action,
                type: 'POST',
                data: { userName: data_item, isChecked: $(this).is(':checked') },
                success: function (result) {

                }
            });
        });
    });
</script>

and the checkbox code:

<td>@Html.CheckBoxFor(modelItem => item.CanDownloadUserCost.Value, 
    new { data_item = item.UserName, data_action = "EditUserCostAccess"})</td>

But this does not work.

Answer 1

For your first point, I think it is just a mistake in your code :

<td>@Html.CheckBoxFor(modelItem => item.CanDownloadA.Value, 
       new { data_item = item.UserName, data_action = "EditAAccess"})</td>
<td>@Html.CheckBoxFor(modelItem => item.CanDownloadB.Value,
       new { data_item = item.UserName, data_action = "EditBAccess" })</td>

(you have to put data_action instead of action).

For your second point, change userName to item in your js :

var data_item = $(this).data("item");

or change the name of the attribute that you pass to the checkbox to data_userName...