mmoo9154

Untitled

Mar 5th, 2018
301
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.61 KB | None | 0 0
  1. AccountList.cmp
  2. ------------------------
  3. <aura:component controller="AccountsController">
  4. <aura:attribute name="accounts" type="List" />
  5. <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
  6. <!--
  7. Use a data table from the Lightning Design System:
  8. https://www.lightningdesignsystem.com/components/data-tables/
  9. -->
  10. <table class="slds-table slds-table--bordered slds-table--striped slds-table--cell-buffer slds-table--fixed-layout">
  11. <thead>
  12. <tr class="slds-text-heading--label">
  13. <th scope="col"><div class="slds-truncate" title="ID">ID</div></th>
  14. <th scope="col"><div class="slds-truncate" title="Name">Name</div></th>
  15. <th scope="col"><div class="slds-truncate" title="Type">Type</div></th>
  16. <th scope="col"><div class="slds-truncate" title="Number Of Employees">Number Of Employees</div></th>
  17. <th scope="col"><div class="slds-truncate" title="Ticker Symbol">Ticker Symbol</div></th>
  18. <th scope="col"><div class="slds-truncate" title="Phone">Phone</div></th>
  19. <th scope="col"><div class="slds-truncate" title="Delete">Delete</div></th>
  20. </tr>
  21. </thead>
  22. <tbody>
  23. <!-- Use the Apex model and controller to fetch server side data -->
  24. <aura:iteration items="{!v.accounts}" var="account">
  25. <tr>
  26. <th scope="row"><div class="slds-truncate" title="{!account.Id}">{!account.Id}</div></th>
  27. <td><div class="slds-truncate" title="{!account.Name}">{!account.Name}</div></td>
  28. <td><div class="slds-truncate" title="{!account.Type}">{!account.Type}</div></td>
  29. <td><div class="slds-truncate" title="{!account.NumberOfEmployees}">{!account.NumberOfEmployees}</div></td>
  30. <td><div class="slds-truncate" title="{!account.TickerSymbol}">{!account.TickerSymbol}</div></td>
  31. <td><div class="slds-truncate" title="{!account.Phone}">{!account.Phone}</div></td>
  32. <td>
  33. <form onsubmit="{!c.deleteAccount}">
  34. <input type="hidden" value="{!account.Name}" name="account-name" />
  35. <!--
  36. Use a Lightning Base Component
  37. To display an icon next to the label
  38. -->
  39. <lightning:button label="Delete"
  40. iconName="utility:delete"
  41. iconPosition="left"
  42. variant="destructive"
  43. type="submit"
  44. />
  45. </form>
  46. </td>
  47. </tr>
  48. </aura:iteration>
  49. </tbody>
  50. </table>
  51. </aura:component>
  52.  
  53.  
  54. AccountListController.js
  55. -------------------------
  56. ({
  57. doInit: function(component, event, helper) {
  58. // Fetch the account list from the Apex controller
  59. helper.getAccountList(component);
  60. },
  61.  
  62. deleteAccount: function(component, event, helper) {
  63. // Prevent the form from getting submitted
  64. event.preventDefault();
  65.  
  66. // Get the value from the field that's in the form
  67. var form = event.getSource();
  68. console.log(form);
  69. var accountName = '<<TBD>>'; //form.find("account-name").get("v.value");
  70. confirm('Delete the ' + accountName + ' account? (don’t worry, this won’t actually work!)');
  71. }
  72. })
  73.  
  74.  
  75. Error Message from clicking Delete Button:
  76. ------------------------------------------
  77. Sorry to interrupt
  78. This page has an error. You might just need to refresh it.
  79. Action failed: c:AccountList$controller$deleteAccount [event.getSource is not a function]
  80. Failing descriptor: {c:AccountList$controller$deleteAccount}
Advertisement
Add Comment
Please, Sign In to add comment