Javascript error while moving DialogBox

[moshe]

I get the following error while moving a DialogBox, It works fine, but I get +- 1 error for every pixel that the dialog moves.

r has no properties -- ext-all-debug.js (line 8711)
- if(r.contains(pt) && el.isScrollable()){ -


function onItemClick(item) {
// item is a MenuItem, item.id is a name of hidden div
var dlg = Ext.DialogManager.get(item.id);

if (!dlg)
dlg = FormDialog(item.id);


dlg.show(item.el);
}


function FormDialog (element,config) {
var dialog;
if (config) {
dialog = new Ext.BasicDialog(element, config);
} else {
dialog = new Ext.BasicDialog(element, {
width:500,
height:300,
shadow:true,
minWidth:300,
minHeight:300
});
}

dialog.addKeyListener(27, cancel, dialog);
dialog.addButton('Close', cancel, dialog);
dialog.addButton('Submit', submit, dialog);

function submit() {
var btn = Ext.DomQuery.selectNode("button[name='submit'], a[name='submit'], input[name='submit']", element);
console.log("submit entered with" + btn);
if (btn)
btn.click();
}

function cancel() {
var btn = Ext.DomQuery.selectNode("button[name='cancel'], a[name='cancel'], input[name='cancel']", element);
if (btn)
btn.click();
else
dialog.hode();

}
return dialog;
}

[pragma]

Hi there. I was having the same problem, so I devised a crude patch. Firebug was telling me that the problem was on line 8711 of ext-all-debug.js.

This is the onFire() method of Ext.dd.ScrollManager:



if(r.contains(pt) && el.isScrollable()){


I changed it to check if r was valid before attempting to manipulate it:



if(r && r.contains(pt) && el.isScrollable()){


It made the problem go away on my setup, but I have no clue if this is valid for the behavior of ScrollManager or not. Use at your own risk. ;)

[rajneesh103]

Hi,

Great Work .......I had the similar issues with extjs scrollManager when using with Modal Dialog.... The problem has been solved........ But I want to extend it so as not to change existing API.

Can anyone help me how we can extend ScrollManager for Modal Dialog?

I tried with the following with the above fix:


Ext.extend(Ext.dd.EditScrollManager, Ext.dd.ScrollManager,
{
var onFire = function(e, isDrop){
if(isDrop || !ddm.dragCurrent){ return; }
var dds = Ext.dd.ScrollManager;
if(!dragEl || dragEl != ddm.dragCurrent){
dragEl = ddm.dragCurrent;
// refresh regions on drag start
dds.refreshCache();
}

var xy = Ext.lib.Event.getXY(e);
var pt = new Ext.lib.Point(xy[0], xy[1]);
for(var id in els){
var el = els[id], r = el._region;
if(r && r.contains(pt) && el.isScrollable()){
if(r.bottom - pt.y <= dds.thresh){
if(proc.el != el){
startProc(el, "down");
}
return;
}else if(r.right - pt.x <= dds.thresh){
if(proc.el != el){
startProc(el, "left");
}
return;
}else if(pt.y - r.top <= dds.thresh){
if(proc.el != el){
startProc(el, "up");
}
return;
}else if(pt.x - r.left <= dds.thresh){
if(proc.el != el){
startProc(el, "right");
}
return;
}
}
}
clearProc();
};
ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);

}
);


But i don't know how to use it to make it work with modal Dialog.