Code:
{ xtype:'displayfield',
fieldLabel:'Submitted',
bind:'{theRequest.submitted}',
cls:'white-text',
labelWidth:80
}
I get the right format if I use a datefield, but I don't want the look and feel of that widget.
Code:
{ xtype:'displayfield',
fieldLabel:'Submitted',
bind:'{theRequest.submitted}',
cls:'white-text',
labelWidth:80
}
Thank you for reporting this bug. We will make it our priority to review this report.
If a grid is annotated with the emptyText property it will not show when it is supposed to. In my personal app, I can get it to show, but it won't expand the container to actually show the text and I have to manually set the minHeight.This is an example of just one problem with empty Text. Works in 4.2.
http://ift.tt/1ouJ7I4
Thank you for reporting this bug. We will make it our priority to review this report.
Can someone provide detail on how to add new record, and if require user can cancel the changes which removes the newly added record?
I am expecting to have all Create, Update and Delete operation performed on store data can be cancellable.
I would really appreciate if someone can provide a sample code.
Thank you for reporting this bug. We will make it our priority to review this report.
In the shown code (and fiddle)if you use border layout the selection stops working. changing to fit layout makes selection work.
Code:
Ext.application({
name: 'MyApp',
launch: function() {
Ext.create('Ext.container.Viewport', {
autoShow: true,
// if this is fit, selection works, otherwise as border selection does not work
//layout: 'fit',
layout: 'border',
items: [{
xtype: 'grid',
region: 'center',
flex: 1,
store: {
fields: ['id', 'approved', 'interestCount', 'title'],
data: [{
id: 101,
approved: true,
interestCount: 138,
title: 'JavaScript For Smarties Part 1'
}, {
id: 102,
approved: true,
interestCount: 33,
title: 'Last Chance To Learn C#'
}, {
id: 103,
approved: true,
interestCount: 9867,
title: 'How To Not Get Much From AngularJS'
}]
},
columns: [{
header: 'Id',
dataIndex: 'id'
}, {
header: 'Approved',
dataIndex: 'approved'
}, {
header: 'Interest',
dataIndex: 'interestCount'
}, {
header: 'Title',
dataIndex: 'title',
flex: 1
}]
}, {
}]
});
}
});
Thank you for reporting this bug. We will make it our priority to review this report.
Ext version tested: Browser versions tested against:
- Chrome Latest
- Firefox Latest
Description:
- Describe the problem in greater detail here, summarizing the behavior.
Steps to reproduce the problem:
- Create a combobox with a store (with only lowercase items to make it easier) and enableRegex to true
- Set any filter to the combobox that still matches many items in the store
- Try typing anything that matches what's in the combobox
The result that was expected:
- The enableRegex typeahead should let you type stuff and select items
The result that occurs instead:
- Nothing happens at all, nothing is selected from your enableRegex/typeahead
I don't have the time currently to make the entire example. But this bug exists.enableRegex can't be used with a filter, or it doesn't work at all.
typeahead is the solution, but it's not nearly as nice/neat looking.
Last edited by undeclared; Today at 8:14 AM.
Reason: Bug Template
Ext.define('GridTestPanel', {
extend: 'Ext.panel.Panel',
renderTo: "appContent",
initComponent: function() {
Ext.apply(this, {
items: [{
id: 'theGrid',
xtype: 'thegrid'
}, {
xtype: 'button',
text: 'reconfigure',
handler: function(btn) {
var comps = Ext.ComponentQuery.query('thegrid');
comps[0].doReconfigure();
}
}]
});
this.callParent(arguments);
}
});
Ext.define('TheGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.thegrid',
uses: ['Ext.data.ArrayStore'],
initComponent: function() {
Ext.apply(this, {
store: this.getTheStore(),
columns: this.getTheColumns(),
features: this.getTheFeatures()
});
this.callParent(arguments);
},
doReconfigure: function() {
var newStore = this.getTheStore();
var newColumns = this.getTheColumns();
this.reconfigure(newStore, newColumns);
this.show();
},
getTheStore: function() {
var store = new Ext.data.ArrayStore({
fields: [{
name: 'company',
type: 'string'
}, {
name: 'price',
type: 'string'
}],
data: this.getTheData()
});
return store;
},
getTheColumns: function() {
var columns = [{
text: 'Company',
dataIndex: 'company'
}, {
text: 'Price',
dataIndex: 'price'
}];
return columns;
},
getTheFeatures: function() {
var features = [{
ftype: 'grouping',
startCollapsed: false
}];
return features;
},
getTheData: function() {
var data = [
['abc1', 'def'],
['abc2', 'def'],
['abc3', 'def'],
['abc4', 'def']
];
return data;
}
});
Thank you for reporting this bug. We will make it our priority to review this report.
Using ExtJS 5.0.0 GPL.I have some small test code to reproduce the problem. It will continue to recreate a new window containing a small file input field. The second invocation will fail with error "DOM element with id button_browse-trigger-filebutton in Element cache is not the same as in the DOM. Make sure to clean up Element instances using destory()"
I do not see the point. It invokes all destroy methods (win destroy, filefield destroy etc.). Seems that there is a deep component not being destroyed from extjs.
Ext.define('TestWin', {
extend: 'Ext.window.Window',
autoShow: true,
height: 170,
width: 360,
layout: {
type: 'fit'
},
iconCls: 'xwd-icon-key',
title: "Sample",
closeAction: 'destroy',
closable: true,items: [{
xtype: 'filefield',
id: 'button_browse'
}]
});Ext.application({
name : 'Foo',
launch: function() {
var cf = function() {
Ext.Msg.alert('TestWin', 'Create Window now', function(){
win = Ext.create('TestWin');
win.on('close', cf);
});
};
cf();
}
});
Thank you for reporting this bug. We will make it our priority to review this report.
I do client and server validation.
In 4.2 I use Ext.data.Errors, add the errors and then in the form use the method markInvalid. This works great but in 5.0 Ext.data.Errors is deprecated so I search the documentation and it says to use Ext.data.Validation but when you look at form Basic for the method markInvalid http://ift.tt/1n0b73A you say you can use Ext.data.Errors.In the code you can see how you use Ext.data.ErrorCollection.
So the questions is:
Is the documentation wrong?
Is Ext.data.Errors really deprecated?
How are we supposed to use markInvalid?I know I can use the object directly, but I prefer Ext classes.
Thanks.
This code runs in a timeout after 30 seconds:
Code:
Ext.Ajax.timeout = 180000; // 3 minutes
Ext.onReady(function () {
Ext.Ajax.request({
url: 'longRunningTask',
success: function (response) {
alert('success');
},
failure: function (res, opts) {
if (res.timedout) {
alert('timeout');
} else {
alert('failure');
}
}
});
});
Code:
Ext.onReady(function () {
Ext.Ajax.request({
url: 'longRunningTask',
success: function (response) {
alert('success');
},
timeout: 180000,
failure: function (res, opts) {
if (res.timedout) {
alert('timeout');
} else {
alert('failure');
}
}
});
});
Thank you for reporting this bug. We will make it our priority to review this report.
Hi,Trying to migrate from the old UX based filters to the new plugins.
Having trouble getting date filters working.The first issue is that convertValue does not do what the function header implies.
It returns a boolean at times.My fix:
Code:
/**
* @private
* Will convert a timestamp to a Date object or vice-versa.
* @param {Date/Number} value
* @param {Boolean} [convertToDate]
* @return {Date/Number}
*/
convertValue: function (value, convertToDate) {
if (convertToDate && !Ext.isDate(value)) {
value = new Date(value);
} else if (!convertToDate && Ext.isDate(value)) {
value = (+value);
}
return value;
}
The first block was setting the value to Ext.isDate(value).
Would be surprised if this has been tested at all to be honest.The issue I am currently fighting is the fact that the dateFormat is completely ignored.
When the filter is serialised the value is set to the numeric date value, which is no use.
Hope to find a fix for that soon.Can I suggest you do some testing of these filters perhaps?
Cheers,
Westy
Believe have found another part of the puzzle.
It's probably another issue, but related so will put here.Convert needs to not convert to a number, it needs to use the dateFormat.
So:
Code:
/**
* @private
* Will convert a timestamp to a Date object or vice-versa.
* @param {Date/String} value
* @param {Boolean} [convertToDate]
* @return {Date/String}
*/
convertValue: function (value, convertToDate) {
if (convertToDate && !Ext.isDate(value)) {
value = new Date(value);
} else if (!convertToDate && Ext.isDate(value)) {
value = Ext.Date.format(value, this.dateFormat);
}
return value;
}
Cheers,
Westy
I have created a view with xtype:'employeesearchresults'.Now, i am tryng to use this view in another view which is of type employee search. if employee is available i want to display the employee details in a GRID.I am tryng to use employeeresults.js in my employeesearch.js using xtype:'employeesearchresults' am facing the following error.
Uncaught TypeError: Object [object Object] has no method 'onAdded'
employeesearch.js:
--------------------
Ext.define('a.view.main.employeesearch', {
extend: 'Ext.container.Container',
xtype: 'app-main',
controller: 'main',
id:'myview1',
requires:[
'Ext.form.FieldSet',
'Ext.grid.Panel',
'Ext.toolbar.Spacer',
'a.view.customersearchresults'
],
items:[
{
xtype:'panel',
items:[
{
xtype:'tabpanel',
items:[
{
title: 'employee Search',
items:[
{
xtype:'fieldset',
title:'employee Search',
items :[{
xtype: 'textfield',
fieldLabel:'Last Name',
id:'lastName',
labelWidth: 130
}, {
xtype: 'textfield',
fieldLabel:'First Name',
id:'firstName',
labelWidth: 130
},
{
xtype: 'textfield',
fieldLabel:'Organisation Name',
id:'organisationName',
labelWidth: 130
},
{
xtype:'button',
text:'search',
margin:'0 0 0 100',
name:'search',
action:'submit'
}]
},
{
xtype:'employeesearchresults'
}
]
},
]
}
]
}]
});
employeesearchresults.js:
---------------------------
Ext.define('a.view.customersearchresults',{
extends:'Ext.grid.Panel',
xtype:'employeesearchresults',
alias:'widget.employeesearchresults',
requires:['a.store.csstore'],
items:[{
title:'employeesearchresults',
store: Ext.data.StoreManager.lookup('mysrore'),
columns:[{
text:'Name',
dataIndex:'fullName'
}]
}]
});
Please help me to resolve this issue.
Thanks in Advance,
Nenavath
Architect version ; 3.0.4.1386
channel : 3.0.1-stable
platform: 1.3.0.803
cmd: 4.0.4.84
framework : Sencha Touch 2.3.X
Let me know if there is a setting that I may have missed.
For example I want to change my grid's loading mask to point to it's parent container, which happens to be a window. This way, whenever the store on the grid reloads, it shows the entire window as being in a load state, rather than just the grid.
Of course all of the windows are dynamically generated, so I need to way (preferably in my controller) to re-target the loading masks associated with the grids, to point to their associated windows.
Does anyone have an example of doing this? I'm been messing with viewConfig and loadMask on the grid but haven't gotten very far.
The checkbox "grid" is produced with the following Code (a label followed by three fieldsets):
Code:
},{
xtype : 'label',
cls : 'spp-title',
html : 'Species',
locales : {
html : 'main.settings.species.title'
}
},{
xtype : 'fieldset',
cls : 'spp-head',
layout : 'hbox',
items : [{
xtype : 'label',
width : '40%'
},{
xtype : 'label',
width : '20%',
html : 'Residents',
locales : {
html : 'main.settings.species.residents'
}
},{
xtype : 'label',
width : '20%',
html : 'Migrants',
locales : {
html : 'main.settings.species.migrants'
}
},{
xtype : 'label',
width : '20%',
html : 'Vagrants',
locales : {
html : 'main.settings.species.vagrants'
}
}]
},{
xtype : 'fieldset',
cls : 'spp-au',
layout : 'hbox',
items : [{
xtype : 'checkboxfield',
id : 'auresident',
value : 1,
label : 'Australian',
locales : {
label : 'main.settings.species.australia'
},
labelWidth : '66%',
width : '60%',
checked : true
},{
xtype : 'checkboxfield',
id : 'aumigrant',
value : 2,
width : '20%',
checked : true
},{
xtype : 'checkboxfield',
id : 'auvagrant',
value : 4,
width : '20%',
checked : true
}]
},{
xtype : 'fieldset',
cls : 'spp-ys',
instructions : 'Select one or more groups',
locales : {
instructions : 'main.settings.species.instructions'
},
layout : 'hbox',
items : [{
xtype : 'checkboxfield',
id : 'ysresident',
value : 8,
label : 'Yellow Sea',
locales : {
label : 'main.settings.species.yellowsea'
},
labelWidth : '66%',
width : '60%',
checked : false
},{
xtype : 'checkboxfield',
id : 'ysmigrant',
value : 16,
width : '20%',
checked : false
},{
xtype : 'checkboxfield',
id : 'ysvagrant',
value :32,
width : '20%',
checked : false
}]
},{
Code:
Ext.define('MyApp.store.Users', {
extend: 'Ext.data.Store',
id: 'UsersStore',
requires: [
'MyApp.model.Users'
],
config: {
model: 'MyApp.model.Users',
sorters: 'lastName',
proxy: {
type: 'ajax',
url: '/users.json',
extraParams: {
},
reader: {
type: 'json',
rootProperty: 'items'
}
},
autoLoad: false
}
});
Code:
Ext.create('MyApp.store.Users');
var a = Ext.getStore('UsersStore').getProxy().load({
});
Uncaught TypeError: undefined is not a function
I don't know what a reason of this problem and how I can to solve it.
Code:
me.store = Ext.create('Ext.data.Store', {
pageSize : parseInt(info.PageSize),
groupField: info.GroupBy,
fields: storeFields,
idProperty: 'Id',
noCache: true,
proxy : {
type: 'ajax',
url: info.Url,
reader: {
type: 'json',
root: 'Rows',
totalProperty: 'totalCount'
}
}
});
Code:
me.store.on('load', function (sender, recs, opt) { if (component.loadStore != undefined) {
component.loadStore(sender, recs, opt);
}
}, component);
what can i do
I have a requirement to localise a number of UI components in a different language other than English.
I was wondering if there is an easy way to implement the ternary operator in order to determine which text should be shown the user based on a variable that I use to store the users choice of language.
For example
Code:
//Config
title: this.selectedLanguage() == 'English' ? 'ENGLISH_TITLE' : 'OTHER_LANGUAGE_TITLE';
I have also looked at UX.localeManager but this seems like a lot of overhead?
Thank you for reporting this bug. We will make it our priority to review this report.
Description of mixin "@mixin extjs-text-field-ui" is outdated (some vars were renamed).Please refresh it.
Thank you!
Code:
Ext.define('ServcSol.Application', {
extend: 'Ext.app.Application',
name: 'ServcSol',
requires:[
'ServcSol.DirectAPI',
'Ext.form.action.DirectSubmit'
],
views: [
'manyviewshere' ],
controllers: [
'manycontrollershere' ],
stores: [
'manystoreshere' ],
launch: function () {
var win = Ext.create('Ext.window.Window', {
closable : false,
resizable : false,
draggable : false,
border : false,
title: 'Service Solutions',
titleAlign: 'left',
height: 800,
width: 1000,
api: {
submit: 'ExtRemote.DXLogin.authenticate'
},
paramOrder: ['username', 'pwd'],
layout: {
type: 'vbox',
align: 'center',
pack: 'center'
},
items: [
{
xtype: 'form',
title: 'Login',
itemId: 'login',
height: 300,
width: 300,
frame: true,
layout: {
type: 'vbox',
align: 'center'
},
items:[
{
xtype: 'textfield',
margin: '30 0 0 0',
itemId: 'username',
fieldLabel: 'User Name',
allowBlank: false,
name: 'username',
emptyText: 'Username',
width: 225,
labelWidth: 100
},
{
xtype: 'textfield',
margin: '10 0 0 0',
inputType: 'password',
fieldLabel: 'Password',
allowBlank: false,
name: 'pwd',
emptyText: 'Password',
width: 225,
labelWidth: 100
},
{
xtype: 'button',
text: 'Login',
margin: '20 0 0 0',
itemId: 'loginBtn',
width : 80,
formBind: true,
handler: function(){
var loginFrm = Ext.ComponentQuery.query('#login')[0];
loginFrm.getForm().submit({
success: function(form, action)
{
Ext.create('ServcSol.view.Viewport');
win.destroy();
},
failure: function(form, action)
{
console.log('Login Failed');
}
});
}
}
]}
]
})
win.show();
}
});
So I have a carousel component with a number of cards in it, I want to be able to display some text in each card based on data that is stored in a global variable.
As I understand it the correct way to populate a card is to use the .html function e.g.
Code:
{ html: 'Content 2'
style: 'background:#333'
}
Code:
AccessAber.app.getSelectedRoute().route_name_en
This is the approach that I would assume would work but it does not, it gives the error about the variable being null, which as mentioned above it should be at this point until the view is rendered.
Code:
"<h2>routename: " + AccessAber.app.getSelectedRoute().route_name_en + "</h2>"
Thanks
Jonathan
Thank you for reporting this bug. We will make it our priority to review this report.
I have a complex form (with about 40 fields nested in some fieldsets components). I try to bind the form to a record through this line :Code:
me.viewModel.setData({ Model: record });
At first I thought the problem source is because of large fields and nesting conditions. So I flattened all the fields and now of them fields are direct children of FormPanel but nothing is changed.After investing few hours, I found the problem accidentally. I have this config in FormPanel :
Code:
fieldDefaults: {
labelWidth: 90,
anchor: '100%',
msgTarget: 'side'
},
after just removing msgTarget: 'side' config, all the thing are great and speedy!! so nesting and large fields count was not the problem.
model:
Ext.define('SH_UDC.model.GSingleSearch.GSingleModel', {
extend: 'Ext.data.Model',
fields: [
{
name: 'id'
},
{
name: 'name'
},
{
name: 'value'
}
]
});
store:
Ext.define('SH_UDC.store.GSingleSearch.GSingleStore', {
extend: 'Ext.data.TreeStore',
storeId:'GsingleStore',
requires: [
'SH_UDC.model.GSingleSearch.GSingleModel'
],
model: 'SH_UDC.model.GSingleSearch.GSingleModel',
autoLoad: false,
proxy: {
type: 'ajax',
url: Urls.GSearch,
reader: {
type: 'json',
root: 'data'
}
}
});
view:
singlelist.js
Ext.define('SH_UDC.view.GSingleSearch.SingleList', {
extend: 'Ext.tree.Panel',
alias:'widget.singlelist',
id: 'ae',
height: 250,
width: 400,
columnLines: true,
rowLines: true,
store:'GSingleSearch.GSingleStore',
rootVisible: false,
initComponent: function() {
var me = this;
Ext.applyIf(me, {
viewConfig: {
},
columns: [
{
xtype: 'treecolumn',
dataIndex: 'name',
text: 'Name',
flex: 1,
renderer: function(value) {
if(translations[value]){
return translations[value];
}else{
return value;
}
},
},
{
xtype: 'gridcolumn',
dataIndex: 'value',
text: 'Value',
flex: 1,
},
{
xtype: 'gridcolumn',
dataIndex: 'value',
text: '中文解释',
flex: 3,
renderer: function(value) {
if(translations[value]){
return translations[value];
}else{
return value;
}
},
}
]
});
me.callParent(arguments);
}
});
GsingleView.js
Ext.define('SH_UDC.view.GSingleSearch.GSingleView', {
extend: 'Ext.form.Panel',
alias: 'widget.individualuser',
requires:[
'SH_UDC.view.GSingleSearch.SingleList',
],
layout: {
type: 'fit'
},
initComponent: function() {
var me = this;
Ext.applyIf(me, {
dockedItems: [
{
xtype: 'toolbar',
dock: 'top',
items: [
{
xtype: 'combobox',
fieldLabel: 'UDC',
store:UdcStore,
fieldLabel: 'UDC',
labelAlign: 'right',
labelWidth: 50,
mode:'local',
selectOnFocus:true,
triggerAction:"all",
displayField:"set_name",//
valueField:"id",//实
labelWidth: 50
},
{
xtype: 'textfield',
itemId:'msisdnnum',
width: 200,
hideLabel: true,
inputType: 'tel',
labelWidth: 150
},
{
xtype: 'button',
width: 100,
text: 'Search',
itemId:'searchbutton'
}
]
}
],
items: [
{
xtype: 'singlelist'
}
]
});
me.callParent(arguments);
}
});
controller:
Ext.define('SH_UDC.controller.GSingleSearch.GSingleController', {
extend: 'Ext.app.Controller',
requires: [
'SH_UDC.util.Util',
],
views: [
'GSingleSearch.GSingleView',
'GSingleSearch.SingleList'
],
stores:[
'GSingleSearch.GSingleStore'
],
refs: [
{
ref: 'singleList',
selector: 'singlelist'
},
],
init: function(application) {
this.control({
"individualuser singlelist": {
render: this.onRender
},
"individualuser button#searchbutton": {
click: this.onButtonClicksearch
},
});
},
onRender: function(component, options) {
},
onButtonClicksearch:function(button,e,options){
var toolbar = button.up('toolbar'),
udcid = toolbar.down('combo').getValue(),//udc id
cell = toolbar.down('textfield[itemId=msisdnnum]').getValue();//Input Number
var Tree = this.getSingleList().getStore();
if(udcid!=null&&cell.length>4&&cell.length<15){
Ext.Ajax.request({
url: Urls.GSearch,
method: 'post',
headers:{'Content-Type':'application/json;charset=utf-8'},
jsonData:{"nodeId": udcid,"cell": cell},
success: function(conn, response, options, eOpts) {
//Ext.get(login.getEl()).unmask();
var result = SH_UDC.util.Util.decodeJSON(conn.responseText);
var ec = result.data;
if (result.success) {
Tree.load(ec);
} else {
SH_UDC.util.Util.showErrorMsg(conn.responseText);
}
},
failure: function(conn, response, options, eOpts) {
SH_UDC.util.Util.showErrorMsg(conn.responseText);
}
});
}
}
});
But the response has two, one come from controller, and the other from TreeStore. And the awful thing is the ajax request from controller cannot update the treestore or treegrid, but the store's request works. It can not give the write response! I want to get the response after I give the request with some conditions.
Catch.jpg
In controller, I don't know how to program that I can update the tree grid by ajax response. Pls Help!!!!
Some initialization of div tags on main.jsp
....
...
---------------end common js -------
------------------main js -------
div elements...
---------------end main js ---------
We need to introduce content in tag from AJAX calls
So now
-------------------common js --------
Ext.onReady(function(){
Some initialization of div tags on main.jsp
....
...
---------------end common js -------
------------------main js -------
Ext.onReady(function(){
AJAX calls to extract div elements from backend...
div elements.html = data retrieved
---------------end main js ---------
But by the time div receive data from AJAX, the common.js has already run and div elements do not get massaged by the code in common js. Is there anyway to avoid this? I cannot remove common js out of the main.jsp due to design constraints. Pl help
What is the recommended js workflow engine that seamlessly works with extjs 4.2.x?
I hope the solution is lightweight, not so verbous, and can work as a simple 'wrapper' for functions before, during and after any CRUD activity.
I'm using the Controller of the MVC of SA3 to make a 'workflow-engine-like' approach for now...
I'm looking something close to Dataflo (http://ift.tt/1q4fVJ8).
Thank you for reporting this bug. We will make it our priority to review this report.
Model's date send the date as seconds after 1 Jan 1970 while filter date is send as milliseconds.I think that should be consistent and bot should send seconds or ms.
Regards.
UI: Sencha Architect 3.x / ExtJS 4 MVC
Server side: EJB 3.1 / CDI / JPA 2 / JAX-RS / JasperReports
Application Server: Glassfish 3.1.x
Databases: Oracle 10g & 11g / DB2 9 & 10 / Firebird 2.5If you like my answer please vote!
Thank you for reporting this bug. We will make it our priority to review this report.
5.0.1 release date?I have found some bugs which may be already fixed but I don't like the idea on using nighty builds.
Regards.
UI: Sencha Architect 3.x / ExtJS 4 MVC
Server side: EJB 3.1 / CDI / JPA 2 / JAX-RS / JasperReports
Application Server: Glassfish 3.1.x
Databases: Oracle 10g & 11g / DB2 9 & 10 / Firebird 2.5If you like my answer please vote!
Here's an example, a package called "customcss"
The package.json of it:
Code:
{
"name": "customcss",
"type": "code",
"creator": "anonymous",
"summary": "Short summary",
"detailedDescription": "Long description of package",
"version": "1.0.0",
"compatVersion": "1.0.0",
"format": "1",
"local": true,
"requires": [],
"css": [{"path":"resources/css/custom.css","type":"css"}]
}
Am I right in thinking this is what it should do ?
I run: sencha app build production
I try to create a fork of Extjs 4.2.1 that can be build using node.js, compass, and jsduck.
You can pull it from here: http://ift.tt/1xr6fN0.
The Gruntfile is a little bit messy, I'm new on using this tools, so pardon me.
Any enhancement to build process or pull request all welcome.
Sincerely yours,
Mhd Sulhan
- IIS 7
- ASP.NET with Ajax
- ExtJs
There we noticed the following problem creating the viewport. Which certainly is not limited to this.
Error:
„Uncaught ReferenceError: format is not defined“
1.PNG
Callstack:
2.PNG
The problem only occurs in an ASP.Net Ajax environment. We have also identified the origin and have a solution.
Origin:
The new method getResponsiveState in our case provides rules = 0. This is correct since no responsiveConfig was set.
3.PNG
Unfortunately, a „number format []“ handler is defined in ASP.NET Ajax library:
This provides for our case:
5.PNG
Unfortunately, we did not know that such a thing is possible and we have been looking for hours. The solution for us was very simple. Perhaps this change can also be integrated directly into ExtJs 5:
Code:
getResponsiveState: function () {
var rules = this.getResponsiveConfig(),
stateArgs = Responsive.stateArgs,
ret = {},
entry, rule;
if(!rules) { return ret; }
for (rule in rules) {
entry = rules[rule];
if (!entry.fn) {
entry.fn = new Function(Responsive.argNames, 'return ' + rule);
}
if (entry.fn.apply(this, stateArgs)) {
Ext.merge(ret, entry.config);
}
}
return ret;
},
at now i'm using sth like this :
Code:
var uploadButton = Ext.create('Ext.Button', {
ui: 'primary-small',
style: 'margin-left:120px;',
handler: function () {
if (form.isValid()) {
//if(form.)
form.submit({
url: '',
method: 'POST',
success: function (form, response) {
debugger;
console.log(response);
if (!Ext.isEmpty(response) && !Ext.isEmpty(response.response.responseText)) {
var result = Ext.decode(response.response.responseText);
debugger;
result.files.forEach(function (file) {
console.log(file.name);
debugger;
if (file.name != null && file.name != '') {
me.filesStore.add({
fileName: file.name,
fileId: file.id
});
}
});
}
},
failure: function (form, response) {
debugger;
...
}
})
}
}
});
var form = Ext.create('Ext.form.Panel', { flex: 1,
layout: {
type: 'hbox',
align: 'stretch'},
items: [
{
xtype: 'filefield',
name: 'file',
//buttonOnly: true,
isFileUpload:true,
allowBlank: false,
buttonConfig: {
ui: 'primary-small'
},
msgTarget: 'under',
listeners: {
change: function (fld, value) {
var newValue = value.replace(/C:\\fakepath\\/g, '');
fld.setRawValue(newValue);
},
afterrender: function (cmp) {
cmp.fileInputEl.set({
multiple: 'multiple'
});
}
}
},
uploadButton
]
});
Thanks
Please note the anchor property in below code .
var banner = Ext.create('Ext.Panel', {
region: 'north',
html: 'test UI',
bodyStyle:'background:blue',
anchor: '0 -20'
});
If I add just one space anchor: '0 -20' , achor layout fails to function . This is a really difficult error to find .
It will be a great feature if anchor can handle whitespaces.
Thanks !
I was looking forward to start using Ext js 5.0.0 calendar for one of my projects & willing to buy a licence but then I'm sad to see its not touch compatible. vertical scroll doesn't work. I can only make appointments at night.
to bad.
I've got a login form that should allow server redirection after a successful login, but this is not happening. I've already checked the response from server and it does contain the redirect address on the headers, but it is not been followed through.
Also, why adding the standardSubmit config to true makes the form submit to a .js url which obviously fails with a 404?
My form code is pretty simple:
Code:
form.submit({
url: '/auth/',
method: 'POST',
params: data,
standardSubmit: true // <-- makes form submit to a .js url which fails with a 404
});
index.html:
HTML Code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<!-- Ext CSS -->
<link rel="stylesheet" href="build/production/TEST/resources/ext-all.css">
<!-- APP CSS -->
<link rel="stylesheet" href="build/production/TEST/resources/app-all.css">
<!-- Ext JS -->
<script src="build/production/TEST/ext-all.js"></script>
<!-- APP JS -->
<script src="build/production/TEST/app-all.js"></script>
</head>
<body></body>
</html>
Code:
Ext.application({
requires: ['Ext.container.Viewport', 'Ext.window.MessageBox'],
name: 'TEST',
appFolder: 'app',
controllers: [
'Menu',
'Users',
'Header'
],
views: [
'Top',
'Left',
'Bottom',
'Main'
],
launch: function() {
Ext.get('loading').hide();
Ext.get('loading-mask').setOpacity(0, true);
Ext.create('Ext.container.Viewport', {
layout: 'border',
items: [
{xtype: 'Top'},
{xtype: 'Left'},
{xtype: 'Main'},
{xtype: 'Bottom'}
]
});
setTimeout(function() {
Ext.get('loading-mask').hide();
}, 100);
}
});
Code:
Ext.define('MyCompany.controller.CustomerAccountController', {
extend: 'Ext.app.Controller',
views: ['CustomersView'],
stores: ['CustomerAccounts'],
models : ['AppState', 'CustomerAccount'],
config: {
selectedCustomer: ''
},
refs: [{
ref: 'customersView',
selector: 'customersview'
}, {
ref: 'customersFilter',
selector: 'customersview textfield[name=filter]'
}, {
ref: 'customersList',
selector: 'customersview grid[name=customerslist]'
}
....
....
setSelectedCustomer: function() {
var customerList = this.getCustomersList(); //Throws undefined function exception
......
},
Thanks in advance,
Kishore
I saw a bunch of examples showing how to add the possibility to filter records in a grid, but not exactly what I'm looking for. These examples allow the user to do it themselves, but I'd rather have it set arbitrarily.
Say, I have two grids using the same store.
One grid should show the record of the store whose value (enabled) is 1, and the other grid should show the records of the same store whose "enabled" field is 0.
Is this possible ? Using 4.2.1
Thank you for reporting this bug. We will make it our priority to review this report.
For some reason, the tooltip layout for certain text lengths is not expanding enough to fit the text. The text winds up wrapping, but the tip's height is calculated before the text was wrapped, so it is cut off from the visible area. This only happens in IE9 (tested IE10 and Chrome also)Fiddle: http://ift.tt/1s4nz7G
In the fiddle, some tips are shown in full, some are cut off.
Thank you for reporting this bug. We will make it our priority to review this report.
Problem: When building a very simple dashboard part, buttons inside the viewTemplate and tools attached to the portlet title do not seem to work.Ext Version: 5.0.0
Browsers: Chrome & Firefox
Fiddle:
http://ift.tt/1xmXweSExpected Result:
Code in handler functions fires for both tools & buttons inside a Part.Actual Result:
Handler functions do not fire.
I created a Window containing a container that can be resized, in Ext 4.2 both the window and container could be resized.
In Ext 5 the same example lets you either have a resizer on the window or the Container.
Link to fiddle: http://ift.tt/1jNt1Xg
Are there any new configurations that have to be set to get the same result in Next 5 ?
Thanks in advance.
Code:
Ext.create('Ext.tab.Panel', {
items: [
{
xtype : 'panel',
items : [
{
xtype: 'panel',
layout : 'border' // error
}
]
}
],
renderTo: Ext.getBody()
});
h
Thank you for reporting this bug. We will make it our priority to review this report.
- Go to http://ift.tt/1iZMBov
- activate "Donut"
- deactive every month but oneResult: a pie
Expected: a donutIn fact, it only looks like a pie. If you hover the center, the pie swings back like it is not hovered, i.e. it still acts like a pie.
Ext.Ajax.request({
callback: function(options, success, response) {
// callback logic
},
scope: this
Please suggest something.
I heard that Firefox don't possess a web-kit engine and it is a required of sencha touch.
Can anyone help to clarify this info ? is it correct and can sencha touch app runs on firefox or other browser which is using Gecko as the core engine ?
Thanks in advance
Thank you for reporting this bug. We will make it our priority to review this report.
In a grid panel I need the column header to be of 36px. So instead of giving the columns configuration as an array of columns I gave following in the grid configuration as
{
columns:{
height: 36,
items: [
......
]
}
}
Then when I try to resize the columns by pulling the splitter only the header resizes whereas the grid columns remain the same.Please find the filddle at http://ift.tt/1vA4NVW
Thanks