Question

I open a popin in element .popin-foto. When I try open sub class popin in same element it’s not works.

The code

this is the parent

function Popin(container, titulo, url_listagem) {
    this.url_listagem = url_listagem;
    this.titulo = titulo;
    this.overlay = $(".popin-overlay");
    this.closeButton = $(".popin-close");
    this.container = container;
}

Popin.prototype.header = function() {
    var dados = {titulo: this.titulo};
    var html = $.tmpl("header", dados);
    this.container.append(html);
};

Popin.prototype.body = function() {
    var html = $.tmpl("body");
    this.container.append(html);
};

Popin.prototype.footer = function() {
    var html = $.tmpl("footer");
    this.container.append(html);
};

Popin.prototype.close = function() {
    var self = this;

    this.container.hide(100,function(){
        self.overlay.fadeOut('fast');
    });

    $(".popin-header").remove();
    $(".popin-body").remove();
    $(".popin-footer").remove();
};

Popin.prototype.open = function(){
    var self = this;

    this.header();
    this.body();
    this.footer();

    this.closeButton.click(function(){
        self.close();
    });

    this.overlay.fadeTo("fast", 0.8, function(){
        self.container.show();
    });
};

the sub class

function PopinFoto(){}

PopinFoto.prototype = new Popin($(".popin-fotos"), "fotos", "fake_url");
PopinFoto.prototype.open = function(){
    Popin.prototype.open.call(this);
    $(".enviar-foto").die().live('click', function(){
        //do something
    });
};

So, I do this:

var popin = new Popin($(".popin-foto"), "title", "link");
popin.open();
popin.close();

var popinFoto = new PopinFoto($(".popin-foto"), "title", "link");
popinFoto.open(); //this not works
popin.close();

And in console, no error was raised.

Can you help me?

Answer 1

it looks like your subclass isn’t being set up properly, as you are setting the subclass’s prototype to a concrete instance of the super class.

i’m not sure exactly what you’re trying to achieve, but i’d wager that the subclass constructor needs to call the super class constructor directly, something like this:

function PopinFoto(container, titulo, url_listagem){
    Popin.call(this, container, titulo, url_listagem);
}