部分页面无法触发单选按钮的onclick处理

Question

在我的索引页我有

<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（操作方法）警报（控制器）时，它将返回一个部分页面，该页面可以愉快地填充页面中心的颜色框。

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

Answer 1

，我看到（不知道这仅仅是一个copy'n'paste错误虽然）的第一件事情是，你有一个{您ddUserClicked()太多功能:)

除此之外，一个快速和肮脏的方式来得到它的工作将是从您的视图中删除功能ddUserClicked和ddEntityClicked，并把以下放在部分视图的顶部，而不是script-section虽然）

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

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

我认为这个问题可能是，script -section被包括在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。