Expand my Community achievements bar.

SOLVED

Disable delete button in multifield for particular tabs

Avatar

Level 2

Hi,

 

I have a requirement where i need to disable the delete button in the multifield only for few entries based on the text entered.

 

My multifield consists only one field i.e a text field

 

Can anyone help me how to achieve this.

Thanks,

Mahi

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

You need to write custom js like below, I am disabling ADD button in multi field when button are more than 2, you can disabled delete button based on particulate content change.

(function($, $document) {
    "use strict";
    $(document).ready(function() {
        const CTA_SELECTOR = '.cmp-teaser__editor-multifield_actions';
        const CTA_ADD_BTN = '.cmp-teaser__editor-multifield_actions > button.coral3-Button--secondary';
        const MULTI_ITEM = 'coral-multifield-item';
        
        $document.on("dialog-ready", function() {
            let items = $(CTA_SELECTOR).find(MULTI_ITEM);
            if(typeof items !== 'undefined' || items != null){
                if(items.length >= 2){
                    $(CTA_ADD_BTN).attr('disabled', 'disabled');
                }
            }
        })


         $(document).on("DOMSubtreeModified",CTA_SELECTOR, function() {
            let items = $(CTA_SELECTOR).find(MULTI_ITEM);
            if(typeof items !== 'undefined' || items != null){
                if(items.length > 0 && items.length < 2){
                    $(CTA_ADD_BTN).removeAttr('disabled');
                }
            }
        })
    });
})($, $(document));

 



Arun Patidar

View solution in original post

1 Reply

Avatar

Correct answer by
Community Advisor

You need to write custom js like below, I am disabling ADD button in multi field when button are more than 2, you can disabled delete button based on particulate content change.

(function($, $document) {
    "use strict";
    $(document).ready(function() {
        const CTA_SELECTOR = '.cmp-teaser__editor-multifield_actions';
        const CTA_ADD_BTN = '.cmp-teaser__editor-multifield_actions > button.coral3-Button--secondary';
        const MULTI_ITEM = 'coral-multifield-item';
        
        $document.on("dialog-ready", function() {
            let items = $(CTA_SELECTOR).find(MULTI_ITEM);
            if(typeof items !== 'undefined' || items != null){
                if(items.length >= 2){
                    $(CTA_ADD_BTN).attr('disabled', 'disabled');
                }
            }
        })


         $(document).on("DOMSubtreeModified",CTA_SELECTOR, function() {
            let items = $(CTA_SELECTOR).find(MULTI_ITEM);
            if(typeof items !== 'undefined' || items != null){
                if(items.length > 0 && items.length < 2){
                    $(CTA_ADD_BTN).removeAttr('disabled');
                }
            }
        })
    });
})($, $(document));

 



Arun Patidar