Hi, I've been working with Alloy collections for a couple of days.
In short: I cannot do that simple thing: retrieve a collection row, change the content, and save it back.
In detail: I have got my binding working beautifully in my 'History table' as follows:
historyList.js
var books = Alloy.Collections.book; books.fetch();historyList.xml
<Alloy> <Collection src="book" /> <Window id="winHistoryList" class="container"> <TableView id="tableview" dataCollection="book"> <SearchBar id="searchBar" hintText="search"></SearchBar> <TableViewRow id="row" dataId="{book_id}" dataTitle="{sec1_1_title}"> <Label class="rowName" text="{sec1_1_title}"></Label> <Label class="rowDate" text="{sec1_1_date_book}"></Label> </TableViewRow> </TableView> </Window> </Alloy>Elsewhere in the app, I add instances to the collection, all going well too:
var books = Alloy.Collections.book; var data = { "incidate": indicate, "sec1_1_date_book":todaysDate, "sec1_1_title": title }; var book = Alloy.createModel("book", data); books.add(book); // Save our model to the SQL database book.save(book);So that you really have all the elements, here is my model declaration:
exports.definition = { config: { "columns": { "book_id": "INTEGER PRIMARY KEY AUTOINCREMENT", "incidate": "TEXT", "sec1_1_division": "TEXT", "sec1_1_site": "TEXT", "sec1_1_location": "TEXT", "sec1_1_date_book": "TEXT", [...] }, "adapter": { "type": "sql", "collection_name": "books", "idAttribute": "book_id" } }, extendModel: function(Model) { _.extend(Model.prototype, { // Extend, override or implement the Backbone.Model methods }); return Model; }, extendCollection: function(Collection) { _.extend(Collection.prototype, { // Implement the comparator method. comparator : function(book) { return book.get('book_id'); } }); // end extend return Collection; } }We're getting to the point. In another location I have a form with one field per model column:
section1.xml
<Alloy> <Collection src="book" /> <Window id="winSection1"> <View class="formRow"> <Label class="formLabel">Division</Label> <TextArea class="textArea250" id="sec1_1_division" /> </View> <View class="formRow"> <Label class="formLabel">Site / Project</Label> <TextArea class="textArea250" id="sec1_1_site"/> </View> [...]I set the column values like this:
section1.js
var args = arguments[0] || {}; if (args.data){ $.sec1_1_division.value = args.data.sec1_1_division || ''; $.sec1_1_site.value = args.data.sec1_1_site || ''; $.sec1_1_location.value = args.data.sec1_1_location || '';and in the same file set my onclick save action:
$.finishButton.addEventListener('click',function(e){ var books = Alloy.Collections.book; var data = { "incidate": incidate, "sec1_1_division": $.sec1_1_division.value, "sec1_1_site": $.sec1_1_site.value, "sec1_1_location": $.sec1_1_location.value, [...]
Finally I use my custom ID to try and fetch the collection row, update it and spit it back. That's where I'm stuck as.
var books = Alloy.Collections.book; var book = books.fetch({"book_id":args.data.book_id}); // not working, it retrieves all of them book.save(data);Can anyone enlighten me here? How do you update a Collection row???