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.33
edited by bougault
on 2023/01/17 09:41
Change comment: There is no comment for this version
To version 7.24
edited by bougault
on 2023/01/13 14:35
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -48,12 +48,10 @@
48 48   connectedCallback() {
49 49   super.connectedCallback();
50 50   this.render();
51 - const searchInput = this.$('input[type="text"]');
52 52   this.$('#search').addEventListener('click', this.handleSearch);
53 53   this.$('#prev').addEventListener('click', this.handlePrevPage);
54 54   this.$('#next').addEventListener('click', this.handleNextPage);
55 - searchInput.addEventListener('keypress', this.handleKeyPress);
56 - searchInput.focus();
54 + this.$('input[type="text"]').focus();
57 57   }
58 58  
59 59   disconnectedCallback() {
... ... @@ -60,30 +60,13 @@
60 60   this.$('#search').removeEventListener('click', this.handleSearch);
61 61   this.$('#prev').removeEventListener('click', this.handlePrevPage);
62 62   this.$('#next').removeEventListener('click', this.handleNextPage);
63 - this.$('input[type="text"]').addEventListener('keypress', this.handleKeyPress);
64 64   }
65 65  
66 66   get styles() {
67 67   return `
68 68   input[type="text"] {
69 - display: block;
70 - width: 100%;
71 - height: 36px;
72 - padding: 6px 12px;
73 - font-size: 16px;
74 - line-height: 1.428571429;
75 - color: #555555;
76 - background-color: #fff;
77 - background-image: none;
78 - border: 1px solid #ccc;
79 - border-radius: 4px;
80 - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
81 - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
82 - -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
83 - -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
84 - transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
66 + border: 1px solid red;
85 85   }
86 -
87 87   `
88 88   }
89 89   handlePrevPage = () => {
... ... @@ -104,11 +104,6 @@
104 104   .then(this.renderResults);
105 105   }
106 106  
107 - handleKeyPress = (e) => {
108 - if(e.code === 'Enter') {
109 - this.handleSearch();
110 - }
111 - }
112 112  
113 113   get html() {
114 114   return `
... ... @@ -164,7 +164,7 @@
164 164   get html() {
165 165   return `
166 166   <div>
167 - <a href="/bin/view/${this.hrefAttr}">${this.titleAttr}</a>
143 + <a href=${this.hrefAttr}>${this.titleAttr}</a>
168 168   <div>
169 169   <slot></slot>
170 170   </div>
... ... @@ -175,7 +175,6 @@
175 175   this.attachShadow({ mode: 'open' });
176 176   this.shadowRoot.appendChild(this.template.content.cloneNode(true));
177 177   }
178 -
179 179   }
180 180  );
181 181  </script>