jQuery UI Widgets Forums Scheduler recurrencePattern

This topic contains 5 replies, has 3 voices, and was last updated by  gduncan 6 years, 5 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • recurrencePattern #90839

    Markk
    Participant

    Hi,

    i have a problem with recurrenceRule, the recurrence does not display, do you have any idea ?

    HTML:

    var appointment37 = {
    id: “200511”,
    subject: “test”,
    location: “EBALI326354″,
    address: ” “,
    description: ” “,
    recurrenceRule: “DTSTART=20170111T050000Z;UNTIL=99991231T050000Z;COUNT=3;FREQ=DAILY;BYDAY=SU,MO,TU,WE,TH,FR,SA;WKST=0;INTERVAL=1”,
    status: “busy”,
    IDPT_Task: “200511”,
    calendar: “Roger Caron”,
    start: new Date(2017, 0, 11, 0, 0, 0),
    end: new Date(2017, 0, 11, 0, 0, 0)

    Code:

    dataFields: [
    { name: ‘id’, type: ‘string’ },
    { name: ‘IDPT_Task’, type: ‘string’ },
    { name: ‘status’, type: ‘string’ },
    { name: ‘address’, type: ‘string’ },
    { name: ‘Details’, type: ‘string’ },
    { name: ‘description’, type: ‘string’ },
    { name: ‘prenom’, type: ‘string’ },
    { name: ‘nom’, type: ‘string’ },
    { name: ‘TicketNumber’, type: ‘string’ },
    { name: ‘subject’, type: ‘string’ },
    { name: ‘location’, type: ‘string’ },
    { name: ‘style’, type: ‘string’ },
    { name: ‘recurrenceRule’, type: ‘string’ },
    { name: ‘recurrenceException’, type: ‘string’ },
    { name: ‘calendar’, type: ‘string’ },
    { name: ‘start’, type: ‘date’, format: “yyyy-MM-dd HH:mm” },
    { name: ‘end’, type: ‘date’, format: “yyyy-MM-dd HH:mm” },

    and

    appointmentDataFields:
    {
    from: “start”,
    to: “end”,
    id: “id”,
    location: “location”,
    calendar: “calendar”,
    prenom: “prenom”,
    nom: “nom”,
    subject: “subject”,
    address:”TypeTicket”,
    description: “description”,
    style: “style”,
    status: “status”,
    IDPT_Task: “IDPT_Task”,
    resourceId: “calendar”,
    recurrencePattern: “recurrenceRule”,
    recurrenceException: “recurrenceException”

    },

    recurrencePattern #90843

    Peter Stoev
    Keymaster

    Hi Markk,

    May be because the start and end dates are equal. Also that format: “yyyy-MM-dd HH:mm” has nothing common with your start and end dates objects.

    Sample with your recurrence rule:

    $(document).ready(function () {
        var appointments = new Array();
    
        var appointment1 = {
        id: "id1",
        description: "George brings projector for presentations.",
        location: "",
        subject: "Quarterly Project Review Meeting",
        calendar: "Room 1",
        recurrencePattern: "DTSTART=20170111T050000Z;UNTIL=99991231T050000Z;COUNT=3;FREQ=DAILY;BYDAY=SU,MO,TU,WE,TH,FR,SA;WKST=0;INTERVAL=1",
        start: new Date(2017, 10, 23, 9, 0, 0),
        end: new Date(2017, 10, 23, 16, 0, 0)
    }
    
    appointments.push(appointment1);
    
    // prepare the data
    var source =
    {
        dataType: "array",
        dataFields: [
            { name: 'id', type: 'string' },
            { name: 'description', type: 'string' },
            { name: 'location', type: 'string' },
            { name: 'subject', type: 'string' },
            { name: 'calendar', type: 'string' },
            { name: 'recurrencePattern', type: 'string' },
            
            { name: 'start', type: 'date' },
            { name: 'end', type: 'date' }
        ],
        id: 'id',
        localData: appointments
    };
    var adapter = new $.jqx.dataAdapter(source);
    $("#scheduler").jqxScheduler({
        date: new $.jqx.date(2015, 11, 23),
        width: 850,
        height: 600,
        source: adapter,
        view: 'weekView',
        appointmentTooltips: false,
        showLegend: true,
        ready: function () {
            $("#scheduler").jqxScheduler('ensureAppointmentVisible', 'id1');
        },
        resources:
        {
            colorScheme: "scheme05",
            dataField: "calendar",
            source:  new $.jqx.dataAdapter(source)
        },
        appointmentDataFields:
        {
            from: "start",
            to: "end",
            id: "id",
            description: "description",
            recurrencePattern: "recurrencePattern",
            location: "place",
            subject: "subject",
            resourceId: "calendar"
        },
        views:
        [
            'dayView',
            'weekView',
            'monthView'
        ]
    });
    });

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    recurrencePattern #90857

    Markk
    Participant

    Thank you Peter,

    I have tested with your code and that works well, but when I modify my code I have the following error:

    Loading…

    jqxscheduler.api.js:7 Uncaught TypeError: c.recurrencePattern.setFrom is not a function
    at new a.jqx.scheduler.appointment

    Do you have any idea ?

    var appointment10 = {
    id: “145389”,
    subject: “test reccurence”,
    location: “EBALI”,
    address: ” “,
    description: ” “,
    prenom: “ccc”,
    nom: “fff”,
    //status: “tentative”,
    recurrencePattern: “DTSTART=20161230T050000Z;UNTIL=99991231T050000Z;COUNT=5;FREQ=WEEKLY;BYDAY=FR;WKST=0;INTERVAL=1”,
    status: “busy”,
    IDPT_Task: “145389”,
    calendar: “test”,
    start: new Date(2016, 11, 30, 0, 0, 0),
    end: new Date(2016, 11, 30, 0, 0, 0)

    }

    // prepare the data
    var source =
    {
    dataType: ‘json’,
    dataFields: [
    { name: ‘id’, type: ‘string’ },
    { name: ‘IDPT_Task’, type: ‘string’ },
    { name: ‘status’, type: ‘string’ },
    { name: ‘address’, type: ‘string’ },
    { name: ‘Details’, type: ‘string’ },
    { name: ‘description’, type: ‘string’ },
    { name: ‘prenom’, type: ‘string’ },
    { name: ‘nom’, type: ‘string’ },
    { name: ‘TicketNumber’, type: ‘string’ },
    { name: ‘subject’, type: ‘string’ },
    { name: ‘location’, type: ‘string’ },
    { name: ‘style’, type: ‘string’ },
    { name: ‘recurrencePattern’, type: ‘string’ },
    { name: ‘calendar’, type: ‘string’ },
    { name: ‘start’, type: ‘date’ },
    { name: ‘end’, type: ‘date’ },
    ],
    id: ‘id’,
    //url: ‘data.php’,
    localData: appointments,

    appointmentDataFields:
    {
    from: “start”,
    to: “end”,
    id: “id”,
    location: “location”,
    calendar: “calendar”,
    prenom: “prenom”,
    nom: “nom”,
    subject: “subject”,
    address:”TypeTicket”,
    recurrencePattern: “recurrencePattern”,
    description: “description”,
    style: “style”,
    status: “status”,
    IDPT_Task: “IDPT_Task”,
    resourceId: “calendar”

    },

    recurrencePattern #90860

    Peter Stoev
    Keymaster

    Hi Markk,

    I would suggest you using tools like ESLint to check for errors in your code, because { name: ‘end’, type: ‘date’ }, ], represents a syntax error. Anyway, based on your code, below is a working demo:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title id='Description'>jqxScheduler Recurring appointments example
        </title>
    		<meta name="description" content="Javascript Scheduler Recurring Appointments example" /> 
        <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
        <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
        <script type="text/javascript" src="../../scripts/demos.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdate.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxscheduler.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxscheduler.api.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxnumberinput.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxradiobutton.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxinput.js"></script>
        <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script>
        <script type="text/javascript" src="../../jqwidgets/globalization/globalize.culture.de-DE.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                var appointments = new Array();
                var appointment1 = {
                    id: "145389",
                    subject: "test reccurence",
                    location: "EBALI",
                    address: " ",
                    description: " ",
                    prenom: "ccc",
                    nom: "fff",
                    //status: "tentative",
                    recurrencePattern: "DTSTART=20161230T050000Z;UNTIL=99991231T050000Z;COUNT=5;FREQ=WEEKLY;BYDAY=FR;WKST=0;INTERVAL=1",
                    status: "busy",
                    IDPT_Task: "145389",
                    calendar: "test",
                    start: new Date(2016, 11, 30, 0, 0, 0),
                    end: new Date(2016, 11, 30, 0, 0, 0)
                }
    
                appointments.push(appointment1);
    
                // prepare the data
                var source =
                {
                    dataType: "array",
                    dataFields: [
                        { name: 'id', type: 'string' },
                        { name: 'description', type: 'string' },
                        { name: 'location', type: 'string' },
                        { name: 'subject', type: 'string' },
                        { name: 'calendar', type: 'string' },
                        { name: 'recurrencePattern', type: 'string' },
                        { name: 'recurrenceException', type: 'string' },
                        { name: 'style', type: 'string' },
                        { name: 'start', type: 'date' },
                        { name: 'end', type: 'date' }
                    ],
                    id: 'id',
                    localData: appointments
                };
                var adapter = new $.jqx.dataAdapter(source);
                $("#scheduler").jqxScheduler({
                    date: new $.jqx.date(2016, 12, 30),
                    width: 850,
                    height: 600,
                    source: adapter,
                    ready: function()
                    {
                        $("#scheduler").jqxScheduler('ensureAppointmentVisible', 'id7');
                    },
                    appointmentDataFields:
                    {
                        from: "start",
                        to: "end",
                        id: "id",
                        description: "description",
                        location: "place",
                        style: "style",
                        subject: "subject",
                        resourceId: "calendar",
                        recurrencePattern: "recurrencePattern",
                        recurrenceException: "recurrenceException"
                    },
                    view: "weekView",
                    views:
                    [
                        'dayView',
                        'weekView',
                        'monthView'
                    ]
                });
            });
        </script>
    </head>
    <body class='default'>
        <div id="scheduler"></div>
    </body>
    </html>
    

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    recurrencePattern #90867

    Markk
    Participant

    Thank Peter,

    I found the problem.

    The solution was :

    <?php if ($row[“recurrenceRule”] !=” && $row[“recurrenceRule”] !=’ ‘) { ?>
    recurrencePattern: “<?php echo $row[“recurrenceRule”];?>”,
    <?php } ?>

    Have a good day

    recurrencePattern #100174

    gduncan
    Participant

    I know this is a very old post but I ran into the same issue with the error message “c.recurrencePattern.setFrom is not a function” and this was the only post that mentions the error. At first it didn’t help me figure out my issue because I’m using .Net rather than PHP as my backend code but I eventually got it.

    You cannot return an empty string for the recurrencePattern. You can return NULL.

    In my opinion this is a bug in the system. The jqxScheduler should treat an empty string in the recurrencePattern as if it were NULL.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.