How to have a datepicker for a DateTime field in a custom module - Front- & Back-End Development - Front- & Back-End Development - Progress Community
 Front- & Back-End Development

How to have a datepicker for a DateTime field in a custom module

  • How to have a datepicker for a DateTime field in a custom module
  • Hi,

    I have developed a custom module and it contains a date field. Now when the Create item dialog opens, it has just a textbox to type in the date. If the format of the date typed is different it wont save the record. So how can I have a date picker for the date file so the users can pick the date and no chance for manual errors?

    Thanks,
    Duneel
  • Hi Duneel,

    You can use DateFieldElement

    var eventStart = new DateFieldElement(mainSection.Fields)
           
               ID = "StartDate",
               DataFieldName = "Start",
               Title = "StartDate",
               DisplayMode = displayMode,
               ResourceClassId = typeof(MyModuleResources).Name,
               WrapperTag = HtmlTextWriterTag.Li,
               CssClass = "sfFormSeparator",
           ;


    Kind regards,
    Ivan Dimitrov
    the Telerik team
  • Thanks Ivan. It worked!!
  • Hi Ivan,

    How do I configure the DateFieldElement to display only the date? Currently It is showing both date and time and it have two buttons, one for the calendar and the other for time.

    Thanks,
    Duneel
  • Hello Duneel,

    The DateFieldElement uses RadDateTimePicker and it is not possible to set the control to show only dates for the built-in control.

    Regards,
    Ivan Dimitrov
    the Telerik team
  • Hi Ivan,

    Is there any other element that I can use which has only the calendar?

    Thanks,
    Duneel
  • Hello Duneel,

    I do no thing that we have a date picker only.

    Greetings,
    Ivan Dimitrov
    the Telerik team
  • Hey Ivan,

    Love that picker.  Question is, how do you use the output from it? 

    Storing the output as a string gives you "/Date(1301626800000)/".  Should that be stored as a date in SQL instead?

    Thanks

    - William
  • Um, nevermind :)  Stupid question.  Of course you do.

    Thanks, Ivan!
  • 266563_CustomModule-DateFieldElement.jpg
    Hi Ivan,

    I've upgrated a custom module to 4.1 and now my date fields are appearining differenty on backend views. See the attached screenshot.

    It has some other problems too. Now by default it is set to 1901/1/1 where as in 4.0 it was defaulted to the current system date. Now there aren't buttons to open the callendar. It openes only when the textfield get focused, with this it's really difficult to manually enter/modify the date. Another issue is the calendar controls seems very complex now and it overlaps with other buttons on the page.

    Is it possible to have the carendar working as before with the same look and feel?

    this is how I'm defining the date field in my custom modules definitions class.

    var releasedateField = new DateFieldElement(mainSection.Fields)
            
                ID = "releasedateFieldControl",
                DataFieldName = "ReleaseDate",
                DisplayMode = displayMode,
                Title = "ReleaseDate",
                //CssClass = "sfTxt",
                ResourceClassId = typeof(BrightcoveVideoResources).Name,
                WrapperTag = HtmlTextWriterTag.Li,
      
            ;


    Thanks,
    Duneel
  • Thanks, Ivan.  This code was just what I needed.