How to create a constructor in javascript

Question

I am trying to create a constructor in javascript. This constructor is for deleteIcon. Whenever user hover any element and if i want to show a delete icon over that element than i am using this constructor. But i am pretty new in this approach and i want to create a click event also in the constructor . Can anyone please guid me how to do this ?

function deleteIcon(el)
{
        var self = this;
        self.button = $("<button type='button' id='removemyparent' />");

        self.element = el;

        self.add = function () {
            var widths = $(self.element).children().map(function () { return $(this).width(); });
            var maxWidth = max(widths);

            self.button.button({ text: false, icons: { primary: "ui-icon-close" } });
            $(self.element).append(self.button);

            self.button.css({ position: "absolute", top: 0, left: maxWidth - self.button.width() });
        }

        self.remove = function () {
            $(self.element).find("#" + self.button.attr("id")).remove();
        }

        self.button.click = function () {            //this is not working
            self.element.remove();
        }

 }

click is a jQuery method not a property. Also, you're setting a static ID that is going to be used for all instances of deleteIcon... set a class instead. — ahren
– ahren, Commented Oct 18, 2012 at 8:22
@ahren can you tell me the better approach to implement click event in the constructor for the deleteIcon — Tom Rider
– Tom Rider, Commented Oct 18, 2012 at 8:23
the same way you do with any other jQuery object... .click(function(){}); — ahren
– ahren, Commented Oct 18, 2012 at 8:25
@Tom Rider "can you tell me the better approach to implement […]" Yes, read the documentation – it really helpful. Why does your title not relate to the question? Where is that part of code you need a constructor for? — feeela
– feeela, Commented Oct 18, 2012 at 8:33

ahren · Accepted Answer · 2012-10-18 08:26:34Z

4

Try this:

self.button.click(function () { self.element.remove(); })

or:

self.button.on('click', function () { self.element.remove(); })

edited Oct 18, 2012 at 8:26

ahren

17k5 gold badges52 silver badges70 bronze badges

answered Oct 18, 2012 at 8:25

Tallmaris

7,5903 gold badges31 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

CodeWizard · Accepted Answer · 2012-10-18 08:33:38Z

2

There are few ways you can create constructor in JS.

the most easy and clear way is this one:



// Constructor
var MyObj=function(){ .... }

MyObj.prototype = {
    constructor : MyObj,
    button: function(){...},
    add: function(){...},

}

answered Oct 18, 2012 at 8:33

CodeWizard

146k22 gold badges162 silver badges181 bronze badges

Collectives™ on Stack Overflow

How to create a constructor in javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related