Failed to execute template. Cause: [Access denied when checking [script] access to [xwiki:Collaboratory.UX.HbpSkin.WebHome] for user [xwiki:XWiki.Admin]]. Click on this message for details.

CLB Search Component - HBP Wiki

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.7
edited by bougault
on 2023/01/13 13:50
Change comment: There is no comment for this version
To version 7.5
edited by bougault
on 2023/01/13 13:44
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -36,28 +36,26 @@
36 36   // this.attachShadow({ mode: 'open' });
37 37   super.connectedCallback();
38 38   this.render();
39 - this.$('#search').addEventListener('click', () => this.handleSearch());
40 - this.$('#prev').addEventListener('click', () => {
41 - if(this.offset > 0) {
42 - this.offset--;
43 - this.handleSearch();
44 - }
45 - });
46 - this.$('#next').addEventListener('click', () => {
47 - this.offset++;
48 - this.handleSearch();
49 - });
39 + this.searchButton.addEventListener('click', () => this.handleSearch());
50 50   }
51 51  
52 52  
53 53   handleSearch = () => {
54 - const value = this.$('input[type="text"]').value;
55 - fetch(`${this.searchBaseUrl}${encodeURIComponent(value)}`)
44 + fetch(`${this.searchBaseUrl}${encodeURIComponent(this.searchInput.value)}`)
56 56   .then(res => res.json())
57 57   .then(this.renderResults);
47 +
58 58   }
59 59  
50 + get searchInput() {
51 + return this.$('input[type="text"]');
52 + }
60 60  
54 + get searchButton() {
55 + return this.$('#search');
56 + }
57 +
58 +
61 61   get searchInputTemplate() {
62 62   return this.createTemplate(`
63 63   <div>
... ... @@ -69,7 +69,7 @@
69 69   `);
70 70   }
71 71  
72 - renderResults = (results) => {
70 + renderResults(results) {
73 73   const resultsContainer = this.$('#results');
74 74   resultsContainer.replaceChildren();
75 75   for(let i = 0, j = results.length; i < j; i++) {