Dialog Events

Posted by: m.holland-moritz on 14 February 2021, 6:16 pm EST

  • Posted 14 February 2021, 6:16 pm EST

    Hello,

    i ran into an issue i can't solve right now.

    I am using the designer-components for my application. In a custom dialogue, which I have initialised with GC.Spread.Sheets.Designer.registerTemplate(), in which there are various text editors and i want them to fire an event when they are changed.

    For example my Template looks like that:

    var template = {
    title: dict.templ_T_Ti,
    content: [
    {
    type: "ColumnSet",
    children: [
    {
    type: "Column",
    children: [
    {
    //Typical RangeSelect
    type: "RangeSelect",
    titel: "Select Range",
    bindingPath: "targetRange"
    }, {

    type: "TextEditor",
    bindingPath: "firstColumn"
    }, {

    type: "TextEditor",
    bindingPath: "firstRow"
    }, {

    type: "TextEditor",
    bindingPath: "lastColumn"
    }, {

    type: "TextEditor",
    bindingPath: "lastRow"
    }]
    }]
    }]
    }


    Whenever the user change the SelectRange the text in the editors should change and reverse. If the editors are changed the RangeSelect should change its range.

    Are there any events i can fire? And where do i have to initialize them?
    I know there is this part:

      GC.Spread.Sheets.Designer.showDialog("translate", dialogOption, (result) => {

    if (!result) {
    return;
    }
    }, (error) => {
    console.error(error);
    }, checkResult);


    but whenever i try to do somethin in this nothing happens. Can u maybe help me?

    Alternativ:
    Is there a radio button option in the custom template. I couldn't find one in the definition file or in the documentation, apart from the cell types, which don't really help with pop-ups.

    Regards
    Maik
  • Replied 15 February 2021, 10:32 pm EST

    Hi,

    >>Regarding the events for the Templates element:

    We were unable to achieve the required functionality using the current public API hence we have escalated this issue to the concerned team for further investigation. we will update you regarding this as soon as we get any information. The internal ID for this issue will be SJS-7619.

    >>Regarding the Radio button inside of the custom Template.

    You may use type as Radio for the required functionality. Please refer to the following code snippet and attached sample that demonstrates the same.


    var setTextTemplate = {
    title: "demo",
    content: [

    {
    type: "Radio",
    bindingPath: "radioValue",
    items: [
    {
    text: "item1",
    value: "value1",
    },
    {
    text: "item2",
    value: "value2",
    }
    ]
    },
    ]
    };


    Regards,
    Avinash

    sjs_designer_cdn.zip
  • Replied 16 February 2021, 8:13 pm EST

    hey,

    Thank for the fast answer. The Radio buttons helped me a lot, but is there a way to get some space between 2 options in 1 column? margin and space doesn't help here.

    Regards,
    Maik
  • Replied 17 February 2021, 4:54 pm EST

    Hi Maik,

    You may pass a number of spaces in the Radio Items array. Please refer to the following code snippet and let us know if you face any issues.


    var setTextTemplate = {
    title: "demo",
    content: [
    {
    type: "Radio",
    bindingPath: "radioValue",
    items: [
    {
    text: "item1",
    value: "value1",
    space: 5
    },
    {
    text: "item2",
    value: "value2",
    }
    ]
    },
    ]
    };


    Regards
    Avinash
  • Marked as Answer

    Replied 18 February 2021, 6:15 pm EST

    Hi Avinash,

    i dont know why, but space didn't work for me here. It just breaks the text behind the button on a high value.
    Meanwhile i found a solution for me. I don't know why i didn't thought about that.

    I just put a TextBlock with a margin between 2 different content radio items and gave them the same bindingPath. As follows:

    {
    type: "Radio",
    columnCount: 1,
    margin: "15px 0 0 0",
    items: [
    {
    text: "Rangeselect:",
    value: "rS"
    }
    ],
    bindingPath: "radio"
    },
    {
    type: "TextBlock",
    margin: "15px 0 15px 0"
    },
    {
    type: "Radio",
    columnCount: 1,
    margin: "15px 0 0 0",
    items: [
    {
    text: "Quellspalte:",
    value: "tE"
    }
    ],
    bindingPath: "radio"
    },


    So thanks for help anyway.

    Regards
    Maik
  • Replied 22 February 2021, 2:02 pm EST

    Hi Maik,

    We are glad to know that you were able to solve the issue. Feel free to contact us back if you have any further queries regarding this issue.

    Regards
    Avinash
Need extra support?

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

Learn More

Forum Channels