Migrating from Ext JS 2 to Ext JS 4 - extjs

I am getting this error on page load itself.
Error: [Ext.extend] Attempting to extend from a class which has not been loaded on the page.
javascript//ext-4.1.1a/ext-all-debug.js
Line 4391
I'm not able to render the page at all. Any ideas?
I have also used extjs4 compatibility for migration.

Are you using all of the resources outlined here, including the screencasts? The videos take a little time commitment, but I think you'll find them quite helpful as they walk through several examples of how to debug exactly these types of issues. Learning to debug effectively will be the best way to tackle this type of migration.

There's no class named 'TreeNodeUI' in ExtJS. If you want treepanel, then you need to extend 'treepanel'. Please have a look at examples given on Sencha website before trying out any code.

Related

Integrating Angular with ExtJS

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.

Why Ext.grid.plugin.RowEditing not working properly while using extended store?

I'm facing an issue using Ext.grid.plugin.RowEditing inside an ExtJS 4.1.1 MVC application. As far as I know, I have to provide my own Ext.data.Store extension for use inside an Ext MVC architecture, but doing this, form fields displayed inside the editing ruler remain empty, even though the corresponding record is fully filled. Indeed, before installing the plugin in my MVC project, I made a quick test in which the store is instanciated from the core class and everything works correctly.
I have googled a bit about that and found some quite close topics, but nothing that could help me so far. So, I hope anyone here has encountered the same problem.
Update
I have tried to reproduce this bug here http://jsfiddle.net/hcNgP/ with no success. I currently suspect my version of ExtJS (Ext.getVersion() gives me 4.1.1.1). I'll go back here with more details as soon as possible. Thanks everyone.
Not sure what you mean by extended store, but here is a full example that works as designed.
http://jsfiddle.net/dbrin/uu56M/

Creating charts with Netzke

Does anyone knows the way to create ext js charts with Netzke? I guess there is no such component right know, but maybe someone have an idea.
What are the basic steps to connect using Rails and EXT JS, without Netzke?
I have looked at that gist and this https://gist.github.com/1190511
But I still can't figure it out. Is there a chance to see, no matter how simple a working version of the simplest chart in the Demo app or anything else? I understand the EXT side but I am having a real problem in putting it together with Netzke. I know I am missing something really simple.
A chart component is too application-specific, but it's surely possible to create one using Netzke built-in client-server mechanisms. Here's a demo: http://variant.herokuapp.com (try selecting different dates on the calendar to see the charts updated on the fly). Here's a gist for the LineChart component used there: https://gist.github.com/4112061 - hope, it can give you an idea (Netzke 0.7.x).

extjs grid filter example not loading data

I'm attempting to learn a bit more about out how grid filtering works in Extjs.
I'm using the example that comes with the JS 4 download, i.e.
http://docs.sencha.com/ext-js/4-0/#!/example/grid-filtering/grid-filter-local.html
I can run it on my local server such that it displays the grid outline (with filter options in the column headers), but no data gets loaded at all. I was hoping that I could just use the local flag with the accompanying JSON file without the need to get involved with the SQLlite aspects, for a start.
I can't figure out why the JSON data isn't loading though. Any help, hints or tips would be much appreciated. I've spent ages on this, looking at other examples, both via here, Google and the Sencha website.
Mark as complete (see above) though I don't know detail on why it's started working.

Adding a filter header row to ExtJS GridPanel

I know that it's possible to add a filter row UNDER the column title because I've seen it done with Coolite. But since I'm a total newbie with Sencha (ExtJS), I have trouble finding how to do it with the ExtJS.grid.GridPanel directly in the script. Would you point me in the right direction with some samples please ?
If possible, I would like to do so without plugins, but if there's one out there doing great and easy to use, I could change my mind.
Thanks !
Here you have a link to the GridHeaderFilters Plugin. There you have an easy example of how to use it.
And regarding your comment about trying to do this without a plugin I recommend you not to do it. Because this might seem like a easy code to write but I believe it is not. And that is why this plugin has hundreds of lines. I think this is not a plugin full of features that you won't use, this plugin just does the filtering the way you need it.
And as a final note, if you are expecting the exact same behavior as in this coolite example I think you are out of luck. Because if you get the javascript source code of that example and run it through jsbeautifier you will see that this example is not using any ExtJS plugin and is not a easy code as is using a really complex template for the headers.

Resources