2012-07-12 28 views
0

我的模型如何在asp.net mvc的onclick事件註冊@ Html.RadioButtonForSelectList 3.0

public class IndexViewModel 
{ 
    public IEnumerable<SelectListItem> TestRadioList { get; set; } 

    [Required(ErrorMessage = "You must select an option for TestRadio")] 
    public String TestRadio { get; set; } 

    [Required(ErrorMessage = "You must select an option for TestRadio2")] 
    public String TestRadio2 { get; set; } 
} 

public class aTest 
{ 
    public Int32 ID { get; set; } 
    public String Name { get; set; } 
} 

我的控制器

public ActionResult Index() 
    { 
     List<aTest> list = new List<aTest>(); 
     list.Add(new aTest() { ID = 1, Name = "Yes" }); 
     list.Add(new aTest() { ID = 2, Name = "No" }); 
     list.Add(new aTest() { ID = 3, Name = "Not applicable" }); 
     list.Add(new aTest() { ID = 3, Name = "Muttu" }); 
     SelectList sl = new SelectList(list, "ID", "Name"); 
     var model = new IndexViewModel(); 
     model.TestRadioList = sl; 
     return View(model); 
    } 

我查看

@using (Html.BeginForm()) { 
<div> 
    @Html.RadioButtonForSelectList(m => m.TestRadio, Model.TestRadioList) 
</div> 

}

幫手法

public static class HtmlExtensions 
{ 
    public static MvcHtmlString RadioButtonForSelectList<TModel, TProperty>(
     this HtmlHelper<TModel> htmlHelper, 
     Expression<Func<TModel, TProperty>> expression, 
     IEnumerable<SelectListItem> listOfValues) 
    { 
     var metaData = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); 
     var sb = new StringBuilder(); 

     if (listOfValues != null) 
     { 
      // Create a radio button for each item in the list 
      foreach (SelectListItem item in listOfValues) 
      { 
       // Generate an id to be given to the radio button field 
       var id = string.Format("{0}_{1}", metaData.PropertyName, item.Value); 

       // Create and populate a radio button using the existing html helpers 
       var label = htmlHelper.Label(id, HttpUtility.HtmlEncode(item.Text)); 
       var radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id }).ToHtmlString(); 

       // Create the html string that will be returned to the client 
       // e.g. <input data-val="true" data-val-required="You must select an option" id="TestRadio_1" name="TestRadio" type="radio" value="1" /><label for="TestRadio_1">Line1</label> 
       sb.AppendFormat("<div class=\"RadioButton\">{0}{1}</div>", radio, label); 
      } 
     } 

     return MvcHtmlString.Create(sb.ToString()); 
    } 
} 

這是我使用的代碼...不知道如何給控件一個onclick事件。在助手方法中,我找不到任何合適的htmlattributes參數。根據我的要求。點擊列表中的任何一個單選按鈕,我需要調用一個參數很少的js函數。我無法做到這一點。 Someonce請幫忙。提前致謝。

+0

你的幫手是否來自這裏? http://jonlanceley.blogspot.ch/2011/06/mvc3-radiobuttonlist-helper.html – 2012-07-12 10:22:14

+0

謝謝你的回覆拉斐爾。我沒有使用jonlanceley.blogspot.ch/2011/06/的助手。我已經用助手Method編輯過我的帖子。請看看,讓我知道。謝謝 – suman 2012-07-12 10:47:48

回答

0

我還沒有辦法測試此刻,但一個大概的想法是將IDictionary htmlAttributes添加到該方法並將其傳遞到那裏。如果你沒有在視圖中選擇所需的onClick代碼,那麼你可以省略該參數並做到這一點的擴展方法

public static class HtmlExtensions 
    { 
     public static MvcHtmlString RadioButtonForSelectList<TModel, TProperty>(
      this HtmlHelper<TModel> htmlHelper, 
      Expression<Func<TModel, TProperty>> expression, 
      IEnumerable<SelectListItem> listOfValues, 
      IDictionary<string, Object> htmlAttributes) 
     { 
      var metaData = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); 
      var sb = new StringBuilder(); 

      if (listOfValues != null) 
      { 
       // Create a radio button for each item in the list 
       foreach (SelectListItem item in listOfValues) 
       { 
        // Generate an id to be given to the radio button field 
        var id = string.Format("{0}_{1}", metaData.PropertyName, item.Value); 

        // Create and populate a radio button using the existing html helpers 
        var label = htmlHelper.Label(id, HttpUtility.HtmlEncode(item.Text)); 

        htmlAttributes["id"] = id; 
        var radio = htmlHelper.RadioButtonFor(expression, item.Value, htmlAttributes).ToHtmlString(); 

        // Create the html string that will be returned to the client 
        // e.g. <input data-val="true" data-val-required="You must select an option" id="TestRadio_1" name="TestRadio" type="radio" value="1" /><label for="TestRadio_1">Line1</label> 
        sb.AppendFormat("<div class=\"RadioButton\">{0}{1}</div>", radio, label); 
       } 
      } 

      return MvcHtmlString.Create(sb.ToString()); 
     } 
    } 

然後調用它使用類似:

@Html.RadioButtonForSelectList(m => m.TestRadio, Model.TestRadioList, new { onclick="someFunction();" }) 

另外,您可以設置一個css類並綁定到click事件。例如,

<script type="text/javascript> 
    $('.someClassName').click(function() { 
    alert('clicked'); 
}); 
</script> 

@Html.RadioButtonForSelectList(m => m.TestRadio, Model.TestRadioList, new { @class="someClassName" }) 
+0

嗨菲爾,喜歡你的問題和賞金,所以我扼殺了你一點點,併爲你提供了很好的答案,並幫助了其他人。 – 2013-06-29 06:40:24

+0

非常友善的克里斯 - 我需要點! – Phil 2013-07-03 19:35:11