I know this might concern Ext as much as jquery, but since most ext-users at
their forums are still propably using YUI and the problems I seem to have
look specific to the jQuery-port of ext, I posted this here. If anyone else
has had any experience with jQuery and ext yet, please speak up :)
So...
Jack's EXT 1.0 finally came out so I decided to give it a bang. I've been
really waiting to get my hands on those beautiful widgets for quite a while,
and since it's (supposed to be?) jQuery -compatible now then all the better.
And immediately I'm stumped. For someone new to ext, trying to start with
jQuery as the base there is practically no documentation whatsoever. I guess
this is partly because ext was so tightly married to YUI for long. It took
quite a digging to even find out what it means that ext 1.0 supports jquery.
Basically ext needs a base library underneath it, and now it supports jQuery
as well as YUI. ok, that's enough for me, although I was maybe hoping for
some plugin-like functionality so you could directly chain ext-functionality
to jQuery selectors or such. Basically the jQuery support just means that
now jQuery users can use ext without YUI. Ok, that's a goodie anyhow. So
hands dirty with the very basic tutorial to get stuff going...
The introductory tutorial (http://www.extjs.com/tutorial/introduction-ext)
totally ignores the possibility of other libraries besides YUI. After some
digging at the INCLUDE_ORDER.txt I found out the correct order to include
the js-libraries (first jquery, then possible plugins, then the adapter,
then ext). After some more digging in the intro demofile I also found out
that you prolly need to include some css to get to the goodies. This was not
a surprise. I was just totally amazed at the complete lack of documentation
(or is it just my lack of ability in finding any?). If there just was a
single document with information on what files you need to include, and
where they reside, I would've saved a lot of time. Now it was just digging
through the source.
Well now I finally got everything included (js and css with their correct
paths, in the right order, afaik). I got the first example to run perfect,
so this works (you can also run it inside jQuery's document.ready()):
Ext.onReady(function() {
var paragraphClicked = function(e) {
Ext.get(e.target).setOpacity(.25);
}
Ext.select('p').on('click', paragraphClicked);
});
(although the original example used highlight() instead of setOpacity(), but
that, as I found out, seems to be a bug in the jQuery version of ext. This
must already stump many beginners coming from jQuery since most of the
examples start with toying around with highlight(), and it doesn't seem to
do anything at all with the jQuery version.)
However, going any further with the tutorials starts showing up jQuery
errors. The first goodie coming up in the tutorial is the MessageBox, which
aint working at all. Even the simplest example:
Ext.Msg.alert('Status', 'Changes saved successfully.');
fails with "e.style has no properties" in jquery.js (tested with jquery
1.1.1unpacked, 1.1.2 packed gave a slightly different error. Again I dont
even have any idea what version of jQuery is supposedly supported).
The next try with the grid example spits out another error:
"jQuery(el).offset is not a function".
Well indeed it is not.
I secretly hope I've just missed some really important page titled "jQuery
and EXT - start here" but all my efforts to find one were futile. Anyone who
could shed some light to the issue? I was under the impression that some
people in here were (apart from John himself, obviously) part of the strike
team to help with the integration of jQuery and ext.
Thanks in advance.
--
Suni