Question T15359
Visible to All Users

Handle event from one property to another

created a year ago

Within one question I want to catch and handle event from one property that produce it and to catch and handle it on another property.

For example. In one question i have two properties: custom and build in with type 'itemValues'. When i add new item in itemValues property I would like to catch this event in my custom property. How can I perform that?

Show previous comments (2)

    Or another question, if my scenario not possible. How can I subscribe to itemvalue adding/deleting event in survey creator? I can set handlers on that events and change survey JSON object. Maybe that way I can edit data in my custom property, that possible? If it fine option, please show me how to modify survey JSON from survey creator.

      Hello,
      Thank you for the update.

      From what I gather, you wish to implement dependent properties. If so, you can use the dependsOn array and list properties from which the current property depends. When the master property is updated, the dependent property's onGetValue/onSetValue/choices events will be raised. Consider this code snippet:

      JavaScript
      Serializer.addProperty("question", { name: "myCustomProperty", category: "Demo Category", choices: ["Option 1", "Option 2", "Option 3"] }); Serializer.addProperty("question", { name: "dependentProperty", category: "Demo Category", dependsOn: ["myCustomProperty"], onSetValue: function (element, value) { console.log("set value"); }, onGetValue: function (element, value) { console.log("get value"); }, choices: function (obj) { const choices = []; const targetPropertyValue = !!obj ? obj["myCustomProperty"] : null; if (!targetPropertyValue) return choices; choices.push({ value: null }); choices.push(targetPropertyValue + ": Suboption 1"); choices.push(targetPropertyValue + ": Suboption 2"); choices.push(targetPropertyValue + ": Suboption 3"); return choices; } });

      I also created a React demo for your reference: View CodeSandbox. Please let me know if you're developing an application using anther JavaScript platform.

      Please let me know if this option works for you.

        I'm not sure that will work for me.
        In my question I use itemvalues property and custom property with react class component. When I delete all items from itemvalues property, in react component I get componentDidUpdate event invoked, the same behavor when I add first item in itemvalues property - componentDidUpdate invoked again. But when itemvalues list not empty and I add/remove items nothing happens, I can't get componentDidUpdate event. How can I fire componentDidUpdate in react class component when add/remove items regardless of the list fullness?

        Answers

        created a year ago

        Figured out how to do it. Thanks!

        But the question remains - how to subscribe in the Survey.Serializer.addProperty object to the items change event in itemvalues? When I change value or text.

          Show previous comments (2)

            Hello,
            I tested the demo I shared earlier and confirmed that the onSetValue is raised when I update a Dropdown value.
            Clipboard-File-2.png
            Clipboard-File-1.png

            Would you please clarify how to reproduce the issue? Also, please elaborate on your task. What particular actions do you wish to perform within the onSetValue callback function?

              What if custom property and dependent property are in different categories? For example custom in General and dependent in Demo category, onGetValue/onSetValue/choices events will be still raised?
              In my case itemvalues property and custom property are in different categories.

                Hello,
                If linked properties appear in different categories, the dependsOn setting will work as expected. I updated my example to demonstrate such a configuration: View CodeSandbox.
                Clipboard-File-1.png

                Please let me know if you have any more questions.