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.25
edited by bougault
on 2023/01/13 14:37
Change comment: There is no comment for this version
To version 7.35
edited by bougault
on 2023/01/17 09:50
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -53,7 +53,7 @@
53 53   this.$('#prev').addEventListener('click', this.handlePrevPage);
54 54   this.$('#next').addEventListener('click', this.handleNextPage);
55 55   searchInput.addEventListener('keypress', this.handleKeyPress);
56 -
56 + searchInput.focus();
57 57   }
58 58  
59 59   disconnectedCallback() {
... ... @@ -66,8 +66,24 @@
66 66   get styles() {
67 67   return `
68 68   input[type="text"] {
69 - border: 1px solid red;
69 + display: block;
70 + width: 100%;
71 +box-sizing: border-box;
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;
70 70   }
86 +
71 71   `
72 72   }
73 73   handlePrevPage = () => {
... ... @@ -89,7 +89,9 @@
89 89   }
90 90  
91 91   handleKeyPress = (e) => {
92 - console.log(e.keyCode);
108 + if(e.code === 'Enter') {
109 + this.handleSearch();
110 + }
93 93   }
94 94  
95 95   get html() {
... ... @@ -146,7 +146,7 @@
146 146   get html() {
147 147   return `
148 148   <div>
149 - <a href=${this.hrefAttr}>${this.titleAttr}</a>
167 + <a href="/bin/view/${this.hrefAttr}">${this.titleAttr}</a>
150 150   <div>
151 151   <slot></slot>
152 152   </div>
... ... @@ -157,6 +157,7 @@
157 157   this.attachShadow({ mode: 'open' });
158 158   this.shadowRoot.appendChild(this.template.content.cloneNode(true));
159 159   }
178 +
160 160   }
161 161  );
162 162  </script>