We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

How to disable creating multiple appointments in the same cell

Hi,
I am developing an online tennis booking application on an hourly basis, so I set the Scheduler as follows:
        .......
        .TimeScale(f => f.minorSlotCount(1).majorSlot(60).minorSlotTemplateId(null).majorSlotTemplateId(null))

I have two issues to cope with:
1).
On the Week tab, when I navigate clicking the dateTimePicker,  the height of the appointment cells shrinks while the hour cell heights remain the same. To reallineate their heights again, I have to click some other tab - Day, Month, etc and then the Week tab again.

2).
I saw that the appointment width is smaller the that of the cell containing it. If the remaining part is clicked, that allows creating of another appointment in the same cell, which I'd like to disable.

Thank you,
Victor Ghero

4 Replies

VI victor January 11, 2017 01:07 PM UTC

It's me again - Victor Ghero- with regards of the first issue:
I tested your Time Scale Demo Scheule and it works fine, but the difference is that while yours works with 24 hours set, mine has  .StartHour(8) and .EndHour(22)




KK Karthigeyan Krishnamurthi Syncfusion Team January 12, 2017 11:38 AM UTC

   
Thank you for contacting Syncfusion support.   
   
Please find the following responses for your queries.   
   
Query1:  Height of the appointment cells shrinks   
   
We have checked your scenario and unable to reproduce the reported issue at our end and instead of that, cells are misaligned initially as shown in the below image.  We request you to conform whether this kind of issue is facing at your end?   
 
 
 
Query2: Single appointment in single cell   
   
Kindly include the below CSS class in your project to avoid multiple creation of an appointment in a single cell. We have prepared a sample for your reference which can be viewed from the below location:   
 
<Code> 
<style> 
.e-appointment { 
            width: 100% !important; 
       } 
    </style> 
</Code> 

Regards, 
Karthigeyan 



VI victor January 12, 2017 12:05 PM UTC

Hi,
First of all I'd like to thank you for your support. I really appreciate it.

For the first issue, cell disalignment, I copied below the Schedule settings:
    <div>
        @(Html.EJ().Schedule("Schedule1")
        .Width("100%")
        .Height("525px")
        .CurrentDate(new DateTime(DateTime.Now.Ticks))
        .TimeScale(f => f.minorSlotCount(1).majorSlot(60).minorSlotTemplateId(null).majorSlotTemplateId(null))
        .ShowQuickWindow(true)
        .StartHour(8)
        .EndHour(22)
        .TimeMode(TimeMode.Hour24)
        .ShowAllDayRow(false)
        .AllowDragDrop(false)
        .Locale("it-IT")
        .ShowCurrentTimeIndicator(true)
        .EnableAppointmentNavigation(false)
        .EnableAppointmentResize(false)
        .ShowDeleteConfirmationDialog(true)
        //.MinDate(new DateTime(DateTime.Now.Ticks))
        .AppointmentSettings(fields => fields.Datasource((IEnumerable)ViewBag.datasource)
            .Id("PrenotazioneId")
            .Subject("Subject")
            .StartTime("StartTime")
            .EndTime("EndTime")
            .Description("Description")
            .AllDay("AllDay")
            .Recurrence("Recurrence")
            .RecurrenceRule("RecurrenceRule")
            )
            .ScheduleClientSideEvents(evt =>
            evt.Create("onCreate")
            .CellClick("onCellClick")
            .AppointmentClick("onAppointmentClick")
            .CellDoubleClick("onCellDoubleClick")
            .AppointmentWindowOpen("onAppointmentWindowOpen")
            .BeforeAppointmentCreate("onBeforeAppointmentCreate")
            .BeforeAppointmentChange("onBeforeAppointmentChange")
            .BeforeAppointmentRemove("onBeforeAppointmentRemove")
            .AppointmentChanged("onAppointmentChanged")
            .AppointmentCreated("onAppointmentCreated")
            .AppointmentRemoved("onAppointmentRemoved")
            .Resize("onResize")
            .ResizeStart("onResize")
            .ResizeStop("onResize")
            .AppointmentHover("onAppointmentHover")
            )
        )
    </div>
<style>
    .disable {
        pointer-events: none;
        text-shadow: 0px 0px 0px #666;
        opacity: .8;
        color: transparent;
    }
</style>
.........

<script>
        ej.Schedule.Locale["it-IT"] = {
            ReminderWindowTitle: "Promemoria",
            CreateAppointmentTitle: "Crea prenotazione",
            RecurrenceEditTitle: "Cambia la ricorrenza",
            RecurrenceEditMessage: "Come vuoi cambiare la serie?",
            RecurrenceEditOnly: "Solo questa prenotazione",
            RecurrenceEditSeries: "Tutta la serie",
            PreviousAppointment: "Prenotazione precedente",
            NextAppointment: "Prenotazione successiva",
            AppointmentSubject: "Soggetto",
            StartTime: "Ora inizio",
            EndTime: "Ora fine",
            AllDay: "Giornata intera",
            Today: "Oggi",
            Recurrence: "Ricorrenza",
            Done: "Fatto",
            Cancel: "Annulla",
            Ok: "Ok",
            RepeatBy: "Ripetizione",
            RepeatEvery: "ripeti ogni",
            RepeatOn: "ripeti l'operazione per",
            StartsOn: "Inizia da",
            Ends: "Limiti",
            Summary: "Riassunto",
            Daily: "Quotidianamente",
            Weekly: "Settimanale",
            Monthly: "Mensile",
            Yearly: "Annuale",
            Every: "Tutte",
            EveryWeekDay: "Ogni giorno della settimana",
            Never: "Mai",
            After: "Dopo",
            Occurrence: "Occasione",
            On: "Per",
            Edit: "Modifica",
            RecurrenceDay: "Giorno (i)",
            RecurrenceWeek: "Settimana (i)",
            RecurrenceMonth: "Mese (i)",
            RecurrenceYear: "Anno (i)",
            The: "Il",
            OfEvery: "Per ogni",
            First: "Il primo",
            Second: "Secondo",
            Third: "Terzo",
            Fourth: "Quarto",
            Last: "Ultimo",
            WeekDay: "Giorno della settimana",
            WeekEndDay: "Giorno del week-end",
            Subject: "Soggetto",
            Categorize: "Categorie",
            DueIn: "Entro",
            DismissAll: "rejeter tout",
            Dismiss: "Abbandona",
            OpenItem: "Apri l'elemento",
            Snooze: "Riposo",
            Day: "Giorno",
            Week: "Settimana",
            WorkWeek: "Settimana lavorativa",
            Month: "Mese",
            AddEvent: "Aggiungi evento",
            CustomView: "Vista personalizzata",
            Agenda: "Agenda",
            Detailed: "Dettagli",
            EventBeginsin: "L'evento ha inizio dal",
            Editevent: "Modifica evento",
            Editseries: "Modifica serie",
            Times: "volte",
            Until: "Fino a",
            Eventwas: "APpuntamento era",
            Hours: "ore",
            Minutes: "minuti",
            Overdue: "Scaduto",
            Days: "Giorno (i)",
            Event: "Soggetto",
            Select: "Seleziona",
            Previous: "Precedente",
            Next: "Successivo",
            Close: "Chiudi",
            Delete: "Rimuovi",
            Date: "Data",
            Showin: "Visualizza entro",
            Gotodate: "Vai alla data",
            Resources: "RISORSE",
            RecurrenceDeleteTitle: "Elimina ripetizione evento-",
            Location: "Luogo",
            Priority: "Priorità",
            RecurrenceAlert: "Sveglia",
            WrongPattern: "Il criterio di ricorrenza non è valido",
            CreateError: "La durata dell'appuntamento inferiore a quanto si verifica frequentemente. Accorciare o modificare il criterio di ricorrenza nella finestra di dialogo Ricorrenza appuntamento.",
            DragResizeError: "Non è possibile riprogrammare un'occorrenza dell'appuntamento ricorrente se si salta su un evento successivo dello stesso appuntamento.",
            StartEndError: "L'ora di fine deve essere maggiore di quella di inizio",
            MouseOverDeleteTitle: "Cancellare un appuntamento-",
            DeleteConfirmation: "Cancellare questo appuntamento?",
            Time: "Tempo",
            StartTimeZone: "Inizio TimeZone",
            EndTimeZone: "Fine Timezone",
            NoTitle: "Senza titolo",
            OverFlowAppCount : "Troppi appuntamenti)",
            AppointmentIndicator: "Clicca per vedere più appuntamenti",
            EmptyResultText:"Senza suggerimenti"
        };

</script>

The first screen display is OK:

When I click on the DateTimePicker navigator, the screen become:


To get it realligned, I have to click on some other tab, and then again on Week (Settimana)

I hope that this helps. If you need something else, please let me know,

Victor Ghero


SE Sellakumar Syncfusion Team January 16, 2017 06:59 AM UTC

Hi Victor, 

  

We are sorry for the inconvenience and kindly ignore our previous update given with an incident Id. 

 

We are considering your reported problem with misalignment as an issue and a new support incident has been created under your account now to track the status of it. Please log on to our support website to check further updates on it and also have a follow-up with it. 

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents  

  

Regards, 

Sellakumar K

SIGN IN To post a reply.
Loader.
Live Chat Icon For mobile
Up arrow icon