Question

我的 js 代码有问题，当我检查我的 onClick() 操作框时，他们会检查所有这些框，但在部分网络中的检查元素中，我没有看到有什么事情发生。

         <table class="table table-striped grid-table" id="tableLabel">
        <tr>
            <th>Name</th>
            <th>Book</th>
            <th>
                <button type="button" class="checkall" onClick="checkAll()">select/deselect</button>
            </th>

        </tr>
@foreach (var item in (IEnumerable<cit.Models.getCheIdTip_Result>)Model)
        {
            <tr>
                <td>@item.idtip</td>
                <td>@item.tipname</td>
                <td>
                 <div class="pure-checkbox">
                 <input type="checkbox" idtip="@item.idtip" class="checktip" checked="@(item.idemployee == ViewBag.idemployee ? true : false)" name="@item.id.ToString()" id="@item.id.ToString()" />
                 <label for="@item.id.ToString()"></label>
                </div>
                </td>
            </tr>
        }
    </table>
    <input type="hidden" value="@ViewData["idemployee"]" name="idemployee" id="idemployee" class="idemployee" />

这是我的js代码，如何选择所有它们并传递给控制器。

        var isChecked = false;
    function checkAll() {
        var checkboxes = document.getElementsByTagName('input');
        if (isChecked) {
            for (var i = 0; i < checkboxes.length; i++) {
                if (checkboxes[i].className == 'checktip') {
                    checkboxes[i].checked = true;
                }
            }
        } else {
            for (var i = 0; i < checkboxes.length; i++) {
                console.log(i)
                if (checkboxes[i].className == 'checktip') {
                    checkboxes[i].checked = false;
                }
            }
        }
        isChecked = !isChecked;
    }

Answer 1

你只是在那里使用了标签，这让你不能只点击复选框。你必须有一个 js 或 jquery 来确保你检查了什么，甚至做了什么。我将展示我的例子。我有同样的问题。我使用了自定义复选框，无法将其发送到后端

<label class="custom-chk">
   <input type="checkbox">
   <span class="checkmark"></span>
</label>

$('.checkmark').click(function () {
     $(this).parents('td').toggleClass('chked')
})

我使用 ajax 发送数组。从选中的框中创建一个数组并使用 ajax 将其发送到后端。

        for (var i = 0; i < $('label').length; i++) {
            if ($('label').eq(i).hasClass('chked')) {
                qrfid.push(
                    $('label').eq(i).attr('value')
                )
            }
        }

不要完成括号并使用 $.post 或 $.ajax（只需单击您要提交的按钮）

你还没有写下你将如何发送数据。所以我建议和我一样。这取决于你

Answer 2

    @foreach (var item in (IEnumerable<cit.Models.getCheIdTip_Result>)Model)
{
    <tr>
        <td>@item.idtip</td>
        <td>@item.tipname</td>
        <td>
            <div class="pure-checkbox" idtip="@item.idtip">
                <input type="checkbox"  class="checktip" id="@item.id.ToString()" />
                <label for="@item.id.ToString()"></label>
            </div>
        </td>
    </tr>
}

<script>
    $('.pure-checkbox').click(function () {
        $(this).parents('td').toggleClass('chked')
    })

    var wantedids = []

    $("#yoursubmitbutton").click(function () {
        for (var i = 0; i < $('.pure-checkbox').length; i++) {
            if ($('.pure-checkbox').eq(i).parents('td').hasClass('chked')) {
                wantedids.push(
                    $('.pure-checkbox').eq(i).attr('idtip')
                )
            }
        }
        $.post("your url", { nameofC#variable: wantedids, nameofC#variable : $('#idofelement') },

        )
    })

</script>

idk 如果你的 div 有 chkd 类，它可能会破坏你的代码。所以我将它添加到 td 标签。但是 div 也是可以的。您将使用 ajax 发送所有内容。并且您不需要表单标签，标签中的名称属性。

而且我还看到您试图说如果以下条件为真，请选中该框。但你可以使用 @如果

@foreach (var fenn in ViewBag.Fenn.Rows)
        {
            bool p = true;
            <span>@fenn["FennAd"]</span>
            foreach (var kfenn in ViewBag.QrFennInfo.Rows)
            {
                if (kfenn["FennID"] == fenn["FennID"])
                {
                    <label value="@fenn["FennID"]" class="custom-chk chked">
                        <input type="checkbox" checked="">
                        <span class="checkmark"></span>
                    </label>
                    <div hidden>@(p = false)</div>
                }
            }
            if (p)
            {
                <label value="@fenn["FennID"]" class="custom-chk">
                    <input type="checkbox">
                    <span class="checkmark"></span>
                </label>
            }
        }

我的就是这样。我在这里没有用过英语。我只是使用 viewbag 并要求它使用 double for 和 1 if 来检查已检查的 sql 数据表。我的意思是我有一张课桌和一张小组桌。以及他们的组合表。

将选中的复选框传递给控制器

2 个答案: