IAM21 instance, do not create collab nor modify a team, your changes will be lost


Changes for page CLB Search Component

Last modified by bougault on 2023/01/17 11:42
From version 7.18
edited by bougault
on 2023/01/13 14:17
Change comment: There is no comment for this version
To version 7.21
edited by bougault
on 2023/01/13 14:33
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -15,7 +15,7 @@
15 15   <style>
16 16   ${this.styles}
17 17   </style>
18 - ${this.template}
18 + ${this.html}
19 19   `;
20 20   return template;
21 21   }
... ... @@ -43,22 +43,19 @@
43 43   }
44 44  
45 45   connectedCallback() {
46 - // this.attachShadow({ mode: 'open' });
47 47   super.connectedCallback();
48 48   this.render();
49 - this.$('#search').addEventListener('click', () => this.handleSearch());
50 - this.$('#prev').addEventListener('click', () => {
51 - if(this.offset > 0) {
52 - this.offset--;
53 - this.handleSearch();
54 - }
55 - });
56 - this.$('#next').addEventListener('click', () => {
57 - this.offset++;
58 - this.handleSearch();
59 - });
48 + this.$('#search').addEventListener('click', this.handleSearch);
49 + this.$('#prev').addEventListener('click', this.handlePrevPage);
50 + this.$('#next').addEventListener('click', this.handleNextPage;
60 60   }
61 61  
53 + disconnectedCallback() {
54 + this.$('#search').removeEventListener('click', this.handleSearch;
55 + this.$('#prev').removeEventListener('click', this.handlePrevPage);
56 + this.$('#next').removeEventListener('click', this.handleNextPage);
57 + }
58 +
62 62   get styles() {
63 63   return `
64 64   input[type="text"] {
... ... @@ -66,6 +66,16 @@
66 66   }
67 67   `
68 68   }
66 + handlePrevPage = () => {
67 + if(this.offset > 0) {
68 + this.offset--;
69 + this.handleSearch();
70 + }
71 + }
72 + handleNextPage = () => {
73 + this.offset++;
74 + this.handleSearch();
75 + }
69 69  
70 70   handleSearch = () => {
71 71   const value = this.$('input[type="text"]').value;