Liferay aui auto fields delete button not working

Question

Aui Auto Fields delete button is not working well. However add button works as it is.

Here is configuration code I have used:

AUI().use('liferay-auto-fields',function(A) {
    new Liferay.AutoFields({
           contentBox: '#clientContact',
           fieldIndexes: namespace + 'clientContactIndexs',
           on: {
                'init':function(event) {
                    console.log('init');
                },
                'clone': function(event) {
                    console.log('clone');
                    console.log(event);
                },
                'delete': function(event) {
                    console.log('delete');
                    console.log(event);
                }
            }
       }).render();
   });

HTML Code:

<div id="clientContact">         
            <div class="lfr-form-row lfr-form-row-inline">
                <div class="row-fields">
                    <aui:row>
                        <aui:column cssClass="col-xs-12 col-md-4">
                            <aui:input name="clientContactName1" id="clientContactName1" label="" placeholder="client.contact.name">
                                <aui:validator name="required"></aui:validator>
                            </aui:input>
                        </aui:column>
                        <aui:column cssClass="col-xs-12 col-md-4">
                            <aui:input name="clientContactMobile1" id="clientContactMobile1" label="" placeholder="mobile">
                            </aui:input>
                        </aui:column>
                        <aui:column cssClass="col-xs-12 col-md-4">
                            <aui:input name="clientContactEmail1" id="clientContactEmail1" label="" placeholder="email">
                            </aui:input>
                        </aui:column>
                    </aui:row>
                </div>
            </div>
        </div>

Is there anything I'm missing? Thanks,

Answer 1

I found some solution to this problem. I know this is not the best solutions and it should work properly without any kind of manual code. But even though everything's fine, and your code is not working THEN and ONLY THEN you should try the below-given code.

$(".delete-row").click(function(){
    if($("#clientContact > .lfr-form-row").length > 1){
            $(this).parent().parent().parent().remove();
    }
});

It will remove the row on which delete button is clicked.