RadCalendar API Questions

10 posts, 0 answers
  1. Dan Cornish
    Dan Cornish avatar
    28 posts
    Member since:
    Apr 2010

    Posted 27 Jan 2016 Link to this post

    Greetings,

    I know it's not "officially" released yet but I see a lot of potential with this control.  So I'm wondering when the API for the RadCalendar be more mature?

    For example, I can't find it anywhere in the documentation how to:

    1. How do I programmatically select a date on the calendar?

    2. How do I get the selected date on the calendar when not in the dateSelected event handler?  I see from the example on using args.date within the event handler, but I'm wondering how to get the selected date when not in dateSelected.

    3. How do I default the viewMode to Week?  I can change the view mode in the page loaded event. However I can see the calendar shrink down to Week mode from month view when the page is loaded, which is not desirable.

     

    Thanks,
    Dan

  2. Nick
    Admin
    Nick avatar
    593 posts

    Posted 28 Jan 2016 Link to this post

    Hi Dan,

    Setting a selected date should be done by setting the selectedDate property of RadCalendar. You can do that at any given moment once the Calendar has been initialized. 

    As to the view mode, this is a bug. I have logged it and we will fix it as soon as possible.

    Hope this helps. 

    Regards,
    Nick
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Dan Cornish
    Dan Cornish avatar
    28 posts
    Member since:
    Apr 2010

    Posted 31 Jan 2016 in reply to Nick Link to this post

    Thanks.  I can indeed set the selected date using selectedDate.

    However, what about my second question, how do I get the selected date?  I've tried the same code but it doesn't work.  For example, the following code: 

     

    exports.dateSelection = function (args) {
        console.log("args.date = " + args.date);
        console.log("selectedDate  = " + page.getViewById("calendar").selectedDate);
        console.log("another try = " + view.getViewById(page, "calendar").selectedDate);
    }

    When I select a date using the calendar, the following is output to the console.  Why don't the lines in bold return the selected date?

    JS: args.date = Fri Feb 05 2016 00:00:00 GMT-0500 (EST)
    JS: selectedDate  = undefined
    JS: another try = undefined

     

    Thanks

    PS: Those lines don't return the selected date in any other function either.

     

  4. Bulent
    Admin
    Bulent avatar
    29 posts

    Posted 03 Feb 2016 Link to this post

    Hello Dan,

    From the snippet of code I can guess only that the calendar view you use doesn't have an "id" property set to "calendar" string. Could you check the id you use for calendar view in xml. 
    Another way to get the selected date in event handler is to use args.object that points to RadClendar instance. You will have an access to all exposed properties.

    I hope this helps. The calendar control is under development, stay tuned for official release.

    Regards,
    Bulent
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Dan Cornish
    Dan Cornish avatar
    28 posts
    Member since:
    Apr 2010

    Posted 04 Mar 2016 in reply to Bulent Link to this post

    Hi Bulent,

    When is the official release of the calendar control?

    Thanks,
    Dan

  6. Bulent
    Admin
    Bulent avatar
    29 posts

    Posted 07 Mar 2016 Link to this post

    Hi Dan,

    We are going to release officially Telerik NativeScript UI suite at the end of this month.
    It will include calendar control with many new features like styling, transitions, inline events etc.

    Please, stay tuned and follow our releases on npmjs.com

    Regards,
    Bulent
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  7. Brian
    Brian avatar
    8 posts
    Member since:
    Mar 2016

    Posted 13 Mar 2016 in reply to Bulent Link to this post

    Could you please push another release before the end of the month? I really need to work on RadCalendar now and cant reallly wait that long. I dont mind updating my code once official release is out without any breaking changes but at the moment that isnt much to work with.
  8. Nikolay
    Admin
    Nikolay avatar
    1805 posts

    Posted 15 Mar 2016 Link to this post

    Hi Brian,

    Please find the answer to your inquiry in the other forum thread where the same topic is concerned: NativeScript UI Component.

    Regards,
    Nikolay
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  9. Cesar
    Cesar avatar
    1 posts
    Member since:
    May 2015

    Posted 20 Oct Link to this post

    Hi @Nick I have been trying to set up the initial data on angualar-nativescript radcalendar but is not working do you now why ?

     

    this.selectedDate = new Date("Wed Aug 02 2017 06:00:00");// .TS

     

    .HTML

    <RadCalendar #appointmentCalendar [transitionMode]="'Slide'" [selectedDate]="selectedDate" [eventSource]="eventSource" [eventsViewMode]="eventsViewMode" row="0"></RadCalendar>

     

    But my date is not initially set up , I can change it later with goToDate(date); but I want to custom set the initial date , do you know how to do this?

  10. Nikolay Iliev
    Admin
    Nikolay Iliev avatar
    316 posts

    Posted 23 Oct Link to this post

    Hi Dan,

    You should be able to set your selectedDate value through Angular binding just as you did. Keep in mind that the selectedDate is different from the date shown as today.
    In your case, the selectedDate is set to August which means that you will have to scroll manually to August to see the selection or provide logic for your calendar to start with August loaded initially. This is expected behavior and you will need to use goToDate method.

    For example, I have tested the binding of selectedDate property sing this sample.
    <RadCalendar [selectedDate]="selectedDate"></RadCalendar>

    and in the component file
    public selectedDate: Date;
     
    constructor() {
        this.selectedDate = new Date("Wed Oct 02 2017 06:00:00"); ; 
    }

    I have changed to selected date to October so it will be shown initially with the current month loaded. In your case, the month is August which means that you will have to manually load August with the respective method.

    Regards,
    Nikolay Iliev
    Progress Telerik
    Did you know that you can open private support tickets which are reviewed and answered within 24h by the same team who built the components? This is available in our UI for NativeScript Pro + Support offering.
Back to Top