我有一个在Visual Studio 2017社区中开发的ASP.NET，MVC 5，.Net 4.5，C＃，JavaScript，Jquery Datatables Web应用程序。
当我点击Datatables按钮时，它会弹出一个带有字符串，数字和复选框的Bootstrap Modal框。
它显示并允许我更改字符串和数字，并将它们写回数据库，但由于某种原因，我无法使复选框按照应有的方式运行。
它不会填充数据中的复选框，当我单击“模态”屏幕上的“保存更改”按钮时，即使我选中“模态”窗口中的复选框，它也会将复选框数据更新为false。此外，如果复选框数据已为false，则选中该复选框并保存它不会将数据库字段更改为true。
以下是模态HTML：
<div class="modal" id="MasterModal" tabindex="-1" role="dialog" aria-labelledby="MasterModalLabel" aria-describedby="Aria described by" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="MasterModalLabel">Add New </h4>
</div>
<div class="modal-body">
<div class="container">
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal compact">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="row form-group">
@Html.LabelFor(model => model.Alias, htmlAttributes: new { @class = "control-label col-md-2" })
@Html.EditorFor(model => model.Alias, new { htmlAttributes = new { @class = "form-control col-md-10", @id = "aliasName" } })
@Html.ValidationMessageFor(model => model.Alias, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.User, htmlAttributes: new { @class = "control-label col-md-2" })
@Html.EditorFor(model => model.User, new { htmlAttributes = new { @class = "form-control col-md-10", @id = "userName" } })
@Html.ValidationMessageFor(model => model.User, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.Host, htmlAttributes: new { @class = "control-label col-md-2" })
@Html.EditorFor(model => model.Host, new { htmlAttributes = new { @class = "form-control col-md-10", @id = "hostName" } })
@Html.ValidationMessageFor(model => model.Host, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.Password, htmlAttributes: new { @class = "control-label col-md-2" })
@Html.EditorFor(model => model.Password, new { htmlAttributes = new { @class = "form-control col-md-4", @id = "passwordName", style = "width: 130px" } })
@Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
@Html.CheckBoxFor(model => model.PromptForPassword, new { htmlAttributes = new { @type = "checkbox", @class = "checkbox col-md-1", @id = "promptForPasswordName" } })
@Html.LabelFor(model => model.PromptForPassword, htmlAttributes: new { @class = "control-label col-md-5" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.ServerPortNumber, htmlAttributes: new { @class = "control-label col-md-6" })
@Html.EditorFor(model => model.ServerPortNumber, new { htmlAttributes = new { @class = "form-control col-md-6", @id = "portName", style = "width: 60px" } })
@Html.ValidationMessageFor(model => model.ServerPortNumber, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.PollPeriod, htmlAttributes: new { @class = "control-label col-md-6" })
@Html.EditorFor(model => model.PollPeriod, new { htmlAttributes = new { @class = "form-control col-md-6", @id = "pollName", style = "width: 60px" } })
@Html.ValidationMessageFor(model => model.PollPeriod, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.UseSsl, htmlAttributes: new { @class = "control-label col-md-6" })
@Html.CheckBoxFor(model => model.UseSsl, new { htmlAttributes = new { @type = "checkbox", @class = "checkbox col-md-6", @id = "useSslName" } })
@Html.ValidationMessageFor(model => model.UseSsl, "", new { @class = "text-danger" })
</div>
<div class="row form-group">
@Html.LabelFor(model => model.MailboxNotEnabled, htmlAttributes: new { @class = "control-label col-md-6" })
@Html.CheckBoxFor(model => model.MailboxNotEnabled, new { htmlAttributes = new { @class = "checkbox col-md-6", @id = "mailboxNotEnabledName" } })
@Html.ValidationMessageFor(model => model.MailboxNotEnabled, "", new { @class = "text-danger" })
</div>
</div>
}
</div><!-- /.container -->
</div><!-- /.modal-body -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="mAdd">Add new mailbox</button>
<button type="button" class="btn btn-warning" id="mEdit">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
这是我显示模态窗口的方式：
$('#mEdit').show();
$('#mAdd').hide();
$('#MasterModal').modal('show');
$('#MasterModalLabel').text('Edit Mailbox');
loadSelectedRowData(masterTable);
这是函数loadSelectedRowData：
function loadSelectedRowData(oTable) {
var idx = currentrow;
var id = oTable.row(idx).data().MailboxID;
var alias = oTable.row(idx).data().Alias;
var user = oTable.row(idx).data().User;
var host = oTable.row(idx).data().Host;
var password = oTable.row(idx).data().Password;
var promptforpassword = oTable.row(idx).data().PromptForPassword;
var port = oTable.row(idx).data().ServerPortNumber;
var poll = oTable.row(idx).data().PollPeriod;
var mailboxnotenabled = oTable.row(idx).data().MailboxNotEnabled;
var usessl = oTable.row(idx).data().UseSsl;
//Assign values to the modal box
$('#aliasName').val(alias);
$('#userName').val(user);
$('#hostName').val(host);
$('#passwordName').val(password);
$('#promptForPasswordName').val(promptforpassword);
$('#portName').val(port);
$('#pollName').val(poll);
$('#mailboxNotEnabledName').val(mailboxnotenabled);
$('#useSslName').val(usessl);
};
这是我点击保存更改按钮后使用的内容：
$('#mEdit').click(function () {
var idx = currentrow;
var pk = masterTable.row(idx).data().MailboxID;
var url = "/Mailbox/ModalEdit";
var data = {
MailboxID: pk,
aliasName: $('#aliasName').val(),
userName: $('#userName').val(),
hostName: $('#hostName').val(),
passwordName: $('#passwordName').val(),
promptForPasswordName: Boolean($('#promptForPasswordName').val()),
portName: Number($('#portName').val()),
pollName: Number($('#pollName').val()),
mailboxNotEnabledName: Boolean($('#mailboxNotEnabledName').val()),
useSslName: Boolean($('#useSslName').val())
};
$.post(url, data, function (d) {
if (d.msg == "success") {
masterTable.draw('page');
alert("Mailbox updated!");
$('#MasterModal').modal('hide');
return false;
}
alert("Something went wrong. Please retry!" + data.msg);
})
});//end edit
这是“var url =”/ Mailbox / ModalEdit“的C＃;”：
// Edit Mailbox
public ActionResult ModalEdit(FormCollection form)
{
using (SchoolContext db = new SchoolContext())
{
if (ModelState.IsValid)
{
try
{
Mailbox mailbox = db.Mailboxes.Find(Convert.ToInt32(form["MailboxID"]));
//mailbox.Alias = form["Name"].Trim();
mailbox.Alias = form["aliasName"].Trim();
mailbox.User = form["userName"].Trim();
mailbox.Host = form["hostName"].Trim();
mailbox.Password = form["passwordName"].Trim();
mailbox.PromptForPassword = Convert.ToBoolean(form["promptForPasswordName"]);
mailbox.ServerPortNumber = Convert.ToInt16(form["portName"]);
mailbox.PollPeriod = Convert.ToInt16(form["pollName"]);
mailbox.MailboxNotEnabled = Convert.ToBoolean(form["mailboxNotEnabledName"]);
mailbox.UseSsl = Convert.ToBoolean(form["useSslName"]);
db.SaveChanges();
return Json(new { msg = "success" });
}
catch (Exception ex)
{
return Json(new { msg = "Fail！" + ex.Message });
}
}
return Content("");
}
}
任何人都可以提供帮助来弄清楚我做错了什么，我们将不胜感激。
谢谢， 贝
于06/23/2017更新 我设法部分解决了这个问题。
在模态屏幕中，如果选中一个复选框并单击保存更改，它将保存为数据表和数据库，如果取消选中复选框并单击保存更改，则会将false保存到数据表和数据库。 / p>
我通过更改此操作： useSslName：Boolean（$（'useSslName'）。val（））到此： useSslName：document.getElementById（“useSslName”）。检查 $（'＃mEdit'）中的。点击（function（）{。
如果数据表和数据库为真，我仍然坚持填充Modal屏幕并勾选复选框。目前，在最初显示模态屏幕时，即使数据表和数据库为真，也不会选中复选框。
任何人都可以提供解决该问题的任何帮助，我们将不胜感激。
再次感谢， 贝
答案 0 :(得分：0)
于06/24/2017更新
我设法让这个工作。
在模态屏幕中，如果选中一个复选框并单击保存更改，它将保存为数据表和数据库，如果取消选中复选框并单击保存更改，则会将false保存到数据表和数据库。 / p>
我通过更改此操作来做到这一点： useSslName：Boolean（$（＆＃39; #useSslName＆＃39;）。val（））到此： useSslName：document.getElementById（ ＆＃34;在 $（＆＃39;＃mEdit＆＃39;）中使用SslName＆＃34;）。选中。点击（function（）{。
要在显示模态之前使用正确的复选框设置填充模态屏幕，我添加了： document.getElementById（＆＃34; useSslName＆＃34;）。checked =（oTable.row（idx）。 data（）。UseSsl）; 到函数loadSelectedRowData（oTable）{
由于我不是这方面的专家，我不确定这些改变是否是实现我正在做的事情的最佳方式，但它是按照我想要的方式工作。