Smartphone

Goal

Extend CQ.form.Multifield to create a LimitMultfield to limit the number of items added in the widget

For TouchUI check this post

Demo | Package Install


Configuration



Error

Solution

1) Login to CRXDE Lite (http://localhost:4502/crx/de) and create folder /apps/classic-ui-multi-field-limit-items

2) Create node /apps/classic-ui-multi-field-limit-items/clientlib of type cq:ClientLibraryFolder and add a String property categories with value cq.widgets

3) Create file (nt:file) /apps/classic-ui-multi-field-limit-items/clientlib/js.txt and add

                       multi-field-limit-items.js

4) Create file (nt:file) /apps/classic-ui-multi-field-limit-items/clientlib/multi-field-limit-items.js and add the following code.

CQ.Ext.ns("ExperienceAEM");

ExperienceAEM.LimitMultiField = CQ.Ext.extend(CQ.form.MultiField, {
 initComponent: function () {
 ExperienceAEM.LimitMultiField.superclass.initComponent.call(this);

 if(!this.limit){
 return;
 }

 this.on("beforeadd", function(){
 var items = this.findByType(this.fieldConfig.xtype);

 if(items.length < parseInt(this.limit)){
 return;
 }

 CQ.Ext.Msg.alert(Error, More than + this.limit + " not allowed");

 return false;
 });
 }
});

CQ.Ext.reg("limit-multifield", ExperienceAEM.LimitMultiField);