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

RadialMenu as context menu

Hi,
I'm busy with a project and i have a schedule on it.
1. I have the radial menu working fine according to the demo online(against the schedule). Is there a way to make the menu items open automatically without me clicking on the center? It would be the opposite of:
$('#defaultradialmenu').ejRadialMenu("menuHide");
2. I'm using the BeforeContextMenuOpen event to trigger the Radial menu:
.ScheduleClientSideEvents(eve => eve.BeforeContextMenuOpen("popCustomContextMenu"))
The problem with this is that the args send to the method "popCustomContextMenu" do not contain the date on which the event was triggered. How do I get the date then

3 Replies

SK Sarath Kumar P K Syncfusion Team September 11, 2015 09:37 AM UTC

Hi Fanisa,

Thanks for contacting Syncfusion support

Query 1: Is there a way to make the menu items open automatically without me clicking on the center?
Currently we do not have the support to show the Radial Menu dynamically. But we have already considered this and provided the API to show the radial menu dynamically. The API will be available in our upcoming Essential Studio Volume 3 , 2015 release which is expected to be roll out in the month October, 2015. We would request you to use the below provided code sample to show the Radial Menu dynamically.
[script]
function showRadialMenu() {
            //create instance for radialmenu
            var radialMenuInstance = $('#defaultradialmenu').ejRadialMenu("instance");
            // call the private function to show the radailmenu
            radialMenuInstance._radialClickHandler();
        }

Query 2: How do I get the date value in “BeforeContextMenuOpen” event.
We have analyzed the mentioned scenario and we are able to reproduce the defect. This is a known issue which has been fixed in source and the fix will be included in our upcoming release. Also, we have prepared a workaround sample to get the date value in beforeContextMenuOpen event. The sample can be downloaded from the following location.
http://www.syncfusion.com/downloads/support/forum/120202/ze/Schedule-1572357629

In the above sample we have used the following code example to get the date value from event arguments.
<code>
[Index.cshtml]

        if ($(args.events.target).hasClass("e-workcells") || $(args.events.target).hasClass("e-alldaycells") || $(args.events.target).hasClass("e-monthcells")) {

            this._cellSelection(args.events.target);

            var renderDate = (this.model.orientation == "horizontal" && this.currentView() == "month") ? this.monthDays : (this.model.orientation == "vertical" || this.currentView() == "customview" && this._dateRender.length <= 7) ? this.dateRender : this._dateRender;

            renderDate = this.model.orientation == "horizontal" && this.currentView() == "customview" && this._dateRender.length <= 7 ? this._dateRender : renderDate;

            var curDate = new Date(renderDate[this._cellIndex]);         //Here you get the current date of selected cell

            alert(curDate);

        }

        else {

            var _target = $(args.events.target);

            var appoint = _target.hasClass("e-appointment") || _target.hasClass("e-monthappointment") || _target.hasClass("e-alldayappointment") ? _target : _target.parents(".e-appointment,.e-alldayappointment,.e-monthappointment");

            if (appoint.length > 0) {

                var appId = parseInt(appoint[0].id.split("_")[1]); // Here we are find the appointment Id based on the target

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

                var app = new ej.DataManager(schObj._processed).executeLocal(new ej.Query().where(schObj.model.appointmentSettings["id"], ej.FilterOperators.equal, appId)) // Here we are find the appoitment details based on the appointment Id

                var appointmentSubject = app[0].Subject;         //Here you get the appointment details on appointment right click

                alert(appointmentSubject);

            }
        }
</code>


Regards,
Sarath Kumar P K


FA Fanisa September 11, 2015 09:54 AM UTC

Thank you for your help. You saved my life :). I'm actually busy converting a Silverlight application to an ASP.NET MVC application.
 I have 1 more question:

How do i enable and disable the radialmenu options?
For e.g, I'd like to show the add button grayed out when a person clicks on an empty cell. How do I manage that?

  @Html.EJ().RadialMenu("defaultradialmenu").ImageClass("e-radial").Items(items
        =>
    {
        items.Add().ImageURL(Url.Content("~/Images/twitter.png")).Text("Copy");
        items.Add().ImageURL(Url.Content("~/Images/twitter.png")).Text("Paste");
        items.Add().ImageURL(Url.Content("~/Images/twitter.png")).Text("Edit");
        items.Add().ImageURL(Url.Content("~/Images/twitter.png")).Text("Add");
        items.Add().ImageURL(Url.Content("~/Images/twitter.png")).Text("Archive");
    }).AutoOpen(false).EnableAnimation(true).ClientSideEvents(evt => evt.MouseUp("click")).ClientSideEvents(e => e.Select("pickMenuOption")); 




AK Arun Kumar S Syncfusion Team September 14, 2015 10:43 AM UTC

Hi Fanisa,

Since your last query is different from your previously reported issue we have created a branched incident 144077. Your query will be addressed in the incident 144077. We request you to follow up with the incident 144077 for further updates.
 
Regards,
Arun Kumar S


Loader.
Live Chat Icon For mobile
Up arrow icon