Can jQuery be used with Ext.js? - javascript

After reading some of the jQuery vs ext js questions here and google search result, my understanding is that ext js is a UI building library and jQuery is a more fundamental javascript framework. I've used jQuery for a while now. It's pretty cool but in general a better (much better) javascript.
So my question is: how easy is it to use jQuery for DOM navigation/manipulation and Ext.js for UI in the same project?
There is a page on jQuery website. But the demo is too simple and the external links to Ext.js are all dead.
I'm sure it's possible, but what sort of problems and challenges would I be facing?
You might be wondering why I want to do this. Well, the Ext.js set of UI just looks much better/more polished/more feature rich then jQuery UI. I'm particularly interested in the grid.
Thanks!

Using both libraries side by side is not an issue in the technical way (just add the jquery within a script-tag, that's it!). However, you should not use jQuery for ExtJS' stuff or vice versa. Well, unless you know exactly what you do.
The actual issue can be DOM manipulations (jQuery or ExtJS Core) outside of an ExtJS component that affect an existing component.
So, in a nutshell: You can use DOM manipulations when it will not affect the ExtJS components. Otherwise use the proper way within the component itself.

Well you dont need both the libraries to live together.. Extjs has DOM manipulation api too probably not as vast as jquery but it does have the basic stuff.
Coming to Jquery, jquery has UI building APIs too if not rolled into the library there are vast no of extensions for all kinds of problems. Just try googling whatever UI you are building now with respect to jquery and you will find a library for sure.. There is jquery templates too that lets you generate HTML markup from a template defined by you and applying data objects (json) to it.. Jquery has a vast community too so most of your questios or concerns will be addressed by the community almost instantly..
So yea my suggestion would be to choose one library and stick to it and contribute to the library if there are many missing features..
Lastly I would suggest you choose Jquery.. It rocks.. period..

I think you would have no problem do this stuff... Make Ext.js your main jQuery library and jQuery as the data manipulation library for the DOM.
There would be no problem or conflicts because jQuery is compatible with other javascript libraries.

Related

Using jQuery widget in Dojo

My web app mainly uses Dojo and I'm trying to implement jQuery's select2 (https://select2.github.io/). I read this and I know that it's possible to mix the two together but in my case, everything's built on top of Dojo and it's already a rather large web app. So is it still possible to implement a single jQuery widget into my Dojo based web app?
If not, would I have to go through the source code for select2 and convert into Dojo form?
I don't see why it wouldn't work. As long as there aren't any conflicts, you can use other libraries in conjunction with dojo. Now it may not be built with the AMD like everything else in dojo but it will still work fine.

AngularJS and jQuery... What's wrong with using both?

I saw a few blog articles saying that AngularJS and jQuery could be used together in one app. That seems good as jQuery has some functionalities Angular doesn't have and Angular allows us to make a greatly structured logic for a web app.
The fact is, as I'm french I also take a look at french blog articles about that, and french tends to say that we should never use jQuery and Angular together. I asked why on a forum and people said that it's probably because beginners usually use jQuery and Angular for the same things : adding elements dynamically, use ajax requests, etc... But I'd like to use jQuery for some things Angular does not do and to allow bootstrap js to work on my app.
What do you think, are jQuery and Angular bad at working together in one single app? Or does it just depend on how we make them work together?
AngularJS uses JQuery itself, the major reason not to mix and match is just what you described of them stepping on each other's toes.
While I was learning Angular a lot of the time I would end up using JQuery alongside it because I didn't understand Angular or know it's full capabilities. After learning it better my code has continuously less JQuery in it, but if I can't figure it out in angular, I'll make sure it works with JQuery until I can get it.
I guess it depends on what you're aiming for. If you want to develop an Angular app, then Angular already includes a version of jQuery called jQlite, but you can still use jQuery in your Angular app if you want to.
You can actually "wrap" jQuery code into custom Angular directives, which is pretty sweet.
In an Angular app it's safe to include jQuery if you want to implement some Bootstrap functionality. Currently, I'm doing that to implement Bootstrap's collapse component. I have only just begun developing in Angular, so I am not an expert as to all the ins-and-outs of using jQuery with Angular.

How to use knockout.js with CMS?

All the examples at ko.js site are build manually and models and views are handcrafted.
What if I want to use ko.js on site that doesn't create data-binding attributes in the backend? Is it possible to apply bindings dynamically in document?
Otherwise it seems like ko.js would support only custom projects and not e.g. CMS sites such as WordPress or Drupal (without extensive customization).
Say I have a nice form rendered from CMS that I would like to use together with ko.js to provide functionality. How do I add ko.js to it?
From what I can ascertain from your description, I don't think knockout or indeed any MVVM binding framework is correct for you. It would be good to understand more about what you are trying to do, with some sample code, before we help any further.
The samples over at knockout's page are a little simple, you may want to check out http://www.scottlogic.com/blog/2014/07/30/spa-angular-knockout.html for a more in-depth article with code.

Is jQuery compatible with ExtJS?

I believe Ext.js was using jQuery, but I'm not sure. Does anyone know if there is full compatibility with jQuery and Ext.js?
Ext.js is completely independent of jQuery and as such does not rely on jQuery in any way. Don't know what you mean by 'full compatibility' but you can use both on the same page as they don't interfere with each other.
As Ext.js doesn't use the $-function, you don't even have to do any special trickery to get them to work together, as is the case with using Prototype with jQuery, for example.
You should be able to find some answers on the jquery site where it talks about using jQuery with other libraries.
Hope this helps some.
For ExtJS 3 for example, you need to follow a given loading order for these libraries AND load the ExtJS jQuery adapter.
See http://www.extjs.com/learn/Ext_Getting_Started for details :
jQuery (1.1+) jquery.js
jquery-plugins.js // required jQuery plugins
ext-jquery-adapter.js
ext-all.js (or your choice of files)
I think jQuery (core) and ExtJS are very compatible. I prefer to start new projects using both; in fact, flot.js demands jQuery - and flot.js is very nice - so in nearly every project I use both jQuery and ExtJS. Go for it!
Though ExtJS has made strides in their DOM manipulation and traversal utilities (core), nothing beats the elegance of jQuery (core). However, I prefer ExtJS (UI) to jQuery UI; I find it is much more homogeneous (and capable) than jQuery UI.
Upto Extjs 3.XX, adapters were configurable.
But Sencha (Ext4) onwards, there is no separate adapters, instead we have ExtCore.
No more other libraries
ExtJS used to be built on top of other libraries. With version 2 they had their own but still offered the possibility to use other libs. But not anymore with version 3. ExtJS core code is very very mature, very efficient and VERY tidy. If you ask me, their code is written a lot better than jQuery's but that's subjective.
Combine with jQuery with no tricks
Anyway. If you intend to use ExtJS but would like to use other libs as well you can still do that. But if you think that you'd rather use jQuery with ExtJS I suggest you don't do that, because your code will have many hacks to overcome differences. I would rather use just ExtJS. You'll like it and probably won't want to switch back anymore.

Is there a lightweight library to do draggable+sortable lists inside greasemonkey scripts?

I'm writing a GreaseMonkey script, as part of which I'd like to sort a list by dragging its items. I'm using mootools, but the component for sortable lists doesn't work in the GM sandboxed environment. Can you recommend a smallish library/piece of code to do list sorting in the most lightweight fashion? I want it to be independant of any large framework and don't feel like implementing it myself.
If you need to debug a library such as mootools, instead of #require-ing it, just copy/paste the entire source into your own script. Then you can debug it the same as your own code.
On another note, this script includes the ability to drag-and-drop it's own window around the screen, with no additional library. Maybe you could analyze it and borrow code?
Use this Javascript QuickSort implementation
I'm not sure if there are any particular issues with just MooTools, but in general you may include external scripts into a GreaseMonkey script.
This has been addressed in previous questions like this one or this, as well as on the GreaseSpot wiki.

Categories