Context menu Items disabled

[Dana Kiehl]

Hello,

I am working with the spreadsheet control. I have added several custom items to the context menu as well as using some of the built in items. However, when there is just one tab in the spreadsheet some of the items are disabled when they should be enabled. When there are multiple tabs all the items are enabled. I have not been able to figure out why this is happening. Below is  the code where I add the custom items. 

 function contextMenuBeforeOpen(args) {

        if (args.element.ej2_instances[0].items.length == 5) {

            var index = this.activeSheetIndex;

            selectedVersion = versionArray[index].versionNumber;

            var enabled = versionArray[index].enabled;

            // Adds Context menu item "Rule Conditions"

            this.addContextMenuItems([{ text: "Rule Conditions" }], "Delete", false);

            this.addContextMenuItems([{ text: "Edit Columns" }], "Delete", false);

            this.addContextMenuItems([{ text: "Edit Table Info" }], "Edit Columns", false);

            if (enabled == false) {

                this.addContextMenuItems([{ text: "Enable" }], "Delete", false);

            }

            else {

                this.addContextMenuItems([{ text: "Disable" }], "Delete", false);

            }

            this.removeContextMenuItems(['Rename'], false, false);

            this.removeContextMenuItems(['Hide'], false, false);

            this.removeContextMenuItems(['Protect Sheet'], false, false);

            this.removeContextMenuItems(['Insert'], false, false);

        }

        else {

            this.addContextMenuItems([{ text: "Row Rule Conditions" }], "Insert Row", false);

            // Disables Insert Row In context Menu

            this.enableContextMenuItems(['Insert Row'], false, false);

            this.removeContextMenuItems(['Hide Row'], false, false);

        }

    }

Thanks,

Dana

[Gayathri KarunaiAnandam]

Hi Dana, 

We have checked your reported query. We have prepared a sample based on your suggestion. 

Sample: https://www.syncfusion.com/downloads/support/forum/168772/ze/WebApplication8Core-1757313100 

Before proceeding further, we would like to know the following details. 

1. Could you please share your Essential studio product version? 

2. If possible, please share more details about the issue you are facing. 

3. Please share us the video demonstration of this issue. 

Could you please get back to us with the above mentioned details based on that we will check and let you know the better solution quickly. 

Regards, 

Gayathri K 

[Dana Kiehl]

Hello,

I am using https://cdn.syncfusion.com/ej2/19.1.63/dist/ej2.min.js

As shown in the clip if I have a spreadsheet that only has on tab, two of the items in the menu are shaded and disabled when they should be active. However, if there is more than one tab within the spreadsheet then all of the items are active and able to be clicked.

I have attached a zip file that contains a screen record of the issue I am having.

Thanks,

Dana

Attachment: ContextMenuIssue_c4fe2f85.zip

[Gayathri KarunaiAnandam]

Hi Dana, 

We have checked your reported query. We would like to let you know that spreadsheet context menu default items only enable/ disable according to the sheet count. If we add a new item, it works as we set. We have prepared a sample in a new item is added but disabled. When the sheets are added, it doesn’t enabled. Please check the code snippet and video demonstration. 

Code: 

<ejs-spreadsheet id="spreadsheet" contextMenuBeforeOpen="createdHandler"> 

        <e-spreadsheet-sheets> 

            <e-spreadsheet-sheet> 

                <e-spreadsheet-ranges> 

                    <e-spreadsheet-range dataSource="ViewBag.DefaultData"></e-spreadsheet-range> 

                </e-spreadsheet-ranges> 

                <e-spreadsheet-columns> 

                    <e-spreadsheet-column width="80"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="80"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="80"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                        <e-spreadsheet-column width="100"></e-spreadsheet-column> 

                </e-spreadsheet-columns> 

            </e-spreadsheet-sheet> 

        </e-spreadsheet-sheets> 

    </ejs-spreadsheet> 

 

<script> 

    function createdHandler(args) { 

     

            

 

            this.addContextMenuItems([{ text: "Row Rule Conditions" }], "Insert", false); 

 

 

 

            // Disables Insert Row In context Menu 

 

            this.enableContextMenuItems(['Row Rule Conditions'], false, false); 

 

            this.removeContextMenuItems(['Hide'], false, false); 

 

 

      

       this.removeContextMenuItems(['Rename'], false, false); 

 

          

 

            this.removeContextMenuItems(['Protect Sheet'], false, false); 

 

            this.removeContextMenuItems(['Insert'], false, false); 

              

            

 

    

 

    } 

</script> 

Sample: https://www.syncfusion.com/downloads/support/forum/168772/ze/WebApplication8Core857028364 

Video: https://www.syncfusion.com/downloads/support/directtrac/general/ze/sprdt_context-1819928514 

If you are still facing the issue, kindly share the below details. 

• If possible, try to reproduce the reported issue in provided sample or share the issue reproducible sample.

Please provide the above requested information, based on that we will check and provide you a better solution quickly. 

Regards, 

Gayathri K 

[Dana Kiehl]

Hello,

Thank you for your reply. Unfortunately it doesn't solve the problem. I have replicated the issue in the file you sent and I also created a video demo to show you where I am having the issue. The items on the context menu that are disabled (or in this example the item enable, not the default ones) when there is a single version I need enabled at all times. The user needs to be able to click on them.

Thanks,

Dana

Attachment: WebApplication8Core857028364_(3)_75f385a3.zip

[Gayathri KarunaiAnandam]

Hi Dana, 

We have validated your query. We can be able to replicate the reported issue in our end. We have confirmed this as an issue from our side. We have logged a bug report for this and it will be available our weekly patch release which will be scheduled on October 6^th,2021. You can track its status from the below feedback link. 

 

Feedback: https://www.syncfusion.com/feedback/28852/spreadsheet-content-menu-items-disabled-issue 

 

We suggest that we have prepared a workaround to resolve this issue in sample side by using context menu id and CSS style. Please check the below code snippet and sample. 

 

Code: 

 

<script> 

    function createdHandler(args) { 

    this.removeContextMenuItems( 

      ['Hide', 'Rename', 'Protect Sheet', 'Insert'], 

      false 

    ); 

    this.addContextMenuItems( 

      [{ text: 'Row Rule Conditions' }], 

      'Duplicate', 

      false, 

      false 

    ); 

    this.addContextMenuItems( 

      [{ text: 'Enable', id: 'enable' }], 

      'Row Rule Conditions', 

      false, 

      false 

    ); 

    this.addContextMenuItems( 

      [{ text: 'Edit Columns', id: 'Tobeshown' }], 

      'Duplicate', 

      true, 

      false 

    ); 

  } 

</script> 

 

<style> 

     #enable,#Tobeshown { 

        color: black !important; 

        cursor: pointer !important; 

        pointer-events: auto !important; 

      } 

</style> 

 

Sample: https://www.syncfusion.com/downloads/support/forum/168772/ze/WebApplication8Core995632919  

 

Please get back to us, if you need further assistance. 

 

Regards, 

Gayathri K 

[Gayathri KarunaiAnandam]

Hi Dana, 

We are glad to announce that our Essential Studio 2021 Volume 4 release v19.4.0.38  is rolled out and is available for download under the following link. 

https://www.syncfusion.com/forums/171304/essential-studio-2021-volume-4-main-release-v19-4-0-38-is-available-for-download 

Feedback: https://www.syncfusion.com/feedback/28852/spreadsheet-content-menu-items-disabled-issue  

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 

Regards,           

Gayathri K