---
title: "Some important features of Extjs"  
description: "Validations in Extjs textfield  maskRe:- It’s a type of validation that’s allow user to enter only specific type of data,that’s define in maskRe valid"  
author: "Hemant Patel"  
published: 2017-02-28  
updated: 2018-03-17  
canonical: https://www.mindstick.com/blog/11310/some-important-features-of-extjs  
category: "sencha extjs"  
tags: ["sencha"]  
reading_time: 2 minutes  

---

# Some important features of Extjs

**Validations in Extjs textfield**\

**maskRe:-** It’s a type of [validation](https://www.mindstick.com/articles/12234/validation-using-data-annotation-using-entity-framework) that’s allow user to enter only specific type of data,that’s define in maskRe validation section. Suppose we want that user only entered text in textfield,and no special [expression](https://www.mindstick.com/articles/1861/sqlite-expressions) like “- , =, +, /”, allow, then we give under textfield section, “maskRe: /[A-Za-z]/ ”.

This expression work as a validation that’s allow only capital and small letters in text box.

## e.g:-

\

```
{        xtype: 'textfield',        fieldLabel: 'Father name',        name: 'FatherName',        maxLength: 8,        enforceMaxLength: true,        maskRe: /[^@#$%&*0-9^]/, //validation tool for  write only alphabets in extfield        margin: '0 0 0 10',        itemId: 'txtfatherName',    }
```

**Listeners in Extjs:**

Listeners is also a important [features](https://www.mindstick.com/articles/12993/5-advanced-features-for-your-odoo-ecommerce-theme) of Extjs, That’s provide facility to user call any back in [function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server) in UI section. And access controller-function for specific task. Suppose we want to call a function of controller that’s call a [alert box](https://www.mindstick.com/articles/12940/how-to-create-message-alert-box-using-jquery), whose print ‘Hello Buddy’. Then we declare and define [controller method](https://www.mindstick.com/forum/12693/how-to-use-textbox-and-viewbag-value-in-controller-method) or function in controller section. And that’s method call in UI section under listeners section. It’s invoke method of controller from UI.

\
**Syntax of Listeners:-**

listeners:{ click:’callControllerMethod’ }

## e.g:-

```
{            xtype: 'button',            text: 'Submit',            width: '25%',            padding: 5,            itemId: 'saveBtnId',            listeners: //implement listener for call function of controller            {                click: 'saveClick' //call method of controller on button click            }        }
```

**Method Of controller:**

```
saveClick: function () {   //define save function on save button click  alert(‘hello buddy’);                                         }
```

**[Trigger](https://www.mindstick.com/blog/167/triggers-in-wpf) In Extjs:**

\
Trigger is type of [component](https://www.mindstick.com/articles/12262/learn-how-to-make-a-component-in-magento-2) in Extjs. Its provide [functionality](https://www.mindstick.com/blog/136/using-watermark-functionality-in-textbox-by-jquery) of browse

\

button and allow user to browse any data on trigger click. We can also

\

create a window or show grid on trigger click.

General example of trigger for create a user window.

```
{        xtype: 'trigger',//use trigger for browse user record in grid and also use as a xtfield        fieldLabel: 'Name',        name: 'Name',        itemId: 'txtName',        maxLength: 8,        enforceMaxLength: true,        maskRe: /[a-zA-Z]/,//another way to define validation        style: 'text-align:left',        //labelStyle:'font-weight:bold;color:Blue',        //labelAlign: 'top',        //width: '95%',        margin: '5 0 0 10',        triggerCls: 'x-form-search-trigger', //for browse symbol        onTriggerClick: function () {   //define function on trigger click            var window = Ext.create('app.view.UserWindow');  //create popup window            window.show();  //call show mwthod        }    }
```

---

Original Source: https://www.mindstick.com/blog/11310/some-important-features-of-extjs

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.