0
MVC Webページを開発しています。ここでは、Create操作とEdit操作をポップアップで行う予定です。つまり、「作成」ボタンをクリックするというアイデアです。すべてのモデルフィールドが空白のモーダルポップアップが表示され、ユーザーが入力できるようになります。同様に、ユーザーがいずれかの行をダブルクリックすると、その行は同じポップアップを介して編集用に開き、今回はその行から詳細が入力されます。MVCモーダルポップアップ（部分ビューから） - 動作しません。
再利用のために、私は部分的なビュー（ポップアップとなる）を作成し、入力として 'モデル'を受け入れることに決めました。
私の問題は、私が何をしていても、部分ビューをポップアップ表示させることができません。 （注：私のメインの親Indexビューはリストとして入力を私達accpetう
ここに私のコードは次のとおりです。
MY Indexビュー：
@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
'同じように、ユーザーが行をダブルクリックすると、'あなたはリストをどこにバインドしているのか教えていただけますか？ –
コードには非常に多くのエラーがあります。部分的なビューの中に 'HTML Tag、HEAD、BODY'を書くべきではありません。あなたはデータのリストをどこにでも束縛していません。 ** SaveData **何もしないメソッドをポストします。どこにでもあなたの部分的なビューを呼び出さない。私は、この[link]（https://stackoverflow.com/a/7295909/2376652）をチェックして部分的なビューを読み込む方法を理解することをお勧めします。 –