Update property value with UI designer

Q&A
1

Hello,

I have a custom widget where I not able to update the property value.

I did a simplified version of this widget as it follows here:

Template: just a link element (<a>) with id=a (your forum is parsing html )

<meta name="viewport" content="width=device-width, initial-scale=1.0">
            <a id="a" href='#'></a>

</div>

 

Controller:

function ($scope) {

    var a = document.getElementById("a");
    a.innerHTML = "Save scope value";
    a.addEventListener("click", function(event){
        console.log("event detected");
        updateValue();
    });
    
    updateValue = function(){
        console.log("passing here");
        $scope.properties.value = "updated value";
    };
    $scope.properties.value = "init value";

}

And then I created a property called value of type "Biderectional bond".

I'd expect that when I click on the link with id="a" the property is updated, but the value is always = "init value".

I can see the message "passing here" logged.

How can I fix this?

Please help

thanks

2

Hello,

You are doing well. 

Did you

1/ reference correctly the properties as a Bi-directional?

2/ in your page, give a local variable? 

Please join a page (load in a dropbox then share the link here) where your widget is, to see what's happening.

Best

3

Hello,

This was a issue in the scope.

You have to develop in Angular, not in Javascript actualy.

Here the HTML

            <a ng-click="ctrl.updateValue()">Click Me to update</a>
==> No more ID, just add a ng-click

Then the controller is simplest

function ($scope) {

    
    var vm = this;
     
    this.updateValue = function(){
        console.log("passing here");
        $scope.properties.value = "second update";
    };
    
}

 

That's it!

 

4

Yes I'm doing like you are suggesting.

Here you are! done in 7.11.4

https://we.tl/t-NsUX2dY2pO

Thanks