[Solved] How To Use MVC DatePicker From C#

[Dimitri]

Hi There,

I would like to know how to use properly the telerik DatePicker from C# code.

Here is a sample of the HtmlHelper that i have written:

public static CustomTelerikDatePickerFor<TModel>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, object>> expression)
{
    string fieldName = "My Custom Name";
    //Build the telerik DatePicker
   Telerik.Web.Mvc.UI.ClientSideObjectWriterFactory clientSideObjectWriterFactory = new Telerik.Web.Mvc.UI.ClientSideObjectWriterFactory();
    //Create a new instance of the DataPicker
   Telerik.Web.Mvc.UI.DatePicker datePicker = new Telerik.Web.Mvc.UI.DatePicker(htmlHelper.ViewContext,clientSideObjectWriterFactory);
   //Customize the name
    datePicker.Name = HtmlHelperHelpers.CustomizeFieldName(fieldName, htmlHelper.ViewData);

    Telerik.Web.Mvc.UI.Html.DatePickerHtmlBuilder datePickerHtmlBuilder = new Telerik.Web.Mvc.UI.Html.DatePickerHtmlBuilder(datePicker);
    //render all the telerik's datepicker markup
    var result = datePickerHtmlBuilder.Build();

    //return the built tag
    return MvcHtmlString.Create(result.ToString());
}

using this bit of code the telerik MVC DatePicker renders properly on my web page but none of the client side events works.

Is it because i did not used clientSideObjectWriterFactory correctly ? Or am I missing something in my code?

Kind Regards,

[Daniel]

Hi Dimitri,

I am not sure if I understand your question correctly. If you want to define a HtmlHelper based on the Telerik DatePicker which accepts extra arguments or sets default options you should return a DatePickerBuilder object. For example:

//Helper
public static DatePickerBuilder DatePicker(this HtmlHelper htmlhelper)
{
    DatePickerBuilder datePicker = htmlhelper.Telerik().DatePicker();
    datePicker.Value(DateTime.Now.AddYears(1));
    datePicker.ClientEvents(events => events.OnChange("onChange"));
    return datePicker;
}
//View
@(
    Html.DatePicker().Name("picker")
 )

If this is not the case, I will need some more information on how do you intend to use it in order to assist you further.

All the best,
Daniel
the Telerik team

[Dimitri]

Hi Daniel,

Thanks for your help, i've tried your example and i can't find where the Telerik extension method lives
DatePickerBuilder datePicker = htmlhelper.Telerik().DatePicker(); 

Error 14 'System.Web.Mvc.HtmlHelper' does not contain a definition for 'Telerik' and no extension method 'Telerik' accepting a first argument of type 'System.Web.Mvc.HtmlHelper' could be found (are you missing a using directive or an assembly reference?)

so i would like to know which version of the dll do you use?

i'm currently using the version 2011.2.712.340

[Daniel]

Hi Dimitri,

You should include the following assemblies when defining such extensions:

1. Telerik.Web.Mvc.UI
2. Telerik.Web.Mvc.UI.Fluent
3. System.Web.Mvc

Greetings,
Daniel
the Telerik team

[Dimitri]

Thanks a lot Daniel !

Now I am able to achieve what i wanted :)

public static MvcHtmlString CustomTelerikDatePickerFor<TModel>(thisHtmlHelper<TModel> htmlHelper, Expression<Func<TModel, object>> expression)
{
   ... code ommited ...
   string customizedName = HtmlHelperHelpers.CustomizeFieldName(fieldName, htmlHelper.ViewData);
   //Build the telerik DatePicker
   DatePickerBuilder datePicker = htmlhelper.Telerik().DatePicker();
   //Customize the name
   datePicker.Name(customizedName);
   datePicker.Value(defaultDate());

   //Build my custom tag that will contains the telerik datepicker
    TagBuilder datePickerBox = new TagBuilder("div");
    datePickerBox.AddCssClass(customizedName);
    datePickerBox.InnerHtml = datePicker.ToHtmlString();

   //return the built tag
   return MvcHtmlString.Create(datePickerBox.ToString());
}