etgryphon
commented
13 years ago Couple of things:
1: all state transitions need to be through events. You are defeating the point of the event regulation of statecharts if you have an external functions calling 'goToState'. So your focus events need to trigger an event not a goToState.
2: You very rarely call state transitions in an enterState function. This is called a 'Switch State' and there is only one specific case that it is used...namely when you have a lot of concurrent async calls that need to be completed before your can transition on and there are better ways to tackle it.
I re-wrote your code in a way that makes more sense for statecharts:
I encountered a really weird behavior:
http://jsfiddle.net/johnnywengluu/7fje2/6/
When entering the "#application .loading" state for the first time it will enter "#sellers" state.
But when "#application .loading" state is re-entered when clicking in any one of the textfields, it won't enter "#sellers" state again.
However, if I wrap the goToState inside an event, it works:
http://jsfiddle.net/johnnywengluu/7fje2/7/
Why is this?