Lista Dashcode - OnClick

Question

He creado un proyecto en Dashcode, se inserta un control de lista, permitió una lista dinámica, creada con un objeto JSON y lo asocia con el control. El código es el siguiente ...

var stations = {

    _rowData: ["Mitchelton", "Gaythorne", "Albion", "Central", 
    "Burpengary", "Petrie", "Morayfield", "Caboolture", "Ferny Grove"],

    numberOfRows: function() { return this._rowData.length; },

    prepareRow: function(rowElement, rowIndex, templateElements) {
        if (templateElements.label) {
            templateElements.label.innerText = this._rowData[rowIndex];
        }
        rowElement.onclick = function(event) { alert("Row "+rowIndex); };
    }

Como se puede ver cuando se selecciona un elemento que va a imprimir la rowIndex, pero me gustaría mostrar el valor real de ese índice.

Por desgracia, esta (por ejemplo) "this._rowData [2]" no funciona, no parece ser capaz de encontrar el objeto "_rowData".

Answer 1

Esto debería funcionar:

prepareRow: function(rowElement, rowIndex, templateElements) {
    if (templateElements.label) {
        templateElements.label.innerText = this._rowData[rowIndex];
    }

    var _this = this;
    rowElement.onclick = function(event) { alert(_this._rowData[2]); };
}

El problema es que dentro del controlador de eventos rowElement.onclick, this se refiere al elemento DOM rowElement, no su objeto stations. Arreglamos el problema mediante la creación de una variable (He nombrado que _this, pero se le puede llamar lo que quieras) que apunta al objeto stations y luego utilizar esta variable siempre que queramos acceder al objeto stations dentro del controlador de eventos.

Vea los dos artículos siguientes para obtener más información sobre la palabra clave this:

• http://www.quirksmode.org/js/this.html
• http://www.alistapart.com/articles/getoutbindingsituations