How to disable delete and edit button for particular user,and second question is it possible to see room condition.

[Darkhan Myrzabek]

So how to disable delete and edit button for user that didn't create this meeting, so with this foreign users can not do everything what they want.Second question is,is it possible to see room conditions(busy if now at the moment there is a meeting, and free if there is not meetings for now).

[Ravikumar Venkatesan]

Hi Darkhan, 

Greetings from Syncfusion support. 

Q1: How to disable edit and delete action for the user that didn’t create the event 

Step 1: Add custom event field (“User”) and IsReadonly event field to events like below. 

    { 

      "Id": 1, 

      "Subject": "Board Meeting", 

      "Description": "Meeting to discuss business goal of 2018.", 

      "StartTime": "2018-07-30T03:30:00.000Z", 

      "EndTime": "2018-07-30T05:30:00.000Z", 

      "RoomId": 1, 

      "User": "IU1", 

      "IsReadonly": false 

    } 

Step 2: You can disable the event edit and delete action based on the user with the help of eventRendered event with the below code. 

  onEventRendered(args) { 

    if (this.changeReadOnly) { 

      let datas = this.scheduleObj.eventsData; 

      for (let i = 0; i < datas.length; i++) { 

        if (datas[i].User === this.currentUser) { 

          datas[i].IsReadonly = false; 

        } else { 

          datas[i].IsReadonly = true; 

        } 

      } 

      this.changeReadOnly = false; 

    } 

  } 

Q2: How to check slot availability 

You can check the slot availability with the help of the isSlotAvailable method in the actionBegin event with below code. 

  onActionBegin(args) { 

    let isEventChange = (args.requestType === 'eventChange'); 

    if ((args.requestType === 'eventCreate' && args.data.length > 0) || isEventChange) { 

      let eventData = (isEventChange) ? args.data : args.data[0]; 

      let eventField = this.scheduleObj.eventFields; 

      let startDate = eventData[eventField.startTime]; 

      let endDate = eventData[eventField.endTime]; 

      let resourceIndex = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].indexOf(eventData.RoomId); 

      args.cancel = !this.scheduleObj.isSlotAvailable(startDate, endDate, resourceIndex); 

      if (args.cancel === true) { 

        alert('Slot is already occupied'); 

      } 

    } 

  } 

Sample: https://stackblitz.com/edit/react-schedule-restrict-edit-action-based-on-user-vmh456?file=index.js 

Kindly try the above sample and get back to us If you would require further assistance. 

API (actionBegin event): https://ej2.syncfusion.com/react/documentation/api/schedule/#actionbegin 

API (eventRendered event): https://ej2.syncfusion.com/react/documentation/api/schedule/#eventrendered 

UG(Making specific event readonly): https://ej2.syncfusion.com/react/documentation/schedule/appointments/#make-specific-events-readonly 

UG(Restricting event creation on specific time slots): https://ej2.syncfusion.com/react/documentation/schedule/appointments/#restricting-event-creation-on-specific-time-slots 

UG(Adding custom fields): https://ej2.syncfusion.com/react/documentation/schedule/appointments/#adding-custom-fields 

Regards, 

Ravikumar Venkatesan 

[Darkhan Myrzabek]

thanks,also one question,for example i have users in one meeting which are gonna participate, when I'm creating meeting i need multi-selecting field,which will add all users that have to participate.how to do this kind of things?

[Ravikumar Venkatesan]

Hi Darkhan, 

Thanks for the update. 

You can enable multiple resource selection when creating a event with the help of allowMultiple property of grouping option of the Schedule. The below code to enable multiple resource selection.  

  <ResourcesDirective> 

    <ResourceDirective field='RoomId' title='Room Type' name='MeetingRoom' allowMultiple={true} dataSource={this.ownerData} textField='text' idField='id' colorField='color'> 

    </ResourceDirective> 

  </ResourcesDirective> 

We have prepared a video demo for how to perform multiple resource selection when creating an event. It can be available in below link. 

Video demo: https://www.syncfusion.com/downloads/support/forum/153321/ze/resource-multiple-selection800798381 

You can check the slot availability when perform multiple resource selection like below code. 

  onActionBegin(args) { 

    let isEventChange = (args.requestType === 'eventChange'); 

    if ((args.requestType === 'eventCreate' && args.data.length > 0) || isEventChange) { 

      for (let i = 0; i < args.data.length; i++) { 

        let eventData = (isEventChange) ? args.data : args.data[i]; 

        let eventField = this.scheduleObj.eventFields; 

        let startDate = eventData[eventField.startTime]; 

        let endDate = eventData[eventField.endTime]; 

        let resourceIndex = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].indexOf(eventData.RoomId); 

        args.cancel = !this.scheduleObj.isSlotAvailable(startDate, endDate, resourceIndex); 

        if (args.cancel === true) { 

          alert('Slot is already occupied or some of the resource already have an appointment on the selected time slot.'); 

          break; 

        } 

      } 

    } 

  } 

Sample: https://stackblitz.com/edit/react-schedule-multiple-resource-selection?file=index.js 

Kindly try the above sample and get back to us If you would require further assistance. 

Regards, 

Ravikumar Venkatesan 

[Darkhan Myrzabek]

Thanks a lot guys)

[Vengatesh Maniraj]

Hi Darkhan, 

You are most welcome. 

Please get in touch with us if you need any further assistance. 

Regards, 

Vengatesh