I want to create a popup using angularjs in Extjs Page.This is my current situation.I have manually bootstrapped angular link when they click.now the issue is ext-all.css and bootstrap.css files are conflicting.So How can i avoid this conflict.Can any one suggest idea?any conflict arise in js file if its in same page? Lot of thanks in advance
AngularJS + ExtJS - another question in stackoverflow read this before considering to combine both.
I have tried doing it for my websites for curiosity's sake but it creates more problems then it solves. I would strongly recommend sticking to one framework.
You can combine Jquery and ExtJS without problems because they do not have any conflicting elements.
Your conflict probably arises from the same naming and calling that might or might not exist within the libraries of these two frameworks. The way I see to fix it would be to go within a library and start solving the conflicts. That will be very tedious to say the least.
I wouldn't really mix these frameworks together in a single project. ExtJs is a fully fledged component based framework which should provide most, if not all the functionality that you need. If you are missing something then you should look at the Sencha forums section on user plugins and extensions or even build it yourself.
ExtJs provides most, if not all of the functionality of AngularJs already but adds visual components such as grids, forms, windows, treepanels etc. If your using Ext already for your project you should really stick by it. Adding another framework adds complexity and additional libraries to download, increasing load times etc.
Related
I have been looking for a component set for a start-up project which would be based on AngularJS.
After some research, I have found three common component sets which can be applicable.
The first is AngularJS Bootstrap UI. It seems clear, but there are no enough examples and documentation.
The second is angular-strap. I have seen that it is a simple implementation of bootstrap.js with some additional features, but it seem very simple.
And the last one is QuantumUI. I have seen that it is amazing, but it seems very new.
What is the experience with these frameworks? Can you list pros cons for them?
I am owner of QuantumUI and is is not truth to say anything about other's projects.
However I can say that in short;
ui-bootstrap: is pure angular based, but it is old and not compatiable with new angular versions. Also it's plugins are very simple.
Also angular-strap is a implementation of bootstrap.js. Namely, it isn't a project of angular thinking.
However QuantumUI is a compact angular solution. It's components are powerful, server and developer friendly and also there is no Jquery dependency. All components are results of angular thinking.
We're about to start a project using mentioned libraries. We have already used jQM in another project, but coupled with Backbone. Now we're thinking about using AngularJS with jQM. Do you think it's a good idea? And if not, why?
To elaborate, the question is whether it is advisable/recommended/easy/beneficial to use these libraries together, or maybe there is something that should prevent us from using them both in one project. We don't want to spend half of project's time on making them work together just on principle.
AngularJS and JQM do different things. AngularJS is MVC + Lot More. JQM on the other hand is for direct UI manipulation (lower level than Angular). The good news is AngularJS is flexible and will let you work with any other Javascript framework including JQM. The recommended way of using them together is use the adapter as mentioned above or create your own reusable directives that will add "JQM nature" to your views. For e.g. you can create a directive that will convert a standard UL to a fancier JQM list. The good thing about doing this in directives and not within your view is that your UI code is separated in separate modules and not intermingled with business logic.
I'm really enjoying learning to use AngularJS. Now I'm looking for components I can use with it. I've been looking at Angular-UI components but I'd like to know if it's possible to use the nice, supercharged components in ExtJS. Does anyone have experience with this? Any hints or tips or Angular directive libraries?
The company I work for is making a similar move. We currently rely heavily on an older version (3.x) of ExtJS, and the effort to upgrade to the current (5.0) version is at least equal to the effort required to move to angular.
To answer the question (to the best of my limited knowledge):
They can exist together in the same JS application.
Can you use UI elements of ExtJs with Angular?
You can put angular in control of markup via HTML templates in Ext.
Is this a wise idea?
Probably not.
Why would I consider doing this?
I need absolute control over the markup and don't care about possible page load issues
I need to serialize or de-serialize in some special way that Ext doesn't innately provide
I need to do something special like pub/sub (still totally possible with Ext)
In our case, it is a proof of concept for a few modals. If I am biased, I am biased in the direction of ExtJs (which is a huge statement given my background). The more exposure I have to ExtJS, the more I personally like it. I've used several frameworks in the past like Ember, Backbone, KnockoutJs and AngularJs and they are excellent tools that are reaching a level of maturity that makes them excellent choices. That said, they don't follow the same development model/pattern that ExtJs does, and I don't think a direct compare is fair to either side.
It would be almost like comparing Ext to Node (silly, I know).
If your project requires some special functionality that you don't believe is possible in Ext, you are probably like me and have limited experience with it. If you have a lot of experience with Ext, and want to try what we are trying, I say go for it. The single downfall of Ext is the size of the built package that is delivered. Another small framework isn't going to help that, but it also isn't going to cause more pain.
In the end, for me, I just love JS and expanding my knowledge of how things work now and in the future.
For the post above asking about the lack of traction for Ext: the answer is simple... it's not free, and thus not an option for many of us who aren't writing commercial software that fits well with the license.
In our AngularJS app at work, we have integrated a 3rd party ExtJS app with it, not for its UI components though. We open certain popups of that app based on user input and when the user commits data in the popup, we respond to ExtJs events to refresh our app. AngularJS is flexible enough to integrate with any other Javascript code/libraries as long as the library has public events to respond to. I would recommend going through the Directive and scope documentation on how to effectively create directives and respond to scope events.
Personally I do not feel ExtJS and AngularJS would be needed together, unless you are forced to use it like me. There is http://angular-ui.github.io/ that brings in a lot to the table. Again any given JQuery plugin can be integrated using directives, filters etc in AngularJS. So you may want to investigate into that before trying to bother with ExtJS.
Why do you need AngularJS anyway if you have ExtJS? I agree learning Ext can be somewhat difficult though once you've bitten through it there is nothing better at the moment. The only disadvantage is the heavier footprint but who cares? It's not like it's causing any problems... We use nothing but ExtJS at work and the progress in our apps is amazing. It integrates seamlessly with Spring MVC. We don't need to hack in HTML directly which I consider more of an advantage than a disadvantage: no more writing tags, no more open/close tag issues, you can still use css and Ext handles any browser incompatibilities so what else do you need more?? Angular is just the new kid on the block but in total it can not (yet) compete with ExtJS. It doesn't even com close. Just my 2$.
Sencha is planning to add support in the framework. Please find the link at the bottom for reference:
At SenchaCon in Las Vegas on November 7-9 2016, Sencha will be introducing the ability to use Ext JS components, layouts, and themes within an Angular 2 application, which we are currently calling the Ext JS Bridge to Angular 2 (also known as ‘The Bridge’).
https://www.sencha.com/blog/first-look-ext-js-bridge-to-angular-2/
I am trying to find examples of how to wrap ExtJs and ExtJs 'modules' up for use with a javascript dependency framework such as RequireJS or LAB.
I am working with a large ExtJs based project and there are many separate module files which are just bulk included everywhere and it is getting a little out of control.
Has anyone used an existing depenency management framework with ExtJs? (I know ExtJs 4 may include something similar, but I am fixed on using ExtJs 3)
I wrote my own dependency utility (well my boss wrote it as a method for another framework we are building, and I just ported it to ExtJS) as a mixin where you can just define what your dependencies are, and include events for when they are loaded.
Using Grunt
https://github.com/mattgoldspink/grunt-sencha-dependencies
Sencha Cmd now does it automatically as well - unfortunately it considers ExtJS4.1 as legacy, let alone 3.
ExtJS have "adapter" for working with other javascript libraries. But why? Why not just use Ext Core?
UPDATE:
I know it was designed for YUI. But why it need an adapter?
ExtJs use ExtJs namespace, almost all other framework
use $, they should never conflict.
jQuery can work with others without any adapter. Why Extjs need it?
Is there any extra functionality provided by these adapters?
Am I missing anything?
I know there are some people here that were part of the early ExtJS Team so they probably will have a better answer, but basically ExtJS started as an extension to YUI where it was using the YUI Library to create a set of components to use.
Then it was modified using the adapter design pattern to support people that were already using jQuery or Prototype which had a few advantages: Fewer JavaScript to load on the page (if you already used jQuery you didn't need to load the YUI library) and let coders re-use their existing skills.
I can only assume that as the set of Components evolved it became easier to write a core adapter written in an optimized way for the ExtJS set of Components, and not rely on an external library for bug fixing, etc.
I would add that personally, I feel much more comfortable using the Ext Core as the adapter even though I prefer jQuery for a lot of DOM manipulations, but I think there are less chances of facing bugs while using the components if the base adapter is Ext Core.
UPDATE -
Based on your updated question, I think what you are missing is the separation from Ext Core and ExtJS.
ExtJS - A library of JavaScript Components (mainly UI but also Data classes, themes, etc.) that allows to build Rich Internet Application.
Ext Core - A cross-browser javascript library used to enhance web pages with dynamic changes (some Dom Querying, Dom traversal/manipulation, Ajax requests, etc.)
If you want to make the comparison into the jQuery world, Ext Core = jQuery and ExtJS = jQueryUI.
Now with jQueryUI, you NEED the jQuery library with it, because jQueryUI is built on TOP of jQuery.
With ExtJS, because it was built on top of YUI originally even before Ext Core existed, you can if you want use ExtJS WITHOUT Ext Core, but with the jQuery or YUI adapter for example.
You CANNOT ust ExtJS on it's own without any of the adapters, just like you can't use jQueryUI without jQuery.
I hope this answer your question.
ExtJS used to be built on top of YUI, so there were adapters created for operating with other libraries as well. I think as of version 1.1, ExtJS became a standalone framework, so these adapters are now optional. I think the adapters are now for people who are more comfortable with the basic frameworks of the other libraries, but want to use certain components of the ExtJS library (Ext's greatest strength is their UI widget toolkit, IMHO).
Take a look at this SO question too:
Is jQuery compatible with ExtJS?