0

在我的索引页面中，我有

<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（控制器）时，它返回一个部分页面，该页面愉快地填充了页面中心的颜色框。

在颜色框中，我有两个单选按钮。我希望使用 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>
}
4

1 回答 1

1

我看到的第一件事（虽然不确定这是否只是复制'n'粘贴错误）是你的 -function{太多了ddUserClicked():)

除此之外，让它工作的一种快速而肮脏的方法是从您的视图中删除函数ddUserClicked并将ddEntityClicked以下内容放在局部视图的顶部（虽然不是在script-section 内）

<script type="text/javascript">
    function ddUserClicked() {
        alert('user button, selected!');
    }

    function ddEntityClicked() {
        alert('entity button, selected!');
    }
</script>

我认为问题可能script是 - 部分包含在body（如果您_Layout.cshtml至少使用默认值）的末尾，并且函数没有在您使用它们的地方定义。不过我可能是错的。

另一种方法是给单选按钮一个 ID，例如：

<td>
    @Html.RadioButtonFor(m => m.IsUserAlert, true, new { id = "user_alert", })User Alert
    @Html.RadioButtonFor(m => m.IsUserAlert, false, new { id = "entity_alert", })Entity Alert
</td>

...然后创建一个 jquery 脚本。类似于以下内容：

// File alert.js
$(document).ready(function() {
    $("#user_alert").click(function() {
        alert('user button, selected!');
    });

    $("#entity_alert").click(function () {
        alert('user button, selected!');
    });
});

然后链接.js。这将使您与脚本松散耦合，因为您没有在 HTML 中指定要绑定的任何函数。通常，您希望避免在视图中放置过多的 javascript。

于 2013-03-08T15:32:52.153 回答