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.
Unfortunately, activation email could not send to your email. Please try again.

Modal appointment on cell click

Thread ID:

Created:

Updated:

Platform:

Replies:

120775 Oct 14,2015 03:39 AM Oct 20,2015 12:17 AM ASP.NET MVC 8
loading
Tags: Schedule
ESTEBE
Asked On October 14, 2015 03:39 AM

Hi,

I' would like display directly the modal windows (see attach file) with the event "cellClick"

 without display the popup . Is it possible ?


Thank you,
Nicolas

(sorry for my bad english)

Attachment: Capture_fbe4769c.zip

ESTEBE
Replied On October 14, 2015 04:29 AM

I found a way:


        function OnCellClick() {
$('.e-detailedapp').trigger('click'); //open modal
event.stopPropagation(); 

        }

Sarath Kumar P K [Syncfusion]
Replied On October 15, 2015 02:29 AM

Hi ESTEBE,

Thanks for contacting Syncfusion support.

We have prepared a schedule sample to meet your requirement (Open detailed window on cell click) which can be downloaded from the following location.
http://www.syncfusion.com/downloads/support/forum/120775/ze/CellClick473840419

In the above sample we have used the following code example to open the detailed window when we click on the cell.
<code>

@(Html.EJ().Schedule("Schedule1")

                .Width("100%")

                .Height("525px")

                .ScheduleClientSideEvents(eve => eve.CellClick("OnCellClick").AppointmentClick("OnCellClick"))       //If you want to open the appointment detail on single click bind the same method name for appointment click and use the below code example

                .AppointmentSettings(

                    fields => fields.Datasource(Model)

                    ----------------
)

<script type="text/javascript">

    function OnCellClick(args) {

        args.cancel = true;        //Block the quick window open.

        if (args.type == "cellClick")

            this._appointmentWindow({ target: args.target.currentTarget });                //Open the detailed window with updated date and time.

        else if(args.type=="appointmentClick")

            this._appointmentWindow({ target: $("#Appointment_"+args.appointment.Id) });   //If you want to open the appointment detailed window use this code.

    }
</script>
</code>

Regards,
Sarath Kumar P K


ESTEBE
Replied On October 15, 2015 04:26 AM

Thank you very much for your answer and your sample it really helped me.

It's possible to use the method _appointmentWindow(e) to create an
Open detailed window just by clicking on a button (without cell click or dblclick) ?

For example:

<code>

<button onclick='openWindow'>Open
detailed window</button>
...

<script>

function
openWindow(){

var schedule = $("#Schedule1").data("ejSchedule");
schedule._appointmentWindow(???);

};
</script>

</code>

Sarath Kumar P K [Syncfusion]
Replied On October 16, 2015 04:53 AM

Hi,

We have analyzed the scenario to open the appointment detailed window using default button click. It is possible to open the detailed window but you need to pass the schedule work cell DOM element as a parameter and also you need to call “_cellSelection” method so that the required values are updated properly in appointment window and you can save the appointment. While using this customize window open action using button click, no need to bind the client side events “cellClick and appointmentClick”. Please refer to the following code example:
<code>

<button onclick='openWindow()'>Open detailed window</button>               //Create button to trigger the openWindow method


<script type="text/javascript">


    function openWindow() {

        var schedule = $("#Schedule1").data("ejSchedule");

        schedule._cellSelection({ target: $(schedule.element.find(".e-workcells")[0]) });       //Call the _cellSelection method to get the required data based on target cell

        schedule._appointmentWindow({ target: $(schedule.element.find(".e-workcells")[0]) });   //Here you need to pass the schedule cell target element, I have passed the first schedule work cells. If you want to open the window in month view replace the class “.e-workcells” by “.e-monthcells”.
    }
</script>
</code>

Regards,
Sarath Kumar P K


ESTEBE
Replied On October 16, 2015 06:07 PM

Thank you

Sarath Kumar P K [Syncfusion]
Replied On October 19, 2015 12:33 AM

Hi,

We are glad to hear that the provided solution resolved your requirement.

Please let us know, if you require any further assistance. As always, we will be happy to assist you.

Regards,
Sarath Kumar P K

ESTEBE
Replied On October 19, 2015 01:37 PM

Yes your solution work perfectly.
Thank you very much.
Nicolas

Sarath Kumar P K [Syncfusion]
Replied On October 20, 2015 12:17 AM

Hi,

Thanks for the update.

Regards,
Sarath Kumar P K

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;