1

我有一个<form>包含复选框列表的标签。当表单 enctype =多个选中的复选框值按预期application/x-www-form-urlencoded以逗号分隔的字符串呈现给我时。Request.Form

如果我将 enctype 更改为multipart/form-data（因为我想在提交中包含个人资料图像），那么Request.Form尽管请求有效负载中存在所有选定的复选框值（具有相同的名称），但只会显示最后一个选定的复选框值。

示例有效载荷

------WebKitFormBoundaryS2gp8PRUhbFngzPE
Content-Disposition: form-data; name="expertise-areas"

Academic career path
------WebKitFormBoundaryS2gp8PRUhbFngzPE
Content-Disposition: form-data; name="expertise-areas"

Promotion

路线代码 

var expertise = Request.Form.expertiseareas;

结果

Expected : "Academic career path,Promotion"
Actual   : "Promotion"

这是设计使然吗？如果是这样，发送带有小图像的复选框值列表的最佳方法是什么？我需要把它分成两种形式吗？

谢谢

4

1 回答 1

1

这是我如何让它工作的：

  1. 通过删除名称属性来防止复选框与表单一起发布
  2. 添加隐藏输入以将所选值保存为逗号分隔的列表
  3. 使用 javascript 将选中的复选框值加入逗号分隔的列表中
  4. 将隐藏的输入值设置为逗号分隔的列表

我刚刚从我的项目中提取了这段代码，但你明白了。

HTML（剃刀）

<form id="form-profile-edit" enctype="multipart/form-data" method="POST" action="/user/profile/edit">
... more stuff
    <input id="organisational-hidden" name="organisationalareas" type="hidden"/>
    @foreach (string area in Model.OrganisationalAreas)
    {
        @Html.GetAreaCheckbox(area, 
                              user.HasOrgansiationalArea(area), 
                              @class:"organisational")
    }
...more stuff
</form>

Javascript

$('#form-profile-edit').ajaxForm({
    beforeSerialize: function() {
        var organisational = toCommaDelimited($('.organisational:checked'));
        $('#organisational-hidden').val(organisational);
    }
});
function toCommaDelimited(checkboxes) {
    return $.map(checkboxes, function (checkbox) { return checkbox.value; }).join(',');
}
于 2012-10-31T16:38:24.273 回答