在MVC5中使用Razor渲染自定义控件

时间:2017-03-20 14:58:06

标签: javascript c# jquery asp.net-mvc html-helper

我有一个包含两个属性的视图模型。

public class ControlToRender
{
     public int IsText { get; set; }
     public string LabelString { get; set; } 
     public string TextValue { get; set; }
}

这将填充在控制器中,以便:

IsText = True;
LabelString = "please enter your name";
TextValue = "";

在我看来,我正在测试以上内容:

if (Model.IsText)
{
    @Html.CtrlHelper().ClearableTextBoxFor(model => model.TextValue, 
          new
          {
                placeholder = Html.Encode(placeHolder),
                @class = "js-text-option-text",
                @onchange = "javascript:alert('excellent!!!')"})
}

最后,我的HTML帮助代码:

static void CreateClearableTextBoxFor(object htmlAttributes, 
            decimal? additionalCost, out IDictionary<string, object> attrs,  
            out string anchorHtml)
    {
        attrs = new RouteValueDictionary(htmlAttributes);
        if (attrs.ContainsKey("class"))
            attrs["class"] = String.Concat("js-text-option-clear ", attrs["class"]);
        else
            attrs.Add("class", "js-text-option-clear");

        var anchor = new TagBuilder("a");
        anchor.AddCssClass("js-text-option-clear-button text-option-clear js-toolTip tool-tip");
        anchor.Attributes.Add("title", "Clear");
        if (additionalCost != null && additionalCost > 0)
        {
            anchor.Attributes.Add("data-additionalcost", additionalCost.ToString());
        }
        anchorHtml = anchor.ToString();
    }

此代码编译正常,并在屏幕上呈现,但是当我更改控件中的文本时,不会触发onchange事件。

我查看了生成的hmtl输出,看看onchange事件根本没有呈现。

有人可以指出正确的方向。

1 个答案:

答案 0 :(得分:0)

我想我已经把它整理出来了。

我所做的代码更改如下。在HMTL助手中我添加了:

attrs = new RouteValueDictionary(htmlAttributes);
if (attrs.ContainsKey("class"))
    attrs["class"] = String.Concat("js-text-option-clear ", attrs["class"]);
else
    attrs.Add("class", "js-text-option-clear"); 

 /* NEW LINE BELOW */
 attrs.Add("onchange", "javascript:alert('Booooooom');");

这会导致onchange事件正确触发。