DateTime -> Textbox (jquery!) -> EditorFor (DateTime.ascx) -> add javascript event. How?

I defined this DateTime.ascx

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime?>" %>
<%: Html.TextBox(   string.Empty, 
                    (Model.HasValue ? Model.Value.ToString("dd.MM.yyyy") : string.Empty), 
                    new {   @class = "whatever"

                        }
                 )%>

and the aspx site looks so:

<%: Html.EditorFor(model => model.Data.birthday) %>

The idea is now that a javascript function "ABC()" is called when ever the textbox loses the focus (means "onBlur" event) (ideally: the value of the trextbox is passed to the called function "ABC(birtday.value)") But I would not like to change the DateTime.ascx to end up that ALL(!) EditorFor (for Datetimes) will have an javascript function call!

My tries: This

<%: Html.EditorFor(model => model.Data.birth开发者_Python百科day, "onBlur='javascript:ABC();'", "birthday") %>

results in

<input class="whatever" id="birthday" name="birthday" type="text" value="25.08.2010" />

but the onBlur / javascript function call is not set.

And

<%: Html.EditorFor(model => model.Data.birthday, new { onClick="javascript:ShowHideC1();"} ) %>

doesnt work either.

(Next step is then that this textbox is "of course" a jquery datepicker ;-)

Yes, its stupid to answer the own question, but I want to share my knownledge. ;-)

Solution:

DO NOT use the Html.EditorFor!

use the TextBoxesFor!

<%: Html.TextBoxFor(model => model.Data.birthday, new { onBlur="javascript:ABC();"} )%>

Using the TextBoxFor means that the DateTime.ascx is NOT used. When "...birthday" is set to a non-null value in the Controller is the output not formated as in DateTime.ascx defined. Means also the hours, minutes and times will be displayed. But the OnBlur - event is added! And that was the goal!

Maybe this can help you:

MVC 2 Editor Template with DateTime

You can use Html.EditorFor, but you will have to bind the events separately:

$(document).ready(function () {
 // bind events to template editors
 $("#Data_birthday").bind('blur', ABC);
 $("#Data_birthday").bind('click', ShowHideC1);
}