将动态生成复选框选中结果以字符串传递至控制器的问题
解决复选框状态转字符串传递的JS错误问题
看起来你在尝试把选中的复选框值拼成字符串传给控制器时遇到了两个关键错误,我来帮你逐一解决:
错误1:Invalid left-hand side in assignment
你代码里的@Model.CoIDs=t;是问题根源——@Model是服务器端Razor变量,页面渲染完成后就已经固定,无法在客户端JavaScript里直接赋值。你需要操作的是@Html.HiddenFor(m => m.CoIDs)生成的隐藏输入框,而非直接修改服务器端模型。
错误2:callme is not defined
你的复选框onchange="callme(@t)"渲染后,若@t是字符串(比如"Co1"),会变成callme(Co1),JS会把Co1当成未定义变量,因此报错。需要给参数加上单引号,变成callme('@t')。
修正后的完整代码
@model UserClaimsViewModel <script> function callme(val) { // 用map+join更优雅地拼接选中的ID,避免末尾多余的逗号 var selectedCoIDs = $('#MyDiv input:checked').map(function() { return this.id; // 若需要name值可替换为this.name }).get().join(','); // 把值设置到隐藏域中,而非直接修改服务器端模型 $('#CoIDs').val(selectedCoIDs); console.log("coids updated to: " + selectedCoIDs); } </script> @Model.email <br /> @using (Html.BeginForm()) { @Html.HiddenFor(m => m.email) @Html.HiddenFor(m => m.CoIDs) <!-- 把隐藏域移到form内部,确保提交时能携带值 --> <div class="panel-body" id="MyDiv"> <table> @foreach (var t in Model.CoIDs.Split(',')) { <tr> <td> <!-- 给onchange参数加单引号,避免JS变量未定义错误 --> <input type="checkbox" onchange="callme('@t')" name="@t" id="@t" checked>@t </td> </tr> } </table> </div> <input type="submit" value="Submit Changes" /> }
额外优化点
- 初始渲染时给已在CoIDs中的复选框加上
checked属性,保证页面加载时选中状态正确。 - 用
map+join替代each拼接字符串,避免末尾多出逗号的问题,代码更简洁。 - 将
@Html.HiddenFor(m => m.CoIDs)放在form标签内部,确保表单提交时该值能正确传递到控制器。
这样修改后,两个错误都会被解决,选中的复选框ID会被拼成字符串存入隐藏域,提交表单时就会直接传给控制器的CoIDs属性啦。
内容的提问来源于stack exchange,提问作者Rilcon42
相关产品推荐
相关产品推荐

