qooxdoo

add and remove item to qx.ui.list.List


How can I add item at the end of this array? I didn't find examples. Did I miss something. How can I remove an element?

var rawData = [];
for (var i = 0; i < 2; i++) {
 rawData[i] = "Item " + i;
}
var model = qx.data.marshal.Json.createModel(rawData);

var list = new qx.ui.list.List(model);
//var list = new qx.ui.list.List(new qx.data.Array("item 0"));
//list.add( new qx.ui.list.List("itme 2"))
//list.createItem("item 2")
//list.insertAt(0, "item2")
this.getRoot().add(list);

Solution

  • There is MVC pattern implementation in qooxdoo. The elegant way is to work with model not view. You can wrap JS array by qooxdoo array qx.data.Array instead of qx.data.marshal.Json.createModel. The qooxdoo array has method append which add to the end of array and remove the last element is pop method.

    const data = [];
    for (let i = 0; i < 2; i++) {
      data[i] = "Item " + i;
    }
    
    const model = new qx.data.Array(data);
    const list = new qx.ui.list.List(model);
    // removing element from list
    model.pop();
    // adding element to end of list
    model.append("Item 3");
    
    this.getRoot().add(list);
    
    let doc = this.getRoot();
    doc.add(list, {left: 100, top: 50});