# StateGroup.Active not readable

**URL:** <https://forums.fusetools.com/t/stategroup-active-not-readable/6704>\
**Category:** Bug Reports\
**Created:** [January 4, 2017, 10:55am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704 "2017-01-04T10:55:43Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Luke](https://avatars.discourse-cdn.com/v4/letter/l/7ab992/32.png) [@Luke](https://forums.fusetools.com/u/Luke)\
**Post date:** [January 4, 2017, 10:55am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/1 "2017-01-04T10:55:43Z")

</div>

`StateGroup.Active` appears to currently be a write-only property (this is not indicated by the docs).

If binding a property to it, changes to the property will update the `StateGroup`, but updates to the `StateGroup` via the ui, are not reflected back in the property.

As a result, if the active router navigates away from, and then back to the page containing the `StateGroup`, the property is read again and the current state reverts to the last ever set by js.

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [January 4, 2017, 11:02am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/2 "2017-01-04T11:02:03Z")

</div>

It’s a limitation that `Node` types cannot be reflected back to JavaScript. For Navigation we made the `ActiveIndex` property, an integere, which avoids the problem. We’d have to do the same thing for `StateGroup` (which shouldn’t be too hard considering internally it already has this property).

I’ll add an issue for it.

A workaround for now is to avoid updating the state from UX, doing it only via the JS variable. Whatever is triggering the state change could instead call a JS function that updates the variable. There might be some frame-sync issues here though, possibly not an issue for you.

---

<div class="post-metadata">

**Author:** ![Luke](https://avatars.discourse-cdn.com/v4/letter/l/7ab992/32.png) [@Luke](https://forums.fusetools.com/u/Luke)\
**Post date:** [January 4, 2017, 11:18am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/3 "2017-01-04T11:18:15Z")

</div>

Cheers

I would like to be able to update it from the UX as well.

A hack for now seems to be to assign the js property with the desired state, then assign an empty string to it immediately after. This changes the state, but allows the UX to continue to control it after, without it being changed upon re-read:

```auto
stateGroup.value = 'desiredState';
stateGroup.value = '';

```

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [January 4, 2017, 11:23am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/4 "2017-01-04T11:23:43Z")

</div>

If you don’t need to know the current state from JS then use the `goto` method instead. `myStateGroup.goto( "stateName" )` in your code. There’s no need for a binding.

---

<div class="post-metadata">

**Author:** ![Luke](https://avatars.discourse-cdn.com/v4/letter/l/7ab992/32.png) [@Luke](https://forums.fusetools.com/u/Luke)\
**Post date:** [January 4, 2017, 11:34am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/5 "2017-01-04T11:34:43Z")

</div>

What’s the correct way to access the ux component directly from js? (getting a “is not defined” error)

It has a `ux:Name`, but this doesn’t seem sufficient. I suspect this is likely because the ux and js are in separate files.

All my navigator pages are separate includes. But as the js that drives these events requires access to several navigator pages, it is in the main ux file. I can pass properties down to these included pages, but it seems I cannot access their elements directly. Is this correct?

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [January 4, 2017, 11:41am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/6 "2017-01-04T11:41:21Z")

</div>

There’s no real best practice for this type of setup, but it sounds like something that `UserEvent` could do. The high-level component can post the event and the lower-level one listens to it an updates the state.

[https://www.fusetools.com/docs/fuse/userevent](https://www.fusetools.com/docs/fuse/userevent)

It’s also possible to communicate via JS modules, but that doesn’t sound like the best approach hear.

We have a pending feature request to make the `StateGroup` a part of the `Router` system, which might also help here. In the meantime you could isntead communicate the current state via a property on the `Parameter` to the page.

---

<div class="post-metadata">

**Author:** ![Luke](https://avatars.discourse-cdn.com/v4/letter/l/7ab992/32.png) [@Luke](https://forums.fusetools.com/u/Luke)\
**Post date:** [January 4, 2017, 11:48am UTC](https://forums.fusetools.com/t/stategroup-active-not-readable/6704/7 "2017-01-04T11:48:26Z")

</div>

Hmm, nice cheers

`UserEvent`s look neat. I should be using these.

You’ve given me a lot to think about, thanks