PDA

View Full Version : me.focus undefined



easports
24 Aug 2009, 9:11 AM
Hi, I'm try to winnow a problem I'm having with Ext.Windows down and could use some advice. I've got some simple (working) code which creates a window on click:


Ext.namespace("SAM");
SAM.contextWindow = {};

function doOnload() {
SAM.contextWindow = new Ext.Window({
title: "Context Window",
width: 200,
autoScroll:true,
closeAction: 'hide',
html:"Context Window Stuff",
});
}

SAM.contextClickHandler = function(x) {
console.log(x.button,x)
SAM.contextWindow.setPosition(x.clientX, x.clientY);
SAM.contextWindow.show();
}

document.addEventListener("click", SAM.contextClickHandler, false);


However in my actual application, identical window/click handling code code gives a firebug error "me.focus is undefined" in ext-all-debug.js at line 2521 after the window is shown. I've been commenting more and more of the application out but have not been able to narrow down what's conflicting. Do I need to somehow explicitly set a focus? What else should I be looking for?

Animal
24 Aug 2009, 9:33 AM
Set Firebug to "Break on all errors" and find out what's happening.

easports
24 Aug 2009, 9:51 AM
Break on all errors is on. FWIW, I have only delay(), then focus() on the stack.

Animal
24 Aug 2009, 9:53 AM
So, what is me?

easports
24 Aug 2009, 10:05 AM
From ext-all-debug.js:


2517 focus : function(defer) {
2518 var me = this;
2519 try{
2520 if(!isNaN(defer)){
2521 me.focus.defer(defer, me); // fails here

2522 }else{
2523 me.dom.focus();
2524 }
2525 }catch(e){}
2526 return me;
2527 },

Animal
24 Aug 2009, 10:07 AM
So when you poke the "me" reference, what is it? you can find out what it is. I'm guessing it's the browser window.

easports
24 Aug 2009, 10:24 AM
Err, sorry I misunderstood. So I'm not sure exactly how to find that out. If I look at 'me' in the 'Watch' tab, there are functions for 'prototype' , argumentNames, bind, bindAsEventListener, createCallback, createDelegate, createInterceptor, createSequence, curry, defer, delay, methodize, wrap, but I don't see anything specific to indicate what it is. As near as I can tell it's an element as the the 'me' in the focus method aliases the 'this' of the Ext.Element prototype.

Animal
24 Aug 2009, 1:30 PM
From what you describe it like "me" is a function somehow doesn't it? With the prototype containing Function methods?

It's not the code you posted that has a problem. You have a problem somewhere in your code.

E_lexy
28 Oct 2009, 2:37 AM
has anyone found the problem?

I also have a form which functions well in one page and generates the me.focus error as above. Also Submit and the quicktips don't work.

I'm using the symfony PHP framework and the atolExt3WidgetPlugin.

both pages include the same JS files. just the page structure differs.


/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
var win;
var fs;

// standard popup window used for
// discussions, actions,

if(!win){
var win = new Ext.Window({
id : 'popup',
layout : 'fit',
width : 500,
height : 300,
autoScroll : true,
closeAction :'hide',
plain : true,
items : fs,
modal : true,
addFromXHR: function(url, params) {
Ext.Ajax.request({
url: url,
params: params,
success: function(response) {
// remove old content
this.win.removeAll();
// add new content from Json
this.win.add(eval("(" + response.responseText + ")"));
// apply the content
this.win.doLayout();
}
});
}
});



}

Ext.onReady(function(){
//Ext.QuickTips.init();

win.render(Ext.getBody());
})

/* show window and wrap it around the url supplied
*/
function showWindow(
formUrl,
windowTitle,
updateZone)
{
win.setTitle(windowTitle);
win.addFromXHR(formUrl);
win.on('add', function() {
win.show();
})
}

Ext.namespace('Ext.ux');

Ext.ux.SubmitButton = Ext.extend(Ext.Button, {
formBind: true,
parentType: 'form',
waitMsg : WAIT_TEXT,
waitTitle : WAIT_TITLE,
success: function() { //if success
if(updateZone) updateIdeaZone(updateZone, $('idea_id'), updateUrl)
win.hide();
},

actionfailed: function(form,action){
//alert('actionfailed');
handleExtResponse(action);
},

initComponent: function(){
Ext.ux.SubmitButton.superclass.initComponent.call(this);
this.handler = this.submit;
},

submit: function() {
var form = this.getForm();
if (form != null) {
if (this.url == null) {
form.body.dom.action = form.url;
} else {
form.body.dom.action = this.url;
}
form.getForm().submit();
// this.getForm().doAction('submit');
}
},

getForm: function() {
if (this.idForm != null)
return Ext.getCmp(this.idForm);

return this.findParentByType(this.parentType);
}
});

Ext.reg('kzsubmitbutton', Ext.ux.SubmitButton);

Ext.ux.CloseButton = Ext.extend(Ext.Button, {
text : 'Sluiten',
handler : function(){
win.hide();
}
});

Ext.reg('kzclosebutton', Ext.ux.CloseButton);


function handleExtResponse(action)
{
// this is a status 500 header we set in the actionhelper::ajaxResponse
var result = Ext.decode(action.response.responseText);
if(result && result.error) {
jsonResp = Ext.util.JSON.decode(action.response.responseText);
// if there is error content
if (jsonResp.error) {
Ext.each(jsonResp.error, function(error) {
//update all error divs accorind to the message
Element.update('error-' + error.field, error.msg);
});
}
}
}]

E_lexy
28 Oct 2009, 4:49 AM
I have the same problem and was wondering if there is a solution for the me.focus issue.

The window I have loads Xtype config through XHR and works fine in a test page with all real page's css and js included, but fails in the actual real page. I can't seem to find why.
Me.focus doesn't bother mee too much in itself but also the submit and the quicktips don't work in the real page, whereas the do in the test page.

I use Sympfone PHP framework with the AtolExt3WidgetPlugin (Extjs3). Symfony includes Prototype and scriptaculous.

shouldn't matter, but here is the code:

/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
var win;
var fs;

// standard popup window used for
// discussions, actions,

if(!win){
var win = new Ext.Window({
id : 'popup',
layout : 'fit',
width : 500,
height : 300,
autoScroll : true,
closeAction :'hide',
plain : true,
items : fs,
modal : true,
addFromXHR: function(url, params) {
Ext.Ajax.request({
url: url,
params: params,
success: function(response) {
// remove old content
win.removeAll();
// add new content from Json
win.add(eval("(" + response.responseText + ")"));
// apply the content
win.doLayout();
}
});
}
});



}

Ext.onReady(function(){
//Ext.QuickTips.init();

win.render(Ext.getBody());
})

/* show window and wrap it around the url supplied
*/
function showWindow(
formUrl,
windowTitle,
updateZone)
{
win.setTitle(windowTitle);
win.addFromXHR(formUrl);
win.on('add', function() {
win.show();
})
}

Ext.namespace('Ext.ux');

Ext.ux.SubmitButton = Ext.extend(Ext.Button, {
formBind: true,
parentType: 'form',
waitMsg : WAIT_TEXT,
waitTitle : WAIT_TITLE,
success: function() { //if success
if(updateZone) updateIdeaZone(updateZone, $('idea_id'), updateUrl)
win.hide();
},

actionfailed: function(form,action){
//alert('actionfailed');
handleExtResponse(action);
},

initComponent: function(){
Ext.ux.SubmitButton.superclass.initComponent.call(this);
this.handler = this.submit;
},

submit: function() {
var form = this.getForm();
if (form != null) {
if (this.url == null) {
form.body.dom.action = form.url;
} else {
form.body.dom.action = this.url;
}
form.getForm().submit();
// this.getForm().doAction('submit');
}
},

getForm: function() {
if (this.idForm != null)
return Ext.getCmp(this.idForm);

return this.findParentByType(this.parentType);
}
});

Ext.reg('kzsubmitbutton', Ext.ux.SubmitButton);

Ext.ux.CloseButton = Ext.extend(Ext.Button, {
text : 'Sluiten',
handler : function(){
win.hide();
}
});

Ext.reg('kzclosebutton', Ext.ux.CloseButton);


function handleExtResponse(action)
{
// this is a status 500 header we set in the actionhelper::ajaxResponse
var result = Ext.decode(action.response.responseText);
if(result && result.error) {
jsonResp = Ext.util.JSON.decode(action.response.responseText);
// if there is error content
if (jsonResp.error) {
Ext.each(jsonResp.error, function(error) {
//update all error divs accorind to the message
Element.update('error-' + error.field, error.msg);
});
}
}
}

E_lexy
28 Oct 2009, 7:21 AM
Since I am using the symfony framework prototype gets automatically included when I use certain javascript generating functions.

This did not hapen in the 'test' page but did happen in the 'real' page.

I then changed the inclusion of ext-base.js to ext-prototype-adapter.js and now all is fine.

I got on the trail of this because I saw that when stepping through the code it was using prototype functions instead of Ext....