[CLOSED] ext:TextArea MaxLen and EnforceMaxLength: Delete and Ctrl+C donÂ´t work

**supera** · Apr 23, 2012, 8:34 PM

Hi!

Hi have in my window a ext:TextArea. I set the MaxLen to "100" and EnforceMaxLenght = "true". When the maximum number of characters is reached, the TextArea don´t trigger keys Delete and Ctrl+C... Backspace works fine...

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Test69.aspx.vb" Inherits="WebApplication3.Test69" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css" >
         .x-form-readonly .x-form-field,
         .x-form-readonly .x-form-display-field {
            color: Gray !important;
        }
    
        .my-readonly {
            color: Gray !Important;
        }
        
        .my-readonly .x-trigger-noedit* {
            color: Gray !Important;
        }
        
        .my-readonly .x-form-field, 
        .my-readonly .x-form-display-field {
            color: Gray !important;
        }
        
        
        .reset-readonly {
            color: Black !Important;
        }
        
    </style>
</head>
<body>
    <ext:ResourceManager ID="ResourceManager1" runat="server" /> 
    <form id="form1" runat="server">

    <ext:Window 
        runat="server"
        ID="wndPareceres" 
        Title="Pareceres"
        Hidden="false"
        AutoShow="true"
        Modal="true"
        icon="ApplicationAdd"
        Height="350"
        Width="450"
        Resizable="false" 
        BodyPadding="10"
        CloseAction="Destroy"
        layout="AnchorLayout"
        ButtonAlign="Center"
        DefaultButton="button[text=Ok]"
        >
        <Items>
            <ext:TextArea runat="server" ID="txtName" Text="dfakjlsdfjklasjfldkasjklfdjasklfjdsklajklfdjaskljdflkjaklfdjalskjfkdlasjkldfjsklajfdklasjfkldjsaklda" ReadOnly="false" AnchorHorizontal="100%" MaxLength="100" EnforceMaxLength="true" LabelAlign="Top" FieldLabel="Name"/>
        </Items>
        <Buttons>
            <ext:Button runat="server" ID="btnOk" Text="Ok" Icon="Accept" />
            <ext:Button runat="server" ID="btnCanel" Text="Cancelar" Icon="Cancel">
                <Listeners>
                    <Click Handler="App.wndPareceres.close();" />
                </Listeners>
            </ext:Button>
        </Buttons>
        <Listeners>
            <AfterRender Handler="App.txtName.focus(true,50)" />
        </Listeners>
    </ext:Window>
    </form>
</body>
</html>

**Daniil** · Apr 24, 2012, 10:39 AM

Hi,

I was able to reproduce with the example below. We will investigate.

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <ext:ResourceManager runat="server" />
    <ext:TextArea 
        runat="server" 
        Text="12345" 
        MaxLength="5" 
        EnforceMaxLength="true" />
</body>
</html>

**Daniil** · Apr 26, 2012, 1:06 PM

These keys are restricted on ExtJS level, I've reported it.
http://www.sencha.com/forum/showthre...l=1#post789024

Here is the example with the fix.

Example

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET v2 Example</title>

    <ext:ResourcePlaceHolder runat="server" Mode="ScriptFiles" />

    <script type="text/javascript">
        Ext.form.field.TextArea.override({
            fireKey : function(e) {
                var me = this,
                    value,
                    key = e.getKey();
            
                if (e.isSpecialKey() && (me.enterIsSpecial || (key !== e.ENTER || e.hasModifier()))) {
                    me.fireEvent('specialkey', me, e);
                }
        
                if (me.needsMaxCheck && key !== e.BACKSPACE && !e.isNavKeyPress() && 
                    key !== e.DELETE && !(key === e.C && e.CTRL) && !(key === e.A && e.CTRL) && !(key === e.V && e.CTRL)) {

                    value = me.getValue();
                    if (value.length >= me.maxLength) {
                        e.stopEvent();
                    }
                }
            }
        });
    </script>
</head>
<body>
    <ext:ResourceManager runat="server" />

    <ext:TextArea
        runat="server"
        Text="12345"
        MaxLength="5"
        EnforceMaxLength="true" />
</body>
</html>

**supera** · Apr 26, 2012, 1:53 PM

Hi Daniil!

Something strange is happening.

If the text in textarea is selected, the textarea don´t accepts new keys typed (same as the size of the text is less than the maxlen has not yet been reached.)

If I unselect the text, I can insert new carecteres in text, same than maxlen is exceeded.

**Daniil** · Apr 26, 2012, 8:21 PM

Confirmed.

Well, I can conclude the maxLength functionality is not perfect yet.

I can suggest another approach. Please try the following example.

Example

<%@ Page Language="C#" %>
  
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET v2 Example</title>
 
    <script type="text/javascript">
        var onKeyPress = function (field) {
            var v = field.getValue(),
                max = field.myMaxLength;

            if (v.length > max) {
                field.setValue(v.substr(0, max));
            }
        };
    </script>
</head>
<body>
    <ext:ResourceManager runat="server" />
 
    <ext:TextArea
        runat="server"
        Text="12345"
        EnableKeyEvents="true">
        <CustomConfig>
            <ext:ConfigItem Name="myMaxLength" Value="5" Mode="Raw" />
        </CustomConfig>
        <Listeners>
            <AfterRender Handler="this.inputEl.on('paste', this.onPaste, this);" />
            <KeyPress Fn="onKeyPress" Delay="1" />
        </Listeners>    
    </ext:TextArea>
</body>
</html>

**supera** · Apr 27, 2012, 12:08 PM

Hi Daniil!

Thanks a lot for your help!

With your code, I can go workaround the problem, for now.

You can close this thread, if you want.

**Daniil** · Apr 27, 2012, 1:32 PM

I've updated the Sencha thread:
http://www.sencha.com/forum/showthre...l=1#post789902

Interesting what they will answer. If answer :)

**Daniil** · Aug 27, 2012, 7:15 AM

Hi @supera,

Many cases have been fixed by ExtJS, not not all.
http://www.sencha.com/forum/showthre...l=1#post878150

**supera** · Aug 27, 2012, 11:31 AM

Hi!

Thanks a lot, Daniil!

When I can get this fix in Ext.net?

**Daniil** · Aug 27, 2012, 11:53 AM

It is already in the 2.1 branch.

Thread: [CLOSED] ext:TextArea MaxLen and EnforceMaxLength: Delete and Ctrl+C donÂ´t work

Thread Tools

Search Thread

Display

[CLOSED] ext:TextArea MaxLen and EnforceMaxLength: Delete and Ctrl+C don´t work

Similar Threads

[CLOSED] GroupTabPanel sample in Examples Explorer appears donÂ´t work

[CLOSED] The example \Dataview\Advanced\Multisort appears donÂ´t work

maxLength donÂ´t work

My GenericPlugin donÂ´t work with <ext:TextField

SqlDataSource Sample - Delete Work?

Tags for this Thread

Posting Permissions

Sitemap

Downloads

Resources