toggle checkbox with ajax

I have a web application with mvc where I have a toggle button to change the status (on / off) but I do not want to reload the entire page once the status is changed, also for some reason the data I need from the view for the controller do not pass to be able to update the status in the database (activated / deactivated), ajax I believe is the answer but I am open to any solution. thanks

<a class="btn btn-outline-success float-right" href="@Url.Action("Create", 
"Season")">
<img src="~/icons/si-glyph-button-plus.svg" width="16" height="16" /> 
Agregar
</a>
<br />

<table class="table">
<tr>
    <th>
        @Html.DisplayNameFor(model => model.DateStart)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.DateEnd)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.State)
    </th>
    <th></th>
</tr>

@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.DateStart)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.DateEnd)
        </td>
        <td>


            <!--nnnnnnn-->
            <label class="tgl">
                <input type="checkbox" checked />
                <span class="tgl_body">
                    <span class="tgl_switch"></span>
                    <span class="tgl_track">
                        <span class="tgl_bgd"></span>
                        <span class="tgl_bgd tgl_bgd-negative"></span>
                    </span>
                </span>
            </label>

        </td>
        <td>
            <div class="pull-right">
                <a class="btn btn-warning" href="@Url.Action("Edit","Season", new { id=item.Id})">
                    <img src="~/icons/si-glyph-edit.svg" width="16" height="16" /> Modificar
                </a>
                |
                <a class="btn btn-danger" href="@Url.Action("Delete","Season", new { id=item.Id})">
                    <img src="~/icons/si-glyph-button-remove.svg" width="16" height="16" /> Eliminar
                </a>
            </div>
        </td>
    </tr>
}

//aqui es donde habia estado probando hacerlo con jquery
<script>
$(document).ready(function () {
    $("button").click(function () {
        $("p").toggle();
    });
});
</script>