ExtJS 4.x support

Feature requests
eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Tue Nov 15, 2011 4:43 pm

I have uploaded a new version and a new tutorial for how to create a profile for Ext 4, you can take a look at this page.

daddyschmack
Posts: 4
Joined: Mon Nov 14, 2011 9:47 pm

Re: ExtJS 4.x support

Post by daddyschmack » Wed Nov 16, 2011 3:10 pm

Eric,

That helped, but still having some issues.
When trying code assist,
After typing:
"var w = new Ext."
I do see "window" in the code assist.
But when I type:
"var b = w."
I don't see "addButton" in the suggestion list.
I do see "addTool".
Maybe I didn't download the fully updated software or possibly do I need to check anything besides the "All" checkbox after selecting the sdk.jsb3 file?

Thanks,

John

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Wed Nov 16, 2011 4:24 pm

I don't think window has addButton method in version 4.x, Ext 3.x do have addButton method.

daddyschmack
Posts: 4
Joined: Mon Nov 14, 2011 9:47 pm

Re: ExtJS 4.x support

Post by daddyschmack » Thu Nov 17, 2011 7:30 pm

Hi Eric,

Okay, I made the changes to the jsb3 file. getting rid of 'platform/' wherever it occured. I started going through the ext 4 tutorials and documentation. They have an example:

Code: Select all

applyTitle: function(title) {
        if (!Ext.isString(title) || title.length === 0) {
            alert('Error: Title must be a valid non-empty string');
        }
        else {
            return title;
        }
    },
So I tried testing Spket with that small function.
if I type in 'Ext.'

Should I see 'isString' in the list? Currently I only see '.isPrototype'. Maybe I have it configured wrong? I downloaded Spket last on Monday.. Also, I just did a check for updated software, and none was reported.. Is there a later version of com.spket.js_1.6.18.jar that I need to download since then?

Sorry to keep bugging you.

Thanks,

John

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Fri Nov 18, 2011 5:10 am

The problem of update should be fixed now, please try again.

The new version already handle the problem of sdk.jsb3, so you don't need change it manually, please use the original sdk.jsb3.

daddyschmack
Posts: 4
Joined: Mon Nov 14, 2011 9:47 pm

Re: ExtJS 4.x support

Post by daddyschmack » Fri Nov 18, 2011 4:39 pm

Okay, that sems to have fixed the issue. I tested creating a custom class like in your example, and it worked just as you illustrated.

Thanks you so much!!!!

liu78778
Posts: 4
Joined: Mon May 16, 2011 2:35 pm

Re: ExtJS 4.x support

Post by liu78778 » Wed Dec 14, 2011 3:32 am

Ext.define is no code assist
However, we now use it to replace Ext.extend
Hope it works :wink:

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Wed Dec 14, 2011 7:08 am

liu78778 wrote:Ext.define is no code assist
However, we now use it to replace Ext.extend
Hope it works :wink:
Could you give more information? Ext.define seems works fine for me.

Code: Select all

Ext.define('my.MyWindow', {
  extend: 'Ext.window.Window',
  
  childFunction: function() {
    this. //code assist works here
  }
});

var w = Ext.create('my.MyWindow');

w. //code assist works here

liu78778
Posts: 4
Joined: Mon May 16, 2011 2:35 pm

Re: ExtJS 4.x support

Post by liu78778 » Sat Dec 31, 2011 3:08 am

eric_suen wrote:
liu78778 wrote:Ext.define is no code assist
However, we now use it to replace Ext.extend
Hope it works :wink:
Could you give more information? Ext.define seems works fine for me.

Code: Select all

Ext.define('my.MyWindow', {
  extend: 'Ext.window.Window',
  
  childFunction: function() {
    this. //code assist works here
  }
});

var w = Ext.create('my.MyWindow');

w. //code assist works here
yea! it works now! but Ext.Ajax or Ext.data.Connection has no code assist now...everyone else the same?

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Sat Dec 31, 2011 5:06 am

the problem is sdk.jsb3, some files are in folder "../../platform/src/", some are in folder "../../platform/", which are missing in the package, will release a new version soon to fix this problem.

hlai
Posts: 1
Joined: Fri Mar 16, 2012 1:42 pm

Re: ExtJS 4.x support

Post by hlai » Fri Mar 16, 2012 1:58 pm

In the EXTJS 4.1 beta and release candidate, there is no build/sdk.jsb3 file
Is there a way to create the sdk.jsb3 file, or another way to get Spket working with EXTSJS 4.1?

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Fri Mar 16, 2012 6:33 pm

You can take a look at this post: viewtopic.php?f=6&t=1866&start=45#p4837

rmxbot
Posts: 1
Joined: Wed Jun 20, 2012 8:27 am

[ExtJS 4.1] Rowexpander and Grid. Expand the specified item.

Post by rmxbot » Wed Jun 20, 2012 8:30 am

Good day!

Need help ExtJS 4.1

There is a ComboBox. There is a Grid. Grid plugged plug rowexpander.
ComboBox and Grid take data from one array.

The purpose of the script: after selecting an item in the ComboBox - open the corresponding rowexpander in the grid.
That is, The user selects in ComboBox «Alcoa Inc» and in the field of Grid row with the name of the company «Alcoa Inc» rowexplander is disclosed.

Problem:
I can not turn to the records in the table and call the event expandbody / collapsebody

After selecting a ComboBox'e I get the id of the selected item, which corresponds to the id record in Grid, but also how to use it, what would appeal - I can not understand.

grid.getView (). getNode (0) - got so appeal, but it's not something that would help me.

PS So far, the variables are declared as window.grid and window.simpleCombo to simplify debugging

The script:

Code: Select all

Ext.Loader.setConfig({
    enabled: true
});
Ext.Loader.setPath('Ext.ux', '../examples/ux');

Ext.require([
    'Ext.data.*',
    'Ext.grid.*',
    'Ext.util.*',
    'Ext.ux.RowExpander',
    'Ext.selection.CheckboxModel',
    'Ext.tip.QuickTipManager',
    'Ext.ux.data.PagingMemoryProxy',
    'Ext.toolbar.Paging',
    'Ext.ux.SlidingPager',
    'Ext.form.field.ComboBox',
    'Ext.form.FieldSet'
]);

Ext.onReady(function(){
    
    Ext.tip.QuickTipManager.init();

    var myData = [
        ['0','3m Co',71.72,'9/1 12:00am'],
        ['1','Alcoa Inc',29.01,'9/1 12:00am'],
        ['2','Altria Group Inc',83.81,'9/1 12:00am'],
        ['3','American Express Company',52.55,'9/1 12:00am'],
        ['4','American International Group, Inc.',64.13,'9/1 12:00am'],
        ['5','AT&T Inc.',31.61,'9/1 12:00am'],
        ['6','Boeing Co.',75.43,'9/1 12:00am'],
        ['7','Caterpillar Inc.',67.27,'9/1 12:00am'],
        ['8','Citigroup, Inc.',49.37,'9/1 12:00am']
    ];

    Ext.define('Company', {
        extend: 'Ext.data.Model',
        idProperty: 'company',
        fields: [
           {name: 'id', type: 'int'},
           {name: 'company', type: 'string'},
           {name: 'price', type: 'float'},
           {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
        ]        
    });

    Ext.define('State', {
    extend: 'Ext.data.Model',
    fields: [
        {type: 'int', name: 'id'},
        {type: 'string', name: 'name'}
    ]
});
    
    var store = Ext.create('Ext.data.Store', {
        model: 'Company',
        remoteSort: true,
        pageSize: 3,
        proxy: {
            type: 'pagingmemory',
            data: myData,
            reader: {
                type: 'array'
            }
        }
    });
    
    // create the data store for combobox
	function createStore() {
    return Ext.create('Ext.data.Store', {
        autoDestroy: true,
        model: 'State',
        data: myData
    });
}

    // create the Grid
    window.grid = Ext.createWidget('gridpanel', {
        title:'Sliding Pager',
        store: store,
        columns: [ {
                id:'company',
                text: 'Company',
                sortable: true,
                dataIndex: 'company',
                flex: 1
            },{
                text: 'Price',
                sortable: true,
                renderer: Ext.util.Format.usMoney,
                dataIndex: 'price',
                width: 75
            },{
                text: 'Last Updated',
                sortable: true,
                dataIndex: 'lastChange',
                width: 75
            }],
        stripeRows: true,
        height:320,
        minHeight: 160,
        width:700,
        frame:true, //+ 
        plugins: [{
            ptype: 'rowexpander',
	    id: 'atata',
            rowBodyTpl : [
                '<p>Company: <b>{company}</b></p>',
                '<p><b>$ {price}</b></p>'
            ]
        }],
        collapsible: true,
        animCollapse: false, // end +
        resizable: {
            handles: 's'  
        },
        bbar: Ext.create('Ext.PagingToolbar', {
            pageSize: 3,
            store: store,
            displayInfo: true,
            plugins: Ext.create('Ext.ux.SlidingPager', {})
        })
    });

    grid.render('grid-example');

    function open_some_plus(val) {
	
	alert(grid.getView().getNode(val));

	}

	// Simple ComboBox using the data store
   window.simpleCombo = Ext.create('Ext.form.field.ComboBox', {
        fieldLabel: 'Select a single state',
        renderTo: 'simpleCombo',
        displayField: 'name',
        width: 700,
        labelWidth: 400,
        store: createStore(),
        queryMode: 'local',
        typeAhead: true
    });

simpleCombo.on('select', function() {
	var v = simpleCombo.getValue();
	var record = simpleCombo.findRecord(simpleCombo.valueField || simpleCombo.displayField, v);
	var index = simpleCombo.store.indexOf(record);
	open_some_plus(index);
});
    store.load();

});
Html code:

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Sliding Pager Extension Example</title>

    <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" />
    <link rel="stylesheet" type="text/css" href="shared/example.css" />

    <style type="text/css">
        body .x-panel {
            margin-bottom:20px;
        }
        .icon-grid {
            background-image:url(../shared/icons/fam/grid.png) !important;
        }
        .add {
            background-image:url(../shared/icons/fam/add.gif) !important;
        }
        .option {
            background-image:url(../shared/icons/fam/plugin.gif) !important;
        }
        .remove {
            background-image:url(../shared/icons/fam/delete.gif) !important;
        }
        .save {
            background-image:url(../shared/icons/save.gif) !important;
        }
    </style>

    <script type="text/javascript" src="../ext-all-debug.js"></script>
    <script type="text/javascript" src="app2.js"></script>
</head>
<body>
 <div id="simpleCombo"></div>
 <div id="mydiv_id"></div>
<br/>
<div id="grid-example"></div>
</body>
</html>
Tell me the solution, the second day of the "struggling against the wall."

eric_suen
Site Admin
Posts: 678
Joined: Wed Sep 28, 2005 7:00 am
Contact:

Re: ExtJS 4.x support

Post by eric_suen » Wed Jun 20, 2012 1:14 pm

for question abuot ExtJS itself, you should post on http://www.sencha.com/forum/

MadOtis
Posts: 1
Joined: Tue Mar 26, 2013 1:30 am

Re: ExtJS 4.x support

Post by MadOtis » Tue Mar 26, 2013 1:35 am

I'm trying to get spket working with ExtJS 4.2.xx, but there is no sdk.js3 anywhere in the extjs package. I've tried using the jsb.jar trick to generate one, but the structure seems to have changed betweek ExtJS 4.1.x and 4.2.x. Do you plan, or are already working on an update/fix for ExtJS 4.2? Or, a work-around?

Post Reply

Who is online

Users browsing this forum: No registered users and 2 guests