私のインデックスページには
<a class='popup' href='@Url.Action("Add", "Alert")'>Add New</a>
cshtml ファイルの最後にセクション スクリプトがあります。
@section Scripts
{
<link rel="stylesheet" href="http://www.formmail-maker.com/var/demo/jquery-popup- form/colorbox.css" />
<style>
#cboxOverlay{ background:#666666; }
</style>
<script type="text/javascript" src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".popup").colorbox({ opacity: 0.85, iframe: true, fastIframe: false, width: "450px", height: "480px", scrolling: false });
});
function ddUserClicked() {
{
alert('user button, selected!');
}
function ddEntityClicked() {
alert('entity button, selected!');
}
</script>
}
これはうまくいきます。Add (アクション メソッド) Alert (コントローラー) が呼び出されると、ページの中央にあるカラーボックスをうまく埋める部分的なページが返されます。
カラーボックスには、2 つのラジオ ボタンがあります。onclick イベントを使用して、元のビュー ddUserClicked() および ddEntityClicked() から実装した関数を呼び出せるようにしたいと考えていました。
しかし、これはうまくいきません。
部分ページスクリプトは
@model WellRoute.Web.Models.CreateAlertModel
@{
ViewBag.Title = "Add New Alert";
}
<h2>@ViewBag.Title</h2><br />
@using (Html.BeginForm("Add", "Alert", FormMethod.Post))
{
<fieldset>
<legend>New Alert</legend>
<table>
<tr>
<td>@Html.Label("Type")</td>
<td>
@Html.RadioButtonFor(m => m.IsUserAlert, true, new { onclick = "ddUserClicked(); ", })User Alert
@Html.RadioButtonFor(m => m.IsUserAlert, false, new { onclick = "ddEntityClicked()", })Entity Alert
</td>
</tr>
<tr>
<td>@Html.Label("User")</td>
<td>
@Html.DropDownListFor(m => m.SelectedValue, new SelectList(Model.Users, "Id", "EmailAddress"), new { style = "width:250px;" })
@Html.DropDownListFor(m => m.SelectedValue, new SelectList(Model.Entities, "Id", "Name"), new { style = "width:250px; visibility:hidden;" })
</td>
</tr>
<tr>
<td>@Html.Label("Message")</td>
<td>@Html.TextAreaFor(m => m.Message, new { style = "width:250px; height:100px" })</td>
</tr>
</table>
<p>
<input type="submit" value="Save" />
<input type="submit" value="Cancel" />
</p>
</fieldset>
}