Unfortunately, your application stopped working

Question

In Alloy framework, I want to dynamically add a view defined in an xml file but not bound to any other view to another.

Let's take the following example:

Container I want to fill in index.xml:

<ScrollableView id="scrollableBilan" showPagingControl="true">
</ScrollableView>

The view template question.xml I want to instanciate for each view going into the ScrollableView:

<Alloy>
    <Collection src="ReponsePossible">
    <View id="questionContainer" class="container">
        <Label id="questionText" />
        <Button id="buttonNextQuestion">Question suivante</Button>
    </View>
</Alloy>

Finally the controller index.js, question being a Collection instance:

for(var i=0; i<questions.length; i++){
        $.scrollableBilan.add(Alloy.createController('question', questions.at(i)));
    }

This makes my application crash whith following message: 'Unfortunately, your application has stopped'. I already got this error, always when trying to add a view dynamically create using Alloy.createController.

The behavior is ok when creating a view with Ti.UI.createView but I want to use the MVC...

Any help is welcomed!

Answer 1

You are passing it a model object, instead try passing it a JSON object like this:

for(var i=0; i<questions.length; i++){
    $.scrollableBilan.add(Alloy.createController('question', questions.at(i).toJSON()));
}

Alternatively you can just do this all inside the xml file by using Data Binding and the dataCollection attribute, put something like this in your index.xml:

<Alloy>
    <Collection src="questions">
    <ScrollableView id="scrollableBilan" showPagingControl="true" dataCollection="ReponsePossible">
        <View id="questionContainer" class="container">
            <Label id="questionText" text="{questionText}"/>
            <Button id="buttonNextQuestion">Question suivante</Button>
        </View> 
    </ScrollableView>
</Alloy>

The questionText field needs to be an attributes in your questions model.