# When updating the value of an \`Observable\` in a \`addSubscriber\` function the frontend does not update.

**URL:** <https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983>\
**Category:** General\
**Created:** [February 17, 2016, 10:03am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983 "2016-02-17T10:03:02Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![skezo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/skezo/32/34_2.png) [@skezo](https://forums.fusetools.com/u/skezo)\
**Post date:** [February 17, 2016, 10:03am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/1 "2016-02-17T10:03:02Z")

</div>

**Issue:** When updating the value of an `Observable` in a `addSubscriber` function the frontend does not update.

**Expected Outcome:** The below code sample should display the value “Default Value” on the front end when the button is clicked 4 times and then is reset to “1” when pressed a 5th time.

**Current Outcome:** The value remains as “1222” and then is reset to “1” when pressed a 5th time.

In the `MainView.ux` file:

```auto
<App Theme="Basic" Background="#eeeeeeff">
    <StackPanel>
      <Panel>
          <Text Alignment="Center" Value="{inputValue}" />
      </Panel>
      <Button Text="Click Me">
        <Callback Handler="{updateInputValue}" />
      </Button>
    </StackPanel>
</App>

```

In the `MainView.js` file:

```auto
var defaultString = "Default Value";
var inputValue = Observable(defaultString);

var updateInputValue = function(args) {
    if(inputValue.value === defaultString) {
        inputValue.value = (1).toString();
    } else {
        inputValue.value += (2).toString();
    }
}

var checkInputValue = function() {
    if (inputValue.value.length >= 4 && inputValue.value != defaultString) {
        //if( isInputValueValid(inputValue.value) ) {
        // Force it to be wrong for testing
        if( inputValue.value === "1111" ) {
            //Done - remove subscribers
            inputValue.removeSubscriber(checkInputValue);
            inputValue.removeSubscriber(showInputValue);
        } else {
            //Wrong - reset value back to defaultString
            inputValue.setValueExclusive(defaultString, checkInputValue);
        }
    }
}

var showInputValue = function() {
    console.log( inputValue.value )
}

inputValue.addSubscriber(showInputValue);
inputValue.addSubscriber(checkInputValue);

module.exports = {
    updateInputValue: updateInputValue,
    inputValue: inputValue
};

```

---

<div class="post-metadata">

**Author:** ![Anders\_Lassen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/anders_lassen/32/522_2.png) [@Anders\_Lassen](https://forums.fusetools.com/u/Anders_Lassen)\
**Post date:** [February 18, 2016, 9:32am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/2 "2016-02-18T09:32:01Z")

</div>

Hi!

I am unable to test your code from here, but for debugging, can you please add some `debug_log("message")` to say, the inside of say `checkInputValue` and the various `if`-cases to see if the code is run at all?

---

<div class="post-metadata">

**Author:** ![skezo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/skezo/32/34_2.png) [@skezo](https://forums.fusetools.com/u/skezo)\
**Post date:** [February 18, 2016, 10:05am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/3 "2016-02-18T10:05:32Z")

</div>

Updated code below. This has been tested and does actually work, issue still exist

In the `MainView.ux` file:

```auto
<App Theme="Basic" Background="#eeeeeeff">
    <JavaScript File="MainView.js" />
    <StackPanel>
        <Panel>
            <Text FontSize="22" Value="{inputValue}" />
        </Panel>
        <Button Text="Click Me" Clicked="{updateInputValue}" />
    </StackPanel>
</App>

```

In the `MainView.js` file:

```auto
var Observable = require("FuseJS/Observable");
var defaultString = "Default Value";
var inputValue = Observable(defaultString);

var updateInputValue = function(args) {
    if(inputValue.value === defaultString) {
        inputValue.value = (1).toString();
    } else {
        inputValue.value += (2).toString();
    }
}

var checkInputValue = function() {
    if (inputValue.value.length >= 4 && inputValue.value != defaultString) {
        //if( isInputValueValid(inputValue.value) ) {
        // Force it to be wrong for testing
        if( inputValue.value === "1111" ) {
            //Done - remove subscribers
            console.log( "Done", inputValue.value )
            inputValue.removeSubscriber(checkInputValue);
            inputValue.removeSubscriber(showInputValue);
        } else {
            //Wrong - reset value back to defaultString
            console.log( "Wrong", inputValue.value )
            inputValue.setValueExclusive(defaultString, checkInputValue);
        }
    }
}

var showInputValue = function() {
    console.log( inputValue.value )
}

inputValue.addSubscriber(showInputValue);
inputValue.addSubscriber(checkInputValue);

module.exports = {
    updateInputValue: updateInputValue,
    inputValue: inputValue
};

```

---

<div class="post-metadata">

**Author:** ![Anders\_Lassen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/anders_lassen/32/522_2.png) [@Anders\_Lassen](https://forums.fusetools.com/u/Anders_Lassen)\
**Post date:** [February 18, 2016, 10:14am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/4 "2016-02-18T10:14:43Z")

</div>

Can you please read my above message?

---

<div class="post-metadata">

**Author:** ![skezo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/skezo/32/34_2.png) [@skezo](https://forums.fusetools.com/u/skezo)\
**Post date:** [February 18, 2016, 10:22am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/5 "2016-02-18T10:22:36Z")

</div>

Added the console.log in the if statments. On the forth click it should always state: `Wrong 1222`

Below is what is outputted on each click on console log

```auto
1 <!-- First Click -->
12 <!-- Second Click -->
122 <!-- Third Click -->

<!-- Forth Click -->
1222
Wrong
1222
Default Value

```

Below is screen shot of frontend on forth click. It should say Default Value instead of 1222

![file](https://s3.us-east-2.amazonaws.com/fuse-legacy-forum-assets/i11BG1duxJf3-legacy-files-9teGl24NCXMYMv7o-o9ACushtpYwVOv6UWLUuxUmf.png)

---

<div class="post-metadata">

**Author:** ![Anders\_Lassen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/anders_lassen/32/522_2.png) [@Anders\_Lassen](https://forums.fusetools.com/u/Anders_Lassen)\
**Post date:** [February 18, 2016, 10:29am UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/6 "2016-02-18T10:29:45Z")

</div>

Thanks for reporting.

I can’t see anything wrong with your code, so this could be a bug on our end. Taking action to investigate.

---

<div class="post-metadata">

**Author:** ![Anders\_Lassen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/anders_lassen/32/522_2.png) [@Anders\_Lassen](https://forums.fusetools.com/u/Anders_Lassen)\
**Post date:** [February 18, 2016, 3:20pm UTC](https://forums.fusetools.com/t/when-updating-the-value-of-an-observable-in-a-addsubscriber-function-the-frontend-does-not-update/2983/7 "2016-02-18T15:20:53Z")

</div>

Hi!

This bug has been found and will be fixed in an upcoming release 🙂

Thanks a lot for reporting! I hope you are able to find a work-around for now