使用选择多选将值传递给数据库答案

【问题标题】：Pass values to database with selectize multiselect使用选择多选将值传递给数据库
【发布时间】：2018-04-20 15:00:57
【问题描述】：

我有一个带有多选选择“部门”下拉菜单的“添加员工”模式。单击按钮时，将运行 ajax 调用来调用相应的控制器并将值传递给数据库。我可以传递除“部门”下拉列表之外的所有内容。

我试过了：

$.ajax({
...
data: { ..., Department: $("#cmbAddDepartment").val(), .... }
})


$.ajax({
...
data: { ...., Department: $("#cmbAddDepartment").getValue(), ... }
})

和

var selectize = $('#cmbAddDepartment').get(0).selectize;
var cmbAddDepartment=selectize.getValue();
$.ajax({
...
data: { ... , Department: cmbAddDepartment, ... }
})

有趣的是，所有这些都在 alert() 中工作，但不在 ajax 数据中。

我正在使用：引导程序 4 阿尔法 6， jQuery 3.2.1，独立选择 0.12.4

编辑： 仅供参考，我所有的其他组合框都是单选（仍然选择），$("#cmbAddSomething").val()` 适用于它们。

编辑 2：这是控制器和（视图）模型

视图模型 - vmEmpCreate.cs

public class vmEmpCreate
{
    public vmEmpCreate()
    {
        //constructor
    }

    //combo
    public string Company { get; set; }
    public string Site { get; set; }
    public string[] Department { get; set; } //can be multiple
    public string ProductionLine { get; set; }
    public IEnumerable<SelectListItem> AddCompany { get; set; }
    public IEnumerable<SelectListItem> AddSite { get; set; }
    public IEnumerable<SelectListItem> AddDepartment { get; set; }
    public IEnumerable<SelectListItem> AddProductionLine { get; set; }

}

public class MyListSelectForAdd
{
    public string Key { get; set; }
    public string Display { get; set; }
}

控制器 - Controller.cs

[HttpPost]
    public ActionResult AddEmployee(vmEmpCreate vmc)
    {
        if (ModelState.IsValid)
        {
            modEmployee addemp = new modEmployee();

            addemp.Company = vmc.Company;
            addemp.Site = vmc.Site;
            addemp.Department = vmc.Department;
            ...
            addemp.Remarks = vmc.Remarks;

            conn = new SqlConnection(someConnectionString);
            conn.Open();
            comm = new SqlCommand("insert into someTable (company, site, department, ..., remarks) values ('"
                + addemp.Company + "' , '"
                + addemp.Site + "' , '"
                + addemp.Department + "' , '"
                ...
                + addemp.Remarks + "')", conn);
            comm.ExecuteNonQuery();
            conn.Close();
        }

        return PartialView();
    }

编辑 3： 根据建议，我使用 chrome 检查器检查了我的程序以查看任何错误，但没有出现。

【问题讨论】：

标签： javascript c# twitter-bootstrap selectize.js

【解决方案1】：

我对 selectize 不是很熟悉，但是为了发送一组信息，您需要将其存储在一个对象（又名关联数组）中：

var selectize = $('#cmbAddDepartment').get(0).selectize;
var cmbAddDepartment=selectize.getValue();

$.ajax({
    ...
    data: {
        ... , 
        Department: cmbAddDepartment, 
        ...
    }
});

您可以根据需要向其中传递尽可能多的数据。因此，如果您的所有方法都有效，请使用最适合您的方法，并确保将数据括在括号中。

更多关于JavaScript Objects

【讨论】：

哦！是的，我已经做到了。只是忘了把它包括在问题中。抱歉，现在将编辑。谢谢。
好的。您是否检查过控制台以确保正在发送请求？您能在收到请求的地方显示一些服务器端代码吗？
是的，其他值被保存到数据库中。当我的代码进入控制器时，model.Department 始终为空。抱歉，您能澄清一下服务器端代码的含义吗？
他是说你确定没有在 ajax 请求中传递值？检查您的 chrome 检查器并首先确保这一点。如果值正在传递，则问题出在后端。
后端是用C#写的吗？ @ohno.morty 这是我们需要查看的代码，因为 JavaScript 没有损坏

【解决方案2】：

我能够通过将多选下拉列表中的选定值存储到 HiddenFor，然后将该值传递给我在 ajax 调用中的“部门”属性来创建解决此问题的方法。我还将我的视图模型“部门”属性从数组更改为字符串。

（查看）模型：

public string Department;

查看：

@Html.HiddenFor(m => m.Department, new { @id = "hdnDepartment" })

$('#btnAddEmployee').click(function (e) {
    e.preventDefault();
    var selectize = $('#cmbAddDepartment').get(0).selectize;
    var cmbAddDepartment = selectize.getValue();
    $("#hdnDepartment").val(cmbAddDepartment);
    $.ajax({
        ..
        data: { ..., Department: $("#hdnDepartment").val(), ... }, // optional data
        ...
    });
});

相当便宜的解决方案，但它可以完成工作。感谢大家的帮助！

【讨论】：