Hi Richard, Yeah. Sorry about that. I also sought help from my brother (who's also a programmer) and he found the solution to the problem in minutes. Didn't know there was a separate jQuery library for the UI part. Thanks anyway.
On Mar 4, 4:44 pm, "Richard D. Worth" <rdwo...@gmail.com> wrote: > You need to include jQuery UI, or at least the jQuery UI Core, which > contains the $.widget plugin. You can get it here > > http://jqueryui.com/download > > - Richard > > On Wed, Mar 4, 2009 at 2:09 AM, Reggie Niccolo Santos < > > reggieniccolo.san...@gmail.com> wrote: > > Hi, > > > I'm quite new to jQuery and jQuery UI development (and even JavaScript for > > that matter) and I've been trying out the examples from this tutorial: > > > * > >http://youngisrael-stl.org/wordpress/understanding-jquery-ui-widgets-... > > * > > > and midway through the tutorial, I came across this error while trying out > > the examples: > > > TypeError: $.widget is not a function > > at [Top-level script]() (TestJQueryProject/scripts/testwidget2.js:67) > > > Here's the source code: > > > *example-jquery-ui-widget.html:* > > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " > >http://www.w3.org/TR/html4/strict.dtd";> > > <html dir="ltr" lang="en"> > > <head> > > <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> > > <title>Example: jQuery UI Widget</title> > > <script type="text/javascript" > > src="../lib/jquery/jquery.min.js"></script> > > <script type="text/javascript" > > src="../scripts/testwidget2.js"></script> > > </head> > > <body> > > <p class="target">This is a paragraph called with .green4({ > > level:3, > > greenlevels: ['#000', '#00f', '#088', '#0f0', '#880', > > '#f00', '#808', '#fff'] > > }). > > </p> > > <input type="button" id="toggle" name="on" value="Turn green" /> > > <input type="button" id="darker" name="darker" value="Darker" /> > > <input type="button" id="lighter" name="lighter" value="Lighter" /> > > </body> > > </html> > > > and *testwidget2.js:* > > > $(function() { > > var STR_DARKER = "darker"; > > > var STR_LIGHTER = "lighter"; > > > var STR_OFF = "off"; > > > var BTN_LABEL_TURNGREEN = "Turn green"; > > > var BTN_LABEL_TURNOFF = "Turn off"; > > > $("#toggle").click(function() { > > if ($(this).val() == BTN_LABEL_TURNGREEN) { > > $(".target").green3(); > > $(this).val(BTN_LABEL_TURNOFF); > > } else { // ($(this).val() == BTN_LABEL_TURNOFF; > > $(".target").green3(STR_OFF); > > $(this).val(BTN_LABEL_TURNGREEN); > > } > > }); > > > $("#darker").click(function() { > > $(".target").green3(STR_DARKER); > > }); > > > $("#lighter").click(function() { > > $(".target").green3(STR_LIGHTER); > > }); > > }); > > > var Green3 = { > > > _init: function() { > > this.setLevel(15); > > }, > > > greenlevels: ["#000", "#010", "#020", "#030", "#040", "#050", "#060", > > "070", "#080", > > "#090", "#0a0", "#0b0", "#0c0", "#0d0", "#0e0", "#0f0", "#fff"], > > > level: 0, > > > getLevel: function() { > > return this.level; > > }, > > > setLevel: function(x) { > > this.level = Math.floor(Math.min(this.greenlevels.length - 1, > > Math.max(0, x))); > > this.element.css({ background: this.greenlevels[this.level] }); > > }, > > > darker: function() { > > this.setLevel(this.getLevel() - 1); > > }, > > > lighter: function() { > > this.setLevel(this.getLevel() + 1); > > }, > > > off: function() { > > this.element.css({ background: "none"}); > > this.destroy(); // use the predefined function > > } > > }; > > > $.widget("ui.green3", Green3); // create the widget (the error occurs > > at this line) > > $.ui.green3.getter = "getLevel"; > > > I'm using: > > > *Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.6) Gecko/2009020911 > > Ubuntu/8.04 (hardy) Firefox/3.0.6* > > > Sorry if this turns out to be a simple typo error. I find it quite hard to > > debug JavaScript code. > > Hope you may be able to help me. Thanks in advance. > > > -- > > Warm regards, > > Reggie --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to jquery-ui@googlegroups.com To unsubscribe from this group, send email to jquery-ui+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
