Issue featch with where condition in titanium alloy

3
votes

I have two pick lists in my app, both are dynamic values coming from DB. The values in to second pick list are displayed based the value selected in first pick list. So change event of first pick list the second pick list values should dynamically change with out refreshing the page.

My code is as follows,

Controller:

      $.picker.addEventListener('change',function(e){
    languageid = e.row.title;
    alert("language is : "+ languageid);
    movie.fetch({query: "SELECT * FROM movies WHERE id = '"+languageid+"';"});
    var column = Ti.UI.createPickerColumn();
    movie.each(function(model){
          var row = Ti.UI.createPickerRow({
                         title: model.get("movieName")
                     });
           column.addRow(row);
    });
    $.picker1.columns = [column];
   });

View:

 <Alloy>
    <Collection src="UserLanguage"/>
    <Collection src="movies"/>
    <Window class="container">
    <Picker id="picker"/>
    <Picker id="picker1"/>
    </Window>
</Alloy>

Style:

".container": {
    backgroundColor:"black"
}

"#picker": {
    width: '90%',
    top: '25dp'
}

"#picker1": {
    width: '90%',
    top: '100dp'
}

Model

exports.definition = {
    config : {
        "columns": {
            "id": "text",
            "movieName": "text"
        },
        "adapter": {
            "type": "sql",
            "collection_name": "movies"
        }
    }
};

Screenshot result

enter image description here

The select roe count is correct but the text is not visible. Why?

2
backbone.jstitaniumtitanium-mobilefetchtitanium-alloy

2 Answers

3
votes

OK, let's start from beginning because current solution is too messy...

View: (Make sure that you have got models/Movies.js)

<Alloy>
    <Collection src="UserLanguage"/>
    <Collection src="Movies"/>

    <Window class="container">
        <Picker id="picker"/>
        <Picker id="picker1"/>
    </Window>
</Alloy>

Controller: (The problem was that @Coyote selects data from table called movie not movies). So it should look like this:

var movies = Alloy.Collections.Movies;

$.picker.addEventListener("change", function(e) {
    var column = Ti.UI.createPickerColumn();

    movies.fetch({
        query: {
            statement: "SELECT * FROM movies WHERE id = ?;",
            params: [e.row.title] // How can be `title` an id?
        }
    });

    movies.each(function(model) {
        var row = Ti.UI.createPickerRow({
            title: model.get("movieName")
        });

        column.addRow(row);
    });

    $.picker1.columns = [column];
});
2
votes

Just use the query parameter passed to fetch function : 

$.picker.addEventListener('change',function(e){
    languageid = e.row.title;
    //alert("language is : "+ languageid);
    movie.fetch({query: "SELECT * FROM movie WHERE id = '"+languageid+"';"});
    var column = Ti.UI.createPickerColumn();
    movie.each(function(model){
          var row = Ti.UI.createPickerRow({
                         title: model.get("movieName");
                     });
           column.addRow(row);
    });
    $.picker1.columns = [column];
});