[Javascript] OOP

[Guillome]

Hoi,

Ik wil een object maken die een collectie inputs bewerkt, zodat je makkelijk meerdere items kan aan/afvinken.
Dit is mijn code:
Poging 1:

JavaScript:

input_multi_select =
  {
    _select: function(e)
    {
      var e = e || windows.event;
      var obj = e.target ? e.target : e.srcElement;
      alert(self.item_collection.length);
    },
    item_collection:null,
    create: function(name)
    {
      this.item_collection = document.getElementsByName(name);
      for(i = 0; i < this.item_collection.length; i++)
      {
        this.item_collection[i].index = i;
        this.item_collection[i].self = this;
        this.item_collection[i].onclick = this._select;
      }
    }
  }
  input_multi_select.create("aangemeld[]");
  input_multi_select.create("aangemeld2[]");

Poging 2:

JavaScript:

input_multi_select = function(name)
  {
    _select = function(e)
    {
      var e = e || windows.event;
      var obj = e.target ? e.target : e.srcElement;
      var self = obj.self;
      alert(self);
    }
    var item_collection = null;
    alert(this._select);
    item_collection = document.getElementsByName(name);
    for(i = 0; i < item_collection.length; i++)
    {
      item_collection[i].index = i;
      item_collection[i].self = this;
      item_collection[i].onclick = this._select;
    }
  }
  var t1 = new input_multi_select("aangemeld[]");
  var t2 = new input_multi_select("aangemeld2[]");

En de HTML erboven:

HTML:

<table><tr><td>
  <input name="aangemeld[]" type="checkbox" value="1"/>1<br />
  <input name="aangemeld[]" type="checkbox" value="2"/>2<br />
  <input name="aangemeld[]" type="checkbox" value="3"/>3<br />
  <input name="aangemeld[]" type="checkbox" value="4"/>4<br />
  <input name="aangemeld[]" type="checkbox" value="5"/>5<br />
  <input name="aangemeld[]" type="checkbox" value="6"/>6<br />
  <input name="aangemeld[]" type="checkbox" value="7"/>7<br />
  </td><td>
  
  <input name="aangemeld2[]" type="checkbox" value="1"/>1<br />
  <input name="aangemeld2[]" type="checkbox" value="2"/>2<br />
  <input name="aangemeld2[]" type="checkbox" value="3"/>3<br />
</td></tr></table>

Mijn probleem zit `m in het volgende. Met poging 1 wordt de 1e "input_multi_select.create("aangemeld[]");" overschreven door de 2e.
Het probleem met de 2e is dat hij de functie _select niet kent (de alert(this._select)).

Wat doe ik fout?

Mijn 2e vraag. Je ziet dat ik het object aan alle inputs koppel, aan de variabele input.self. Kan dit ook anders (op een juiste manier)?

[ Voor 19% gewijzigd door Guillome op 02-02-2010 14:59 ]

[Verwijderd]

JavaScript:

input_multi_select = function(name)
  {
    _select = function(e)
    {
      var e = e || windows.event;
      var obj = e.target ? e.target : e.srcElement;
      var self = obj.self;
      alert(self);
    }
    var item_collection = null;
    
    alert(_select); // <-- _select heeft local scope
    
    item_collection = document.getElementsByName(name);
    for(i = 0; i < item_collection.length; i++)
    {
      item_collection[i].index = i;
      item_collection[i].self = this;
      
      item_collection[i].onclick = _select;  // <-- _select heeft local scope
      
    }
  }
  var t1 = new input_multi_select("aangemeld[]");
  var t2 = new input_multi_select("aangemeld2[]");

[ Voor 170% gewijzigd door Verwijderd op 02-02-2010 16:20 ]