commandManager().execute not works

Posted by: ejkim on 4 July 2024, 8:43 pm EST

    • Post Options:
    • Link

    Posted 4 July 2024, 8:43 pm EST - Updated 4 July 2024, 8:52 pm EST

    Hi Team!

    I’ve got a problem to set my Designer component option.

    I try to show Field List when Designer-workbook init, but the code below not works.

    I call this methos at designerInitialized.

    Data tab(ribbon)'s first button has been customed to checkbox style also(checked, fieldList shown. unchecked, hide), Does this affect rendering condition?

    It will be the pleasure if you guys help me.

    also is there any good way to not manipulating DOM and give the style to ribbon and top panel (the last part) please let me know!

    have a nice day!

     const getDesignerFromSsJson = (designer: Designer, ssJson: string,
            designerContainerDivId: string, ribbon ? : string, topPanels ? : string
            ) => {
            // 
            if (!ssJson) return;
            const config = GC_Designer.
            Spread.
            Sheets.
            Designer.
            ToolBarModeConfig;
            designer.
            setConfig(config);
            const workbook = designer.
            getWorkbook()
            as
            Workbook;
            workbook.
            suspendPaint();
            workbook.
            commandManager().
            execute({
                cmd: GC_Designer.
                Spread.
                Sheets.
                Designer.
                CommandNames.
                ShowFieldList
            })
            workbook.
            fromJSON(JSON.parse(ssJson));
            workbook.
            resumePaint();
            const element1 = document.
            getElementById(designerContainerDivId)?.
            querySelector(" .ribbon ")
            as HTMLElement;
            element1.style.display = ribbon || " 
            block " ;
            const element2 = document.
            getElementById(designerContainerDivId)?.querySelector(" .top -
                panels ") 
                as HTMLElement; element2.style.display = topPanels || " 
                none " ;
            };

  • Posted 7 July 2024, 8:34 pm EST - Updated 7 July 2024, 8:39 pm EST

    Hi,

    From my understanding, you are encountering an issue with showing the field list of a pivot table using the execute method of commandManager. Additionally, you are seeking a better way to style the ribbon and formula bar.

    I attempted to use the show field list command, and it appears to be working as expected without any issues on my end. Please refer to the attached GIF “Steps.gif” and the provided sample.

    GIF:

    Sample: https://jscodemine.mescius.io/share/hi_ImEM56Uq7_KnZV_IMLg/?defaultOpen={"OpenedFileName"%3A["%2Findex.html"%2C"%2Fsrc%2Fapp.js"%2C"%2Fpackage.json"]%2C"ActiveFile"%3A"%2Fpackage.json"}

    Note: The showFieldList command will not open the field list of the pivot panel if the active cell is not within the pivot table area in the viewport, as shown in the GIF.

    If you continue to experience the issue despite the example above, could you please share a sample along with the steps to replicate the behavior you have observed? Alternatively, you can modify the existing sample to replicate the behavior by forking it. This will enable me to investigate the problem more thoroughly. Additionally, it would be helpful if you could provide a GIF or video illustrating the issue.

    Regarding your question about the Data tab (ribbon)'s first button being customized to a checkbox style (checked, field list shown; unchecked, hidden), this should not affect the rendering condition.

    As for styling the ribbon and top panel without manipulating the DOM, there is no API available for customizing the styling of the ribbon and formula bar. However, using the DOM for styling might not cause any issues, so you can proceed with styling in that manner.

    Regards,

    Priyam

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels