Our powerful JS Calendar component


Post by Nagesh@Apoorva.com »

When the user double clicks on the Event, automatically New Event text is being assigned and the Event is getting created.
How can we prevent the user doing it?


Post by Animal »


Post by Nagesh@Apoorva.com »

When I double Click on the calendar, we don't want to bind the default value to the New Event Text Field.
How can we do this?


Post by mats »

If you read the docs for https://bryntum.com/docs/calendar/#Calendar/view/Calendar#config-autoCreate you will see it allows you to set the default name

/**
* If this config is set, then the `gesture` configured (which defaults to `dblclick`) creates a
* new event at the event's time point.
*
* The exact time is rounded to the closest specified `step` value.
*
* The duration of the created event is the specified `duration` value.
*
* If this is specified as a string, the string becomes the `gesture`, and the other properties
* are the default values listed below.
*
* @property {String} [autoCreate.gesture='dblclick'] The event name which should trigger event creation at the event's position.
* @property {String} [autoCreate.newName='New Event'] The name of an event created using `autoCreate` or a function to call which yields the name.
* @property {String} [autoCreate.step='15 minutes'] The time unit by which to round the start click point of auto created events.
* _Only for views which have a granularity of less than one day such as `WeekView` and `DayView'_.
*
* For views which show whole days, the start defaults to 8am.
*
* This is a string in the format required by {@link Core.helper.DateHelper#function-parseDuration-static}.
* @property {String} [autoCreate.duration='1 hour'] The default duration for auto created events.
* @property {Number} [autoCreate.startHour=8] The default start hour for auto created events
* in views where the time granularity is one day. In a DayView or WeekView where a mouse event position
* will translate to a time of day, this is not used.
*
* This is the hour of the day to start the event at. It may be fractional.
*
* This is a string in the format required by {@link Core.helper.DateHelper#function-parseDuration-static}.
* @config {Object|String}
* @default
*/

Post by Nagesh@Apoorva.com »

Do we need to turn off the property with Null or None?
[autoCreate.gesture='dblclick']

Do you have an example to see before and after in the samples that you have?

We have tried, but didn't worked for us.


Post by mats »

When you say you tried, can you please show us the code showing how you tried?


Post by Nagesh@Apoorva.com »

Do we need to make the changes in the UMD JS file or in the specific file that we are using?
If you have an example, can you provide? Which file to make the changes?
The referred document is some what confusing the developers.
Highly appreciate if you can provide us with an example in the PenCode example.


Post by Nagesh@Apoorva.com »

Hi,
When we double click on the calendar a new event is firing and creating an event, and we want the event to be created only when we click on save in the event edit or event add popup. Do we have an option to disable the auto event creation?
please find the below code as a reference with the calendar declaration that we are using. Please suggest necessary changes in our code to achieve the desired functionality.

const calendar = new Calendar({
    project: {
        resourcesData: GetUsers(),
        eventsData: events,
    },
    date: new Date(),
    crudManager: {
        resourceStore: {
            fields: [
                { name: 'id', dataSource: 'id' },
                { name: 'name', dataSource: 'name' }
            ]
        },
        eventStore: {
            fields: [{ name: 'resourceField', defaultValue: 3 },
            { name: 'resourceCombo', defaultValue: "Event" }
            ],
        },
        transport: {
            sync: {
                url: '/Scheduler/sync',
                params: {
                    UserProfileId: GetMyID(),
                    AccountId: GetMyAccountId(),
                    SiteId: GetMySiteId()
                }
            }
        },
        autoLoad: true,
    },
    appendTo: 'container',
    features: {
        eventEdit: {
            showRecurringUI: false,
            items: {
                resourceField: {
                    hidden: true
                },
            }
        },
        eventTooltip: {
            showOn: 'hover',
            align: 'l-r',
            minWidth: null,
            tools: {
                left: {
                    cls: 'b-fa b-fa-angle-left',
                    weight: 20,
                    tooltip: 'Move event earlier by 30 minutes',
                    handler: function handler() {
                        this.eventRecord.shift(-0.5);
                    }
                },
                right: {
                    cls: 'b-fa b-fa-angle-right',
                    weight: 10,
                    tooltip: 'Move event later by 30 minutes',
                    handler: function handler() {
                        this.eventRecord.shift(0.5);
                    }
                }
            },
            renderer: data => `<dl>
                <dt>Assigned to:
                <dd>
                    ${data.eventRecord.AssignedTo}</dd>
                </dt>
                <dt>Time:</dt>
                <dd>
                    ${DateHelper.format(data.eventRecord.startDate, 'LT')} - ${DateHelper.format(data.eventRecord.endDate, 'LT')}
                </dd>
                <dt>Note:</dt>
                <dd>${data.eventRecord.Notes}</dd>
                <dt>Link:</dt>
                <dd>${data.eventRecord.RedirectUrl}</dd>
                ${data.eventRecord.get('note') ? `<dt>Note:</dt><dd>${data.eventRecord.Notes}</dd>` : ''}
            </dl>
            `
        }
    }
});
calendar.crudManager.autoSync = true;
window.calendar = calendar;

Post by mats »

Sorry, no the event will be created right away but it won't be saved by our data layer since we know it's "being created".


Post by Nagesh@Apoorva.com »

Can you be more clear on the last comment?

How can we stop the Creation of the Event until the Save Button is clicked? An example from the Support or Development team would be highly appreciated.

Because we are not able to figure out on how to stop it, there are so many unwanted events are getting created by users.


Post Reply