jQuery UI Widgets Forums Scheduler jquery3.js:2 Uncaught RangeError: Maximum call stack size exceeded

This topic contains 4 replies, has 2 voices, and was last updated by  Hristo 5 years, 4 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author

  • ghenne
    Participant

    We are getting this message intermittently. We have not been able to reproduce it yet.

    Here’s the complete error message:

    jquery3.js:2 Uncaught RangeError: Maximum call stack size exceeded
        at oe.select (jquery3.js:2)
        at Function.oe [as find] (jquery3.js:2)
        at w.fn.init.find (jquery3.js:2)
        at new w.fn.init (jquery3.js:2)
        at w (jquery3.js:2)
        at c.(:49742/Vertrieb/anonymous function)._renderMonthAppointments (http://127.0.0.1:49742/Vertrieb/node_modules/jqwidgets-framework/jqwidgets/jqxscheduler.js:8:250161)
        at c.(:49742/Vertrieb/anonymous function)._renderAppointments (http://127.0.0.1:49742/Vertrieb/node_modules/jqwidgets-framework/jqwidgets/jqxscheduler.js:8:237281)
        at c.(:49742/Vertrieb/anonymous function)._renderrows (http://127.0.0.1:49742/Vertrieb/node_modules/jqwidgets-framework/jqwidgets/jqxscheduler.js:8:213709)
        at c.(:49742/Vertrieb/anonymous function)._updatecolumnwidths (http://127.0.0.1:49742/Vertrieb/node_modules/jqwidgets-framework/jqwidgets/jqxscheduler.js:8:274794)
        at c.(:49742/Vertrieb/anonymous function)._updateScrollbars (http://127.0.0.1:49742/Vertrieb/node_modules/jqwidgets-framework/jqwidgets/jqxscheduler.js:8:35546)

    The initialization code is straightforward. Note that your editor does not display the JavaScript string interpolation character properly: it substitutes .

    
     element.jqxScheduler({
        date: new JqxDate('todayDate'),
        appointmentDataFields: {
          from: 'from',
          to: 'to',
          id: 'id',
          description: 'description',
          subject: 'subject',
          resourceId: 'calendar',
          draggable: 'draggable',
          email: 'email',
          address: 'address',
          phone: 'phone',
        },
        source: adapter,
        resources: {
          colorScheme: 'scheme05',
          dataField: 'calendar',
          source: new JqxDataAdapter(source),
        },
        editDialog: true,
        editDialogCreate: frmCalendar.editDialogCreate,
        editDialogOpen: ((dialog, fields, editAppointment) => {
          if (editAppointment) {
            jqxSchedulerSubject.innerHTML = <code>${editAppointment.subject}</code>;
            jqxSchedulerFrom.innerHTML = <code>${editAppointment.from}</code>;
            jqxSchedulerTo.innerHTML = <code>${editAppointment.to}</code>;
            jqxSchedulerDescription.innerHTML = <code>${editAppointment.description}</code>;
            jqxSchedulerCalendar.innerHTML = <code>${editAppointment.resourceId}</code>;
            jqxSchedulerEmail.innerHTML = <code><a href='mailTo:${editAppointment.email}'>${editAppointment.email}</a></code>;
            jqxSchedulerAddress.textContent = editAppointment.address;
            jqxSchedulerPhone.innerHTML = <code><a href='tel:${editAppointment.phone}'>${editAppointment.phone}</a></code>;
          }
        }),
        contextMenu: false,
      });
    

    editDialogCreate is called out, but doesn't seem to do anything fancy:

    frmCalendar.initScheduler = (dataSet, element) => {
      'use strict';
    
      $(<code>#${element[0].id}</code>).off('cellDoubleClick');
      $(<code>#${element[0].id}</code>).on('cellDoubleClick', () => {
        element.jqxScheduler({
          editDialog: false,
        });
      });
    
      $(<code>#${element[0].id}</code>).off('appointmentDoubleClick');
      $(<code>#${element[0].id}</code>).on('appointmentDoubleClick', () => {
        element.jqxScheduler({
          editDialog: true,
        });
      });
    
      dataSet.forEach((appt) => {
        const appointment = {
          id: appt.id,
          description: appt.comment,
          location: '',
          subject: appt.cardName,
          calendar: appt.type,
          from: new Date(appt.date),
          to: new Date(appt.date),
          draggable: false,
          email: appt.contact.mail,
          address: <code>${appt.address.address2}, ${appt.address.address3}</code>,
          phone: appt.contact.phone,
        };
        frmCalendar.appointments.push(appointment);
      });
    
      const 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: 'from', type: 'date' },
          { name: 'to', type: 'date' },
          { name: 'draggable', type: 'boolean' },
          { name: 'email', type: 'string' },
          { name: 'address', type: 'string' },
          { name: 'phone', type: 'string' },
        ],
        id: 'id',
        localData: frmCalendar.appointments,
      };
    
      const JqxDataAdapter = $.jqx.dataAdapter;
      const JqxDate = $.jqx.date;
      const adapter = new JqxDataAdapter(source);
    
      element.jqxScheduler({
        date: new JqxDate('todayDate'),
        appointmentDataFields: {
          from: 'from',
          to: 'to',
          id: 'id',
          description: 'description',
          subject: 'subject',
          resourceId: 'calendar',
          draggable: 'draggable',
          email: 'email',
          address: 'address',
          phone: 'phone',
        },
        source: adapter,
        resources: {
          colorScheme: 'scheme05',
          dataField: 'calendar',
          source: new JqxDataAdapter(source),
        },
        editDialog: true,
        editDialogCreate: frmCalendar.editDialogCreate,
        editDialogOpen: ((dialog, fields, editAppointment) => {
          if (editAppointment) {
            jqxSchedulerSubject.innerHTML = <code>${editAppointment.subject}</code>;
            jqxSchedulerFrom.innerHTML = <code>${editAppointment.from}</code>;
            jqxSchedulerTo.innerHTML = <code>${editAppointment.to}</code>;
            jqxSchedulerDescription.innerHTML = <code>${editAppointment.description}</code>;
            jqxSchedulerCalendar.innerHTML = <code>${editAppointment.resourceId}</code>;
            jqxSchedulerEmail.innerHTML = <code><a href='mailTo:${editAppointment.email}'>${editAppointment.email}</a></code>;
            jqxSchedulerAddress.textContent = editAppointment.address;
            jqxSchedulerPhone.innerHTML = <code><a href='tel:${editAppointment.phone}'>${editAppointment.phone}</a></code>;
          }
        }),
        contextMenu: false,
      });
    };

    What could it be?

    • This topic was modified 5 years, 4 months ago by  ghenne.
    • This topic was modified 5 years, 4 months ago by  ghenne.

    Hristo
    Participant

    Hello ghenne,

    Could you provide us with more details? Which framework do you use?
    I saw that you try to set current date but our object to do this is new $.jqx.date().
    Also, another thing you use some “initScheduler()” function.
    I would like to mention that it is important to initialize one widget just once otherwise this could be a reason for many issues.
    If you want to have some reactions with and on the jqxScheduler you should use its events and methods.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com


    ghenne
    Participant

    The project is developed using NSB/AppStudio. Most of the other controls are Bootstrap 4.

    I’ll fix the date.

    Yes, it’s possible that the widget is being initialized more than once. I’ll fix that too, and report back if that does not fix the issue.


    ghenne
    Participant

    What is the proper way to update the data on a jqxScheduler after it has been displayed already?

    Edit: I believe I have found the answer:

    adapter = new $.jqx.dataAdapter(source);
     $("#scheduler").jqxScheduler('source', adapter);
    • This reply was modified 5 years, 4 months ago by  ghenne.

    Hristo
    Participant

    Hello ghenne,

    Yes, this is a good approach.
    Also, you could use it on that way:
    $("#scheduler").jqxScheduler({ source: adapter });.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com

    • This reply was modified 5 years, 4 months ago by  Hristo.
Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.