PDA

View Full Version : [CLOSED] InputTextMask Change Mask Dynamically



softmachine2011
Jul 24, 2012, 12:51 PM
Hi,

Related with this thread: http://forums.ext.net/showthread.php?13752

It seems that I've to do some changes to use it in v2.1 now.
Because, changeMask method throws an exception inside


element.purgeAllListeners();


Exception
Runtime Error in Microsoft JScript: Can not get value of property 'length': the object is null or undefined

Code that throws exception

purgeElement : function(element, eventName) {
var dom = Ext.getDom(element),
i = 0, len;

if (eventName) {
EventManager.removeListener(element, eventName);
}
else {
EventManager.removeAll(element);
}

if (dom && dom.childNodes) {
for (len = element.childNodes.length; i < len; i++) { //Here appears the error
EventManager.purgeElement(element.childNodes[i], eventName);
}
}
},

Vladimir
Jul 24, 2012, 1:02 PM
Hi,

Ext.Net 2.1 has InputMask plugin. Please use it instead obsolete Ext.Net.UX.InputTextMask
You can find sample in Examples Explorer
branches\2.1\Ext.Net.Examples\Examples\Form\TextFi eld\InputMask\Default.aspx

softmachine2011
Jul 24, 2012, 1:50 PM

Daniil
Jul 24, 2012, 9:01 PM
Hi,

Should not you use the "dom" instead "element" within the following "if" statement?


if (dom && dom.childNodes) {
for (len = element.childNodes.length; i < len; i++) { //Here appears the error
EventManager.purgeElement(element.childNodes[i], eventName);
}
}

softmachine2011
Jul 25, 2012, 6:42 AM
This function is internally called inside purgeAllListeners method of extjs.

It could be a bug...

Daniil
Jul 25, 2012, 9:14 AM
Apologize, I thought it's your code.

Yes, agree, it is a bug. I have reported to Sencha.
http://www.sencha.com/forum/showthread.php?232530

Please use the following fix for now.

Fix

<script type="text/javascript">
Ext.EventManager.purgeElement = function(element, eventName) {
var dom = Ext.getDom(element),
i = 0, len;

if (eventName) {
Ext.EventManager.removeListener(element, eventName);
}
else {
Ext.EventManager.removeAll(element);
}

if (dom && dom.childNodes) {
for (len = dom.childNodes.length; i < len; i++) {
Ext.EventManager.purgeElement(dom.childNodes[i], eventName);
}
}
}
</script>

softmachine2011
Jul 25, 2012, 1:51 PM
Do you know when is planned an integred next ExtJS version with this bug an others?

And taking advantage, is there any roadmap of Ext.NET v2.1

Thanks!

Daniil
Jul 25, 2012, 2:23 PM
Do you know when is planned an integred next ExtJS version with this bug an others?

Well, very soon from the moment when they will be fixed on ExtJS side.

If it takes too much time, we will incorporate the fix (if exists) ourselves.



And taking advantage, is there any roadmap of Ext.NET v2.1


I will redirect the question to our manager.

geoffrey.mcgill
Jul 25, 2012, 4:44 PM
And taking advantage, is there any roadmap of Ext.NET v2.1

I added the following note on the Download (http://ext.net/download/) page.


Next Release?

The next public release of Ext.NET Pro (version 2.1) is scheduled for mid-August 2012. The focus of the release will be on enhanced ASP.NET MVC support. A Preview of Ext.NET 2.1 is available to all Premium Support subscription members.

Hope this helps.

softmachine2011
Jul 26, 2012, 7:12 AM
Ok, thanks for all

softmachine2011
Aug 29, 2012, 8:26 AM
I see that this bug is fixed by extjs but applied in version 4.1.

When we report the bug, we are in 4.1.0 or 4.1.1 I don't remind it.

The question is, this bug is fixed in current Ext.NET 2.1 ?

Daniil
Aug 29, 2012, 10:10 AM
I can't see the EXTJSIV-6713 fix in the 4.1.1 release notes. Probably, it will be included in 4.1.2.

The current Ext.NET v2.1 uses ExtJS 4.1.1. So, the answer is: no, it is not fixed in Ext.NET v2.1 yet.

softmachine2011
Aug 29, 2012, 12:33 PM
Ok, I will wait for new ExtJS version

softmachine2011
Sep 21, 2012, 7:31 AM

Daniil
Sep 21, 2012, 10:49 AM
Probably, an old mask or/and some events listeners are not removed correctly within the changeMask function.

I would debug the changeMask function step by step. Maybe, you will discover a problem.

softmachine2011
Sep 25, 2012, 7:14 AM
Did you found anything strange debugging step by step?

Daniil
Sep 25, 2012, 12:08 PM
I discovered two issues.

1. You don't detach the focus and blur listeners which are set within the init function:


field.on('blur', this.removeValueWhenInvalid, this);
field.on('focus', this.processMaskFocus, this);

It needs to detach them withing the changeMask function.


field.un('blur', maskPlugin.removeValueWhenInvalid, maskPlugin);
field.un('focus', maskPlugin.processMaskFocus, maskPlugin);

2. A bigger problem is the fact that this trick doesn't work well anymore.

element.purgeAllListeners();
field.initEvents();

I call it "trick" because the initEvents is not an API method. Though, possibly, there is a design issue. I reported it as a possible bug to Sencha.
http://www.sencha.com/forum/showthread.php?243820

Though, I think, they will be totally right to do not consider it a bug, because, again the initEvents is not an API method, it is protected.

But, maybe, they will, at least, suggest something.

Anyway, there is a 100% working solution - detach all attached listeners step-by-step.

softmachine2011
Sep 25, 2012, 2:07 PM
Hi it seems that with the code proposed by evant the plugin works...



field.inputEl.purgeAllListeners();
delete field.focusListenerAdded;
field.initEvents();


Is this correct right? Or you would tell me a better solution because this one isn't good?

Daniil
Sep 25, 2012, 2:31 PM
Yes, I also tested, it works well now.

I think it is a good solution since it works well:) Though, I asked Evan the same. Maybe, he will answer something

By the way, do not forget to detach focus and blur listeners.

softmachine2011
Sep 25, 2012, 2:50 PM
Ok, I detached.

Is correct in this point to detach or I have to do it later?



changeMask: function (newMask, newClearWhenInvalid) {
var maskPlugin = this;
var field = maskPlugin.field;

var element = field.inputEl;

field.un('blur', maskPlugin.removeValueWhenInvalid, maskPlugin);
field.un('focus', maskPlugin.processMaskFocus, maskPlugin);

if (element) {
element.purgeAllListeners();
delete field.focusListenerAdded;
field.initEvents();
}

if (Ext.isArray(field.plugins))
field.plugins.pop(maskPlugin);
else
field.plugins = null;

maskPlugin = new Ext.ux.netbox.InputTextMask({ mask: newMask, clearWhenInvalid: newClearWhenInvalid });

this.viewMask = maskPlugin.viewMask;
this.rawMask = maskPlugin.rawMask;
this.maskArray = maskPlugin.maskArray;

if (Ext.isArray(field.plugins))
field.plugins.push(maskPlugin);
else
field.plugins = maskPlugin;

maskPlugin.init(field);
}


It works right this piece of code now.

Thanks

Daniil
Sep 25, 2012, 5:02 PM
I think you detach them in time.