我正在开发一个MVC网页，我打算通过弹出窗口进行创建和编辑操作。所以，我的想法是点击“创建”＆＃39;按钮，出现模态弹出窗口，所有模型字段为空，并允许用户输入。同样，当用户双击任何一行时，该行将通过相同的弹出窗口打开进行编辑，这次从该行填充详细信息。
因此，对于重复使用，我决定开发一个局部视图（即弹出窗口）并接受“模型”＃39;作为输入。
我的问题是，无论我做什么，我都无法将部分视图设置为弹出窗口。 （注意：我的主要父视图索引视图将输入为List
这是我的代码：
我的索引观点：
@model List<TrackBuildConfig.DAL.Models.BuildModel>
@{
Layout = null;
}
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/MyScript.js" type="text/javascript"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<div class="jumbotron">
<h1>Track Coverity and Nightly builds</h1>
<h4>on your own!</h4>
</div>
<div class="container-fluid">
<div class="row btn-group">
@Html.ActionLink("Create a new record", "SaveData", "Home", new { configID = 0 }, new { @class = "btn btn-primary modal-link", id = "btnCreate"})
</div>
<div class="modal fade" aria-labelledby="ModalLabel" id="modal-container" role="dialog" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content" style="width: 500px !important; margin:10px !important">
</div>
</div>
</div>
</div>
</body>
</html>
脚本：
$(function () {
$('body').on('click', '.modal-link', function (e) {
e.preventDefault();
$('#btnCreate').attr('data-toggle', 'modal');
$('#btnCreate').attr('data-target', '#modal-container');
$('#modal-container').modal('show');
return true;
});
}
});
部分视图_PartialModal.csHtml
@model TrackBuildConfig.DAL.Models.BuildModel
@{
Layout = null;
}
<html>
<head>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/MyScript.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<div class="">
<div class="modal-header">
<button type="button" class="close" aria-hidden="true" data-dismiss="modal">×</button>
<h4>Configure Coverity and Nightly builds</h4>
</div>
<div class="modal-body" style="height: 400px;">
@using (Html.BeginForm("SaveData", "Home", FormMethod.Post))
{
<div class="row">
<div class="form-group row">
<div class="col-sm-4">
@Html.Label("Stream name", new { @class = "control-label" })
</div>
<div class="col-sm-6">
@Html.DropDownList("BuildLocations", (IEnumerable<SelectListItem>)ViewBag.BuildLocations, new { @class = "col-sm-6 form-control", id = "ddlBuildLocation" })
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
@Html.Label("Build Location", new { @class = "control-label" })
</div>
<div class="col-sm-6">
@Html.DropDownList("Streams", (IEnumerable<SelectListItem>)ViewBag.Streams, new { @class = "col-sm-6 form-control", id = "ddlStreams" })
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
<div class="checkbox">
<label>
@Html.CheckBoxFor(m => m.IsCoverity)
Enable Coverity
</label>
</div>
</div>
<div class="col-sm-8">
<div class="checkbox">
<label>
@Html.CheckBoxFor(m => m.IsNightly)
Enable Nightly build
</label>
</div>
</div>
<label style="color: red; font-weight: 300;" id="warningEnableBuild"></label>
</div>
<div class="form-group row">
@Html.Label("Email for Coverity", new { @class = "col-sm-4 control-label" })
<div class="col-sm-8" style="width: 100%">
@Html.TextAreaFor(m => m.EmailCoverity, new { @class = "form-control clsEmailCoverity", @placeholder = "Enter some value", @onkeyup = "return true;", @rows = "5", id = "txtEmailCoverity" })
@*<textarea id="txtEmailCoverity" class="form-control clsEmailCoverity" runat="server" rows="5" placeholder="Enter email IDs for Coverity builds" onkeyup="SetEmailForNightly()"></textarea>*@
<span class="help-block">Please add only comma separated addresses!</span>
<label style="color: red; font-weight: 300;" id="warningLabelCoverity"></label>
</div>
</div>
<div class="form-group row">
@Html.Label("Email for Nightly", new { @class = "col-sm-4 control-label" })
<div class="col-sm-8" style="width: 100%">
@Html.TextAreaFor(m => m.EmailNightly, new { @class = "form-control clsEmailNightly", @placeholder = "Enter some value", @onkeyup = "return true;", @rows = "5", id = "txtEmailNightly" })
@*<textarea id="txtEmailCoverity" class="form-control clsEmailCoverity" runat="server" rows="5" placeholder="Enter email IDs for Coverity builds" onkeyup="SetEmailForNightly()"></textarea>*@
<span class="help-block">Please add only comma separated addresses!</span>
<label style="color: red; font-weight: 300;" id="warningLabelNightly"></label>
</div>
</div>
<div class="modal-footer">
<button id="btnSave" class="btn btn-success" type="submit" role="button">Save changes</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
}
</div>
</div>
</body>
</html>
控制器方法：
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
GetData getdata = new GetData();
return View(getdata.GetDataFromTable());
}
[HttpPost]
public ActionResult SaveData()
{
return View("Index");
}
//[HttpGet]
public ActionResult SaveData(int configID)
{
BuildModel model = new BuildModel();
PopulateBuildLocations();
PopulateStreams();
//Create
if (configID != 0)
{
GetData getdata = new GetData();
model = getdata.GetDataFromTable().Where(co => co.ConfigID == configID).FirstOrDefault();
}
else
{
model.BuildLocation = "";
model.EmailCoverity = "";
model.EmailNightly = "";
model.IsCoverity = false;
model.IsNightly = false;
}
return PartialView("_PartialModal", model);
}
public void PopulateBuildLocations()
{
string reportTypes = ConfigurationManager.AppSettings["ddlStreams"].ToString();
ViewBag.BuildLocations = reportTypes.Split('|')
.Select((text, value) => new SelectListItem { Text = text, Value = value.ToString() });
}
public void PopulateStreams()
{
List<string> lstStreams = new List<string>();
for (int i = 0; i < 6; i++)
{
lstStreams.Add("Stream " + i);
}
ViewBag.Streams = lstStreams.Select((text, value) => new SelectListItem { Text = text, Value = value.ToString() });
}
}
这是我用作参考的链接。 Reference
答案 0 :(得分：0)
请将我的代码放入您的视觉工作室，看看它是否有效。
控制器/视图模型/类：
public class BuildModel
{
public string theBuildModel { get; set; }
public int ConfigID { get; set; }
public string BuildLocation { get; set; }
public string EmailCoverity { get; set; }
public string EmailNightly { get; set; }
public bool IsCoverity { get; set; }
public bool IsNightly { get; set; }
}
public class GetData
{
public IList<BuildModel> GetDataFromTable()
{
IList<BuildModel> list = new List<BuildModel>();
var buildModel1 = new BuildModel { theBuildModel = "one" };
var buildModel2 = new BuildModel { theBuildModel = "two" };
var buildModel3 = new BuildModel { theBuildModel = "three" };
list.Add(buildModel1);
list.Add(buildModel2);
list.Add(buildModel3);
return list;
}
}
public class HomeController : Controller
{
[HttpPost]
public ViewResult SaveData(BuildModel buildModel)
{
GetData getdata = new GetData();
var model = getdata.GetDataFromTable();
return View("IndexStackOverflow", model);
}
[HttpGet]
public PartialViewResult SaveData(int configID)
{
BuildModel model = new BuildModel();
PopulateBuildLocations();
PopulateStreams();
//Create
if (configID != 0)
{
GetData getdata = new GetData();
model = getdata.GetDataFromTable().Where(co => co.ConfigID == configID).FirstOrDefault();
}
else
{
model.BuildLocation = "";
model.EmailCoverity = "";
model.EmailNightly = "";
model.IsCoverity = false;
model.IsNightly = false;
}
return PartialView("_PartialModal", model);
}
public void PopulateBuildLocations()
{
string reportTypes = ConfigurationManager.AppSettings["ddlStreams"].ToString();
ViewBag.BuildLocations = reportTypes.Split('|')
.Select((text, value) => new SelectListItem { Text = text, Value = value.ToString() });
}
public void PopulateStreams()
{
List<string> lstStreams = new List<string>();
for (int i = 0; i < 6; i++)
{
lstStreams.Add("Stream " + i);
}
ViewBag.Streams = lstStreams.Select((text, value) => new SelectListItem { Text = text, Value = value.ToString() });
}
public ActionResult IndexStackOverflow()
{
GetData getdata = new GetData();
return View(getdata.GetDataFromTable());
}
的web.config：
<appSettings>
<add key="ddlStreams" value="text1|value1"/>
</appSettings>
查看：
@model List<Testy20161006.Controllers.BuildModel>
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>IndexStackOverflow</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
@*YOU MUST PUT THE NEXT LINE FOLLOWING IN YOUR CODE-NUGET IF YOU NEED TO GET THE SCRIPT*@
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
</head>
<body>
<div class="jumbotron">
<h1>This is part of the Main Page</h1>
<h1>Partial View rendered in result</h1>
<h1>Track Coverity and Nightly builds</h1>
<h4>on your own!</h4>
</div>
<div class="container-fluid">
<div class="row btn-group">
@*@Html.ActionLink("Create a new record", "SaveData", "Home", new { configID = 0 },
new { @class = "btn btn-primary modal-link", id = "btnCreate" })*@
@using (Ajax.BeginForm("SaveData", "Home", new { configID = 0 },
new AjaxOptions
{
UpdateTargetId = "result",
InsertionMode = InsertionMode.Replace,
OnFailure = "error",
HttpMethod = "Get"
}))
{
<input id="btnCreate" type="submit" value="Create a new record" class="btn btn-primary modal-link" />
}
<div id="result"></div>
</div>
</div>
</body>
</html>
共享文件夹中的部分视图：
@model Testy20161006.Controllers.BuildModel
<script type="text/javascript">
$(function () {
$('#myModal').modal('show');
})
</script>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Configure Coverity and Nightly builds</h4>
</div>
<div class="modal-body">
<div class="modal-body" style="height: 400px;">
@using (Html.BeginForm("SaveData", "Home", FormMethod.Post))
{
<div class="row">
<div class="form-group row">
<div class="col-sm-4">
@Html.Label("Stream name", new { @class = "control-label" })
</div>
<div class="col-sm-6">
@Html.DropDownList("BuildLocations", (IEnumerable<SelectListItem>)ViewBag.BuildLocations, new { @class = "col-sm-6 form-control", id = "ddlBuildLocation" })
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
@Html.Label("Build Location", new { @class = "control-label" })
</div>
<div class="col-sm-6">
@Html.DropDownList("Streams", (IEnumerable<SelectListItem>)ViewBag.Streams, new { @class = "col-sm-6 form-control", id = "ddlStreams" })
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
<div class="checkbox">
<label>
@Html.CheckBoxFor(m => m.IsCoverity)
Enable Coverity
</label>
</div>
</div>
<div class="col-sm-8">
<div class="checkbox">
<label>
@Html.CheckBoxFor(m => m.IsNightly)
Enable Nightly build
</label>
</div>
</div>
<label style="color: red; font-weight: 300;" id="warningEnableBuild"></label>
</div>
<div class="form-group row">
@Html.Label("Email for Coverity", new { @class = "col-sm-4 control-label" })
<div class="col-sm-8" style="width: 100%">
@Html.TextAreaFor(m => m.EmailCoverity, new { @class = "form-control clsEmailCoverity", @placeholder = "Enter some value", @onkeyup = "return true;", @rows = "5", id = "txtEmailCoverity" })
@*<textarea id="txtEmailCoverity" class="form-control clsEmailCoverity" runat="server" rows="5" placeholder="Enter email IDs for Coverity builds" onkeyup="SetEmailForNightly()"></textarea>*@
<span class="help-block">Please add only comma separated addresses!</span>
<label style="color: red; font-weight: 300;" id="warningLabelCoverity"></label>
</div>
</div>
<div class="form-group row">
@Html.Label("Email for Nightly", new { @class = "col-sm-4 control-label" })
<div class="col-sm-8" style="width: 100%">
@Html.TextAreaFor(m => m.EmailNightly, new { @class = "form-control clsEmailNightly", @placeholder = "Enter some value", @onkeyup = "return true;", @rows = "5", id = "txtEmailNightly" })
@*<textarea id="txtEmailCoverity" class="form-control clsEmailCoverity" runat="server" rows="5" placeholder="Enter email IDs for Coverity builds" onkeyup="SetEmailForNightly()"></textarea>*@
<span class="help-block">Please add only comma separated addresses!</span>
<label style="color: red; font-weight: 300;" id="warningLabelNightly"></label>
</div>
</div>
<div class="modal-footer">
<button id="btnSave" class="btn btn-success" type="submit" role="button">Save changes</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
}
</div>
</div>
</div>
</div>
</div>