function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Shane GilbertShane Gilbert 

Build the AccountList Component Project - No Delete Dialog Box When Delete Button Clicked.

Hello All,
Has anyone else ran into this issue in the Trailhead "Build the AccountList Component" Project?

The code is copied from the project but I cannot get the dialog box to appear when the delete buttons are clicked.

AccountList.cmp form: 
<form class="account-form" onsubmit="{!c.deleteAccount}">
  <input type="hidden" value="{!account.Name}" class="account-name" />
  <!--
    Use a Lightning Base Component
    To display an icon next to the label
   -->
  <lightning:button label="Delete"
                    iconName="utility:delete"
                    iconPosition="left"
                    variant="destructive"
                    />
</form>
AccountListController.js 
  
({
  doInit: function(component, event, helper) {      
    // Fetch the account list from the Apex controller   
    helper.getAccountList(component);
  },
  deleteAccount: function(component, event, helper) {
    // Prevent the form from getting submitted
    event.preventDefault();

    // Get the value from the field that's in the form
    var accountName = event.target.getElementsByClassName('account-name')[0].value;
    confirm('Delete the ' + accountName + ' account? (don’t worry, this won’t actually work!)');
  }
})
Thanks,
Shane



 
Namrata J RaneNamrata J Rane
Hi,
I have faced the same issue. I have added  type="submit" attribute in lightning:button. It working fine for me. 
<lightning:button label="Delete" iconName="utility:delete"  iconPosition="left"  variant="destructive"  type="submit" />

 
Shane GilbertShane Gilbert
Hi Namrata,

Thank's that worked! Some how I over looked that.
Alberto MinardiAlberto Minardi
Worked for me as well, thanks!!!
Ankit AAnkit A
One more way to do this without using the forms

AccountList.cmp 
<!--  <form class="account-form" onsubmit="{!c.deleteAccount}"> -->
              <input type="hidden" value="{!account.Name}" class="account-name" />

              <lightning:button label="Delete"
                                iconName="utility:delete"
                                iconPosition="left"
                                variant="destructive"
                                 onclick ="{!c.deleteAccount}"
                                />
       <!--     </form> -->

AccountListController.js 
deleteAccount: function(component, event, helper) {
    // Prevent the form from getting submitted
    event.preventDefault();

    // Get the value from the field that's in the form
    var accountName = document.getElementsByClassName('account-name')[0].value;
    confirm('Delete the ' + accountName + ' account? (don’t worry, this won’t actually work!)');
  }