Changes for page CLB Search Component
Last modified by bougault on 2023/01/17 11:42
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -48,10 +48,12 @@ 48 48 connectedCallback() { 49 49 super.connectedCallback(); 50 50 this.render(); 51 + const searchInput = this.$('input[type="text"]'); 51 51 this.$('#search').addEventListener('click', this.handleSearch); 52 52 this.$('#prev').addEventListener('click', this.handlePrevPage); 53 53 this.$('#next').addEventListener('click', this.handleNextPage); 54 - this.$('input[type="text"]').focus(); 55 + searchInput.addEventListener('keypress', this.handleKeyPress); 56 + searchInput.focus(); 55 55 } 56 56 57 57 disconnectedCallback() { ... ... @@ -58,6 +58,7 @@ 58 58 this.$('#search').removeEventListener('click', this.handleSearch); 59 59 this.$('#prev').removeEventListener('click', this.handlePrevPage); 60 60 this.$('#next').removeEventListener('click', this.handleNextPage); 63 + this.$('input[type="text"]').addEventListener('keypress', this.handleKeyPress); 61 61 } 62 62 63 63 get styles() { ... ... @@ -85,6 +85,11 @@ 85 85 .then(this.renderResults); 86 86 } 87 87 91 + handleKeyPress = (e) => { 92 + if(e.code === 'Enter') { 93 + this.handleSearch(); 94 + } 95 + } 88 88 89 89 get html() { 90 90 return ` ... ... @@ -140,7 +140,7 @@ 140 140 get html() { 141 141 return ` 142 142 <div> 143 - <a href=${this.hrefAttr}>${this.titleAttr}</a> 151 + <a href="/bin/view/${this.hrefAttr}">${this.titleAttr}</a> 144 144 <div> 145 145 <slot></slot> 146 146 </div> ... ... @@ -151,6 +151,7 @@ 151 151 this.attachShadow({ mode: 'open' }); 152 152 this.shadowRoot.appendChild(this.template.content.cloneNode(true)); 153 153 } 162 + 154 154 } 155 155 ); 156 156 </script>