Ver Mensaje Individual
  #1 (permalink)  
Antiguo 08/09/2010, 16:45
isra00
Invitado
 
Mensajes: n/a
Puntos:
Pregunta Manejador de evento como parte de una clase

Hola! Esto es un poco rallada, pero con los expertos en JavaScript que hay por aquí seguro que quedamos todos más contentos.

Estoy haciendo una aplicación con controles autocompletados y cosas así... llamémosle "widget". Un widget es un control de formulario (input text, botón...) sobre el que opero con JavaScript para darle al usuario una funcionalidad más rica.

Me gustaría tener la funcionalidad de cada widget encapsulada en una clase u objeto. Básicamente esta información es el id del objeto y algunas funciones. Por ejemplo, imaginemos un "widget" para seleccionar localidad a través de un option select. Al principio, el select muestra una lista de países. Cuando seleccionas un país, entonces aparecen en ese mismo select todas las ciudades de ese país (en realidad es un poco más complejo, pero dejémoslo así de momento).

Por ejemplo (estoy usando jQuery):

Código:
function WidgetSeleccionarLocalidad(id) {
    this.widget = $("#" + id);
    widget.addClass("widgetizado");

    this.modoSeleccionPais = function () {
        //Carga los países por AJAX y los mete en el select
        this.widget.operacionesParaMeterOpciones();
    }

    this.modoSeleccionLocalidad = function() {
        //Carga por AJAX las localidades del país seleccionado y los mete en el select
        this.widget.operacionesParaMeterOpciones();
    }
}
Bien, se supone que con esto puedo tener varios widgets a la vez, creando diferentes instancias de la clase WidgetSeleccionarLocalidad().

Algunas de estas funciones se asociarán a los manejadores de eventos de los controles. Y aquí está el problema: no puedo poner el siguiente código dentro de modoSeleccionPais():

Código:
this.widget.bind("click", this.modoSeleccionLocalidad);
¿Por qué no puedo hacer esto? Porque al pasar por valor el método this.modoSeleccionLocalidad no le estoy pasando la "copia" del método correspondiente a la clase instanciada, sino una función "aislada" del resto de la clase, que no podrá acceder a this.widget, ni a otros atributos que pusiera, ni a otros métodos de la clase.

Llegados a este punto, ¿se os ocurren soluciones? A mí solo se me ocurre dejar las clases y utilizar funciones "planas", aunque no me parece tan elegante como la forma orientada a objetos porque habría que pasar a cada función el widget en concreto, para poder trabajar con él.

Espero haberme explicado, estoy ansioso por leer vuestras ideas al respecto. ¡Gracias!