Siri: jQuery: Widget-Konzept

Hallo,

ich versuch mich gerade in jQuery-UI einzuarbeiten.
Im Tutorial gibt es den Abschnitt Widget-Factory mit dem Beispiel-Code:

$.widget( "custom.superDialog", $.ui.dialog, {  
red: function() {  
this.element.css( "color", "red" );  
}  
});  
// Create a new <div>, convert it into a superDialog, and call the red() method.  
$( "<div>I am red</div>" )  
.superDialog()  
.superDialog( "red" );

In der API den Abschnitt Dialog mit dem Beispiel:

<div id="dialog" title="Basic dialog">  
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>  
</div>

$( "#dialog" ).dialog();

Mir erschließt sich jetzt nicht auf Anhieb, wann das Widget-Konzept besser ist als die "schlichte" Vorgehensweise.

Kann mich jemand aufhellen?

Viele Grüße
Siri

  1. Mir erschließt sich jetzt nicht auf Anhieb, wann das Widget-Konzept besser ist als die "schlichte" Vorgehensweise.

    Die Frage habe ich mir auch schon einmal gestellt und bin zu dem Ergebnis gekommen: Das ist keine vernünftige objektorientierte Architektur. :)

    Zuerst einmal gibt es das einfache jQuery-Plugin-Konzept, bei dem jQuery.prototype um eigene Methoden erweitert wird. Die Konvention ist, dass hier wieder das jQuery-Objekt zurückgegeben wird (für Methoden-Verkettung).

    $('#foo').meinPlugin()

    Das Widget-Konzept versucht darauf aufzubauen, aber die Möglichkeit zu geben, die Widget-Methoden von außen aufzurufen. Ich kann ein Widget so installieren:

    $('#foo').meinWidget()

    Wie greife ist aber nun auf das Widget zu und rufe dessen Methoden auf? So ist man auf diese Idee gekommen:

    $('#foo').meinWidget("methodeVomWidget", "parameter", ...)

    Das ruft methodeVomWidget auf und übergibt die Parameter. Es wird von der Methode erwartet, wieder das jQuery-Objekt anstatt das Widget-Objekt zurückzugeben.

    Ich halte das für ziemlichen Quatsch. Es gibt m.M.n. keinen Grund, sich so sklavisch an die jQuery-Konvention zu halten. Das soll wohl für jQuery-Einsteiger gedacht sein, die mit einem gesonderten Widget-Objekt *scheinbar* nicht klarkommen würden. (Das sehe ich nicht so.)

    jQuery ist DOM-zentriert; ein jQuery-Objekt ist immer eine Elementliste und bietet Methoden, um darauf zu operieren. Das Widget-Konzept ist *eigentlich* eine *Abstraktion* davon. Ein Widget sollte ein Objekt sein, das Referenzen auf Elemente bzw. jQuery-Objekte besitzt, nicht umkehrt. So ist das auch in fast allen anderen Frameworks umgesetzt. Deshalb würde ich, selbst wenn ich jQuery UI einsetzen, nicht deren Widget-Konzept verwenden.

    </lästerläster> :)

    Grüße,
    Mathias

    1. Hallo,

      vielen Dank für deine Einschätzung!

      jQuery ist DOM-zentriert; ein jQuery-Objekt ist immer eine Elementliste und bietet Methoden, um darauf zu operieren. Das Widget-Konzept ist *eigentlich* eine *Abstraktion* davon. Ein Widget sollte ein Objekt sein, das Referenzen auf Elemente bzw. jQuery-Objekte besitzt, nicht umkehrt. So ist das auch in fast allen anderen Frameworks umgesetzt. Deshalb würde ich, selbst wenn ich jQuery UI einsetzen, nicht deren Widget-Konzept verwenden.

      Puuh! Das muss man erstmal sehen können!

      Viele Grüße
      Siri