Component laden...

Laden

Meer onderdelen

Bekijk alles
Deel van

Custom Multi-select with Search

Oeps! Er ging iets mis bij het verzenden van het formulier.
Custom Multi-select with Search
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69e9","type":"Block","tag":"div","classes":[],"children":["b98039a6-d472-2080-bba7-3df9de743818","3396b678-dfce-3ccc-bb6c-31b53fcb69ea","3396b678-dfce-3ccc-bb6c-31b53fcb69ee","3396b678-dfce-3ccc-bb6c-31b53fcb69f1","3396b678-dfce-3ccc-bb6c-31b53fcb69f4","9571438a-a7b5-b1e7-e40f-2dd9c28c65d4"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"b98039a6-d472-2080-bba7-3df9de743818","type":"HtmlEmbed","tag":"div","classes":["ab8c9d71-affa-2b0d-cb88-f5754d399200"],"children":[],"v":"<style>\n.search-result:has(.w--redirected-checked) {\n display: inline-block !important;\n width: auto;\n padding-right: 1.8rem;\n margin-right: .5rem;\n order: -1;\n}\n.search-result.results:has(.w--redirected-checked) {\n display: inline-block !important;\n}\n</style>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<style>\n.search-result:has(.w--redirected-checked) {\n display: inline-block !important;\n width: auto;\n padding-right: 1.8rem;\n margin-right: .5rem;\n order: -1;\n}\n.search-result.results:has(.w--redirected-checked) {\n display: inline-block !important;\n}\n</style>","div":false,"iframe":false,"script":false,"compilable":false}},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]},"insideRTE":false}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ea","type":"Block","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93022f"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69eb","3396b678-dfce-3ccc-bb6c-31b53fcb69ec"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69eb","text":true,"v":"Custom Multi-select using checkboxes + Custom Instant Search (page code) + always keep selections visible"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ec","type":"Span","tag":"span","classes":["6b8902a2-181b-b570-6fc0-60668a930241"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69ed"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ed","text":true,"v":""},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ee","type":"Block","tag":"div","classes":["32907061-dc2d-d5d1-55c4-d35bc2f326fc"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69ef","3396b678-dfce-3ccc-bb6c-31b53fcb69f0"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ef","type":"FormBlockLabel","tag":"label","classes":["cbc4628c-0081-8554-c247-4cab6cb7180f"],"children":[],"data":{"form":{"type":"label"},"attr":{"for":"Search-2","id":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f0","type":"FormTextInput","tag":"input","classes":["6b8902a2-181b-b570-6fc0-60668a93023b","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"children":[],"data":{"displayName":"","attr":{"autofocus":false,"maxlength":256,"name":"Search-2","data-name":"Search 2","placeholder":"Search for materials...","type":"text","id":"Search-2","disabled":false,"required":false},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"name":"Search 2","type":"input","passwordPage":false}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f1","type":"Block","tag":"div","classes":["9a3d63a4-b5e9-71f3-b661-8b7c8e972f0e"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f2","3396b678-dfce-3ccc-bb6c-31b53fcb69f3"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f2","type":"Block","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","80ba8221-4387-f799-9b99-9b181a18a17e"],"children":[],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f3","type":"Block","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","b86a3efd-6f34-d216-66d5-80f739691141"],"children":[],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f4","type":"Block","tag":"div","classes":["5eb75594-6c3e-db31-b9ee-097ba00a8425"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f5","3396b678-dfce-3ccc-bb6c-31b53fcb69f9","3396b678-dfce-3ccc-bb6c-31b53fcb69fd","3396b678-dfce-3ccc-bb6c-31b53fcb6a01","3396b678-dfce-3ccc-bb6c-31b53fcb6a05","7776f56a-ee84-a92f-16c4-2c68ada20af0","8c21d154-14ab-4fca-394d-e2795c9521ad","9b70eefc-8ed1-f4b3-eb60-7cc34289f0de","8edf33fd-fd47-bdf6-90eb-f2ca74f6674b","11a8612e-2547-b319-9ab9-46e969ca3a06"],"data":{"search":{"exclude":false},"xattr":[{"name":"data-ms-member","value":"more"}],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f5","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f6","3396b678-dfce-3ccc-bb6c-31b53fcb69f7"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f6","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Wood "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f7","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f8"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f8","text":true,"v":"Wood"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f9","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fa","3396b678-dfce-3ccc-bb6c-31b53fcb69fb"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fa","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Metal"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fb","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fc"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fc","text":true,"v":"Metal"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fd","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","80ba8221-4387-f799-9b99-9b181a18a17e"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fe","3396b678-dfce-3ccc-bb6c-31b53fcb69ff"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fe","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Plasic"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ff","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a00"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a00","text":true,"v":"Plastic"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a01","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a02","3396b678-dfce-3ccc-bb6c-31b53fcb6a03"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a02","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Polycarbonate"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a03","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a04"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a04","text":true,"v":"Polycarbonate"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a05","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a06","3396b678-dfce-3ccc-bb6c-31b53fcb6a07"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a06","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Some Rocks"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a07","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a08"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a08","text":true,"v":"Some Rocks"},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af0","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["7776f56a-ee84-a92f-16c4-2c68ada20af1","7776f56a-ee84-a92f-16c4-2c68ada20af2"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af1","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Gold Nugs"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af2","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["7776f56a-ee84-a92f-16c4-2c68ada20af3"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af3","text":true,"v":"Gold Nuggets"},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521ad","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["8c21d154-14ab-4fca-394d-e2795c9521ae","8c21d154-14ab-4fca-394d-e2795c9521af"],"data":{"displayName":"","attr":{"id":""},"xattr":[{"name":"","value":""}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521ae","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Chicken Nugs"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521af","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["8c21d154-14ab-4fca-394d-e2795c9521b0"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521b0","text":true,"v":"Chicken Nuggets"},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0de","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["9b70eefc-8ed1-f4b3-eb60-7cc34289f0df","9b70eefc-8ed1-f4b3-eb60-7cc34289f0e0"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0df","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Salt"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0e0","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["9b70eefc-8ed1-f4b3-eb60-7cc34289f0e1"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0e1","text":true,"v":"Salt"},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674b","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["8edf33fd-fd47-bdf6-90eb-f2ca74f6674c","8edf33fd-fd47-bdf6-90eb-f2ca74f6674d"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674c","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Silver "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674d","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["8edf33fd-fd47-bdf6-90eb-f2ca74f6674e"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674e","text":true,"v":"Silver"},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a06","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["11a8612e-2547-b319-9ab9-46e969ca3a07","11a8612e-2547-b319-9ab9-46e969ca3a08"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a07","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Dirt "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a08","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["11a8612e-2547-b319-9ab9-46e969ca3a09"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a09","text":true,"v":"A Bunch of Dirt"},{"_id":"9571438a-a7b5-b1e7-e40f-2dd9c28c65d4","type":"HtmlEmbed","tag":"div","classes":["c4acd00f-eaee-8ed3-f4ea-74f51f2ddc2b"],"children":[],"v":"<script>\n$(\".on-page-search\").on(\"keyup\", function() {\n var v = $(this).val();\n $(\".results\").removeClass(\"results\");\n $(\".noresults\").removeClass(\"noresults\");\n $(\".search-result\").each(function() {\n if (v != \"\" && $(this).text().search(new RegExp(v, 'gi')) != -1) {\n $(this).addClass(\"results\");\n } else if (v != \"\" && $(this).text().search(v) != 1) {\n $(this).addClass(\"noresults\");\n }\n });\n});\n</script>","data":{"insideRTE":false,"search":{"exclude":true},"xattr":[],"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"embed":{"type":"html","meta":{"html":"<script>\n$(\".on-page-search\").on(\"keyup\", function() {\n var v = $(this).val();\n $(\".results\").removeClass(\"results\");\n $(\".noresults\").removeClass(\"noresults\");\n $(\".search-result\").each(function() {\n if (v != \"\" && $(this).text().search(new RegExp(v, 'gi')) != -1) {\n $(this).addClass(\"results\");\n } else if (v != \"\" && $(this).text().search(v) != 1) {\n $(this).addClass(\"noresults\");\n }\n });\n});\n</script>","div":false,"iframe":false,"script":true}}}}],"styles":[{"_id":"3b2317eb-5e16-6725-f50e-17a287acdc45","fake":false,"type":"class","name":"search-result","namespace":"","comb":"","styleLess":"position: relative; z-index: 2; display: flex; width: 100%; margin-bottom: 0.25rem; padding-top: 0.3rem; padding-bottom: 0.2rem; padding-left: 0.7rem; align-items: center; flex-grow: 0; flex-shrink: 0; flex-basis: auto; line-height: 1.4em;","variants":{"main_hover":{"styleLess":"position: relative; border-top-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-right-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-bottom-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-left-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); box-shadow: 0 20px 30px -10px hsla(0, 0.00%, 0.00%, 0.13);"}},"children":["80ba8221-4387-f799-9b99-9b181a18a17e","b86a3efd-6f34-d216-66d5-80f739691141"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93023b","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"min-height: 48px; margin-bottom: 0px; padding-top: 13px; padding-right: 45px; padding-bottom: 10px; padding-left: 18px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(230, 22.16%, 76.88%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(230, 22.16%, 76.88%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(230, 22.16%, 76.88%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(230, 22.16%, 76.88%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(231.42857142857142, 0.00%, 100.00%, 1.00); box-shadow: 0 3px 6px -2px hsla(261, 97.36%, 15.88%, 0.10); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 1rem;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(225, 0.00%, 0.00%, 1.00);"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-color: hsla(225, 0.00%, 0.00%, 1.00); box-shadow: none /* 0 1px 2px 0 hsla(261, 97.36%, 15.88%, 0.10) */;"},"tiny":{"styleLess":"font-size: 0.9rem;"},"main_open":{"styleLess":"border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);"}},"children":["6b8902a2-181b-b570-6fc0-60668a930250","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"selector":null},{"_id":"9d7afcd0-9551-4cec-530e-de1e593ce0d2","fake":false,"type":"class","name":"custom-checkbox-label-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; width: 100%; color: hsla(225, 0.00%, 0.00%, 1.00); font-weight: 600; mix-blend-mode: normal;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"31c90483-67e8-0f87-5113-5c4dfc1c6135","fake":false,"type":"class","name":"checkbox_button-b","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 3; display: inline-block; width: 100%; height: 100%; margin-top: 0px; margin-left: 0px; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; cursor: pointer;","variants":{"main_redirected-checked":{"styleLess":"width: 100%; height: 100%; border-top-width: 2px; border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-width: 2px; border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-width: 2px; border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-width: 2px; border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(147.22222222222223, 65.06%, 32.55%, 0.05); background-image: @img_63570cb1b1dd1607479f1327; background-position: 90% 50%; background-size: 14px; background-repeat: no-repeat;"},"main_hover":{"styleLess":"background-color: hsla(225, 0.00%, 0.00%, 0.05);"}},"children":["ef87cee6-e256-7d29-0598-deb47550485b"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"cbc4628c-0081-8554-c247-4cab6cb7180f","fake":false,"type":"class","name":"Icon-Search","namespace":"","comb":"","styleLess":"position: absolute; left: 16px; top: 16px; right: auto; bottom: auto; width: 15px; height: 15px; background-image: @img_6356d93cf10eab413db9a707; background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; opacity: 0.5;","variants":{"small":{"styleLess":"top: 17px;"}},"children":[],"selector":null},{"_id":"5eb75594-6c3e-db31-b9ee-097ba00a8425","fake":false,"type":"class","name":"multi-select-wrap","namespace":"","comb":"","styleLess":"display: flex; overflow: scroll; width: 100%; max-height: 150px; padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.25rem; padding-left: 0.5rem; flex-wrap: wrap; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: rgba(0, 0, 0, 0.02);","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"b86a3efd-6f34-d216-66d5-80f739691141","fake":false,"type":"class","name":"results","namespace":"","comb":"&","styleLess":"order: 2;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"9a3d63a4-b5e9-71f3-b661-8b7c8e972f0e","fake":false,"type":"class","name":"RESULTS CLASSES","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"80ba8221-4387-f799-9b99-9b181a18a17e","fake":false,"type":"class","name":"noresults","namespace":"","comb":"&","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a930241","fake":false,"type":"class","name":"text-color-grey","namespace":"","comb":"","styleLess":"opacity: 0.7;","variants":{},"children":[],"selector":null},{"_id":"32907061-dc2d-d5d1-55c4-d35bc2f326fc","fake":false,"type":"class","name":"relative","namespace":"","comb":"","styleLess":"position: relative;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"c4acd00f-eaee-8ed3-f4ea-74f51f2ddc2b","fake":false,"type":"class","name":"👋 Search Javascript","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"dc98219a-6639-055f-f1b8-f6e1f8809f52","fake":false,"type":"class","name":"on-page-search","namespace":"","comb":"&","styleLess":"width: 100%; margin-bottom: 0.5rem; padding-left: 44px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"ab8c9d71-affa-2b0d-cb88-f5754d399200","fake":false,"type":"class","name":"👋 Search CSS","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93022f","fake":false,"type":"class","name":"checkbox-label","namespace":"","comb":"","styleLess":"margin-bottom: 0.5rem; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 0.9rem; font-weight: 600;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","siteId":"635689ca57c4a5be05d92b4d","width":150,"isHD":false,"height":150,"fileName":"6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","createdOn":"2022-10-24T18:28:12.254Z","origFileName":"search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","fileHash":"4104413cca6c3d22278bf4cfd5dfb2c7","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","_id":"6356d93cf10eab413db9a707","updatedOn":"2022-10-24T18:28:12.351Z","markedAsDeleted":false,"fileSize":475},{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","siteId":"635689ca57c4a5be05d92b4d","isHD":false,"fileName":"63570cb1b1dd1607479f1327_noun_Close_3610311.svg","createdOn":"2022-10-24T22:07:45.460Z","origFileName":"noun_Close_3610311.svg","fileHash":"be9e4811a472e18505cbd30538757206","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","_id":"63570cb1b1dd1607479f1327","updatedOn":"2022-10-24T22:07:45.460Z","fileSize":705}],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Klonen in Webflow
Kopieer component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69e9","type":"Block","tag":"div","classes":[],"children":["b98039a6-d472-2080-bba7-3df9de743818","3396b678-dfce-3ccc-bb6c-31b53fcb69ea","3396b678-dfce-3ccc-bb6c-31b53fcb69ee","3396b678-dfce-3ccc-bb6c-31b53fcb69f1","3396b678-dfce-3ccc-bb6c-31b53fcb69f4","9571438a-a7b5-b1e7-e40f-2dd9c28c65d4"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"b98039a6-d472-2080-bba7-3df9de743818","type":"HtmlEmbed","tag":"div","classes":["ab8c9d71-affa-2b0d-cb88-f5754d399200"],"children":[],"v":"<style>\n.search-result:has(.w--redirected-checked) {\n display: inline-block !important;\n width: auto;\n padding-right: 1.8rem;\n margin-right: .5rem;\n order: -1;\n}\n.search-result.results:has(.w--redirected-checked) {\n display: inline-block !important;\n}\n</style>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<style>\n.search-result:has(.w--redirected-checked) {\n display: inline-block !important;\n width: auto;\n padding-right: 1.8rem;\n margin-right: .5rem;\n order: -1;\n}\n.search-result.results:has(.w--redirected-checked) {\n display: inline-block !important;\n}\n</style>","div":false,"iframe":false,"script":false,"compilable":false}},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]},"insideRTE":false}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ea","type":"Block","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93022f"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69eb","3396b678-dfce-3ccc-bb6c-31b53fcb69ec"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69eb","text":true,"v":"Custom Multi-select using checkboxes + Custom Instant Search (page code) + always keep selections visible"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ec","type":"Span","tag":"span","classes":["6b8902a2-181b-b570-6fc0-60668a930241"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69ed"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ed","text":true,"v":""},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ee","type":"Block","tag":"div","classes":["32907061-dc2d-d5d1-55c4-d35bc2f326fc"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69ef","3396b678-dfce-3ccc-bb6c-31b53fcb69f0"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ef","type":"FormBlockLabel","tag":"label","classes":["cbc4628c-0081-8554-c247-4cab6cb7180f"],"children":[],"data":{"form":{"type":"label"},"attr":{"for":"Search-2","id":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f0","type":"FormTextInput","tag":"input","classes":["6b8902a2-181b-b570-6fc0-60668a93023b","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"children":[],"data":{"displayName":"","attr":{"autofocus":false,"maxlength":256,"name":"Search-2","data-name":"Search 2","placeholder":"Search for materials...","type":"text","id":"Search-2","disabled":false,"required":false},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"name":"Search 2","type":"input","passwordPage":false}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f1","type":"Block","tag":"div","classes":["9a3d63a4-b5e9-71f3-b661-8b7c8e972f0e"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f2","3396b678-dfce-3ccc-bb6c-31b53fcb69f3"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f2","type":"Block","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","80ba8221-4387-f799-9b99-9b181a18a17e"],"children":[],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f3","type":"Block","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","b86a3efd-6f34-d216-66d5-80f739691141"],"children":[],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f4","type":"Block","tag":"div","classes":["5eb75594-6c3e-db31-b9ee-097ba00a8425"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f5","3396b678-dfce-3ccc-bb6c-31b53fcb69f9","3396b678-dfce-3ccc-bb6c-31b53fcb69fd","3396b678-dfce-3ccc-bb6c-31b53fcb6a01","3396b678-dfce-3ccc-bb6c-31b53fcb6a05","7776f56a-ee84-a92f-16c4-2c68ada20af0","8c21d154-14ab-4fca-394d-e2795c9521ad","9b70eefc-8ed1-f4b3-eb60-7cc34289f0de","8edf33fd-fd47-bdf6-90eb-f2ca74f6674b","11a8612e-2547-b319-9ab9-46e969ca3a06"],"data":{"search":{"exclude":false},"xattr":[{"name":"data-ms-member","value":"more"}],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f5","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f6","3396b678-dfce-3ccc-bb6c-31b53fcb69f7"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f6","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Wood "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f7","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69f8"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f8","text":true,"v":"Wood"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69f9","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fa","3396b678-dfce-3ccc-bb6c-31b53fcb69fb"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fa","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Metal"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fb","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fc"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fc","text":true,"v":"Metal"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fd","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45","80ba8221-4387-f799-9b99-9b181a18a17e"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb69fe","3396b678-dfce-3ccc-bb6c-31b53fcb69ff"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69fe","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Plasic"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb69ff","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a00"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a00","text":true,"v":"Plastic"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a01","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a02","3396b678-dfce-3ccc-bb6c-31b53fcb6a03"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a02","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Polycarbonate"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a03","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a04"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a04","text":true,"v":"Polycarbonate"},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a05","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a06","3396b678-dfce-3ccc-bb6c-31b53fcb6a07"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a06","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Some Rocks"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a07","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["3396b678-dfce-3ccc-bb6c-31b53fcb6a08"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"3396b678-dfce-3ccc-bb6c-31b53fcb6a08","text":true,"v":"Some Rocks"},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af0","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["7776f56a-ee84-a92f-16c4-2c68ada20af1","7776f56a-ee84-a92f-16c4-2c68ada20af2"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af1","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Gold Nugs"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af2","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["7776f56a-ee84-a92f-16c4-2c68ada20af3"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"7776f56a-ee84-a92f-16c4-2c68ada20af3","text":true,"v":"Gold Nuggets"},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521ad","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["8c21d154-14ab-4fca-394d-e2795c9521ae","8c21d154-14ab-4fca-394d-e2795c9521af"],"data":{"displayName":"","attr":{"id":""},"xattr":[{"name":"","value":""}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521ae","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Chicken Nugs"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521af","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["8c21d154-14ab-4fca-394d-e2795c9521b0"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"8c21d154-14ab-4fca-394d-e2795c9521b0","text":true,"v":"Chicken Nuggets"},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0de","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["9b70eefc-8ed1-f4b3-eb60-7cc34289f0df","9b70eefc-8ed1-f4b3-eb60-7cc34289f0e0"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0df","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Salt"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0e0","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["9b70eefc-8ed1-f4b3-eb60-7cc34289f0e1"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"9b70eefc-8ed1-f4b3-eb60-7cc34289f0e1","text":true,"v":"Salt"},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674b","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["8edf33fd-fd47-bdf6-90eb-f2ca74f6674c","8edf33fd-fd47-bdf6-90eb-f2ca74f6674d"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674c","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Silver "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674d","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["8edf33fd-fd47-bdf6-90eb-f2ca74f6674e"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"8edf33fd-fd47-bdf6-90eb-f2ca74f6674e","text":true,"v":"Silver"},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a06","type":"FormCheckboxWrapper","tag":"div","classes":["3b2317eb-5e16-6725-f50e-17a287acdc45"],"children":["11a8612e-2547-b319-9ab9-46e969ca3a07","11a8612e-2547-b319-9ab9-46e969ca3a08"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a07","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Dirt "}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a08","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["11a8612e-2547-b319-9ab9-46e969ca3a09"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"11a8612e-2547-b319-9ab9-46e969ca3a09","text":true,"v":"A Bunch of Dirt"},{"_id":"9571438a-a7b5-b1e7-e40f-2dd9c28c65d4","type":"HtmlEmbed","tag":"div","classes":["c4acd00f-eaee-8ed3-f4ea-74f51f2ddc2b"],"children":[],"v":"<script>\n$(\".on-page-search\").on(\"keyup\", function() {\n var v = $(this).val();\n $(\".results\").removeClass(\"results\");\n $(\".noresults\").removeClass(\"noresults\");\n $(\".search-result\").each(function() {\n if (v != \"\" && $(this).text().search(new RegExp(v, 'gi')) != -1) {\n $(this).addClass(\"results\");\n } else if (v != \"\" && $(this).text().search(v) != 1) {\n $(this).addClass(\"noresults\");\n }\n });\n});\n</script>","data":{"insideRTE":false,"search":{"exclude":true},"xattr":[],"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"embed":{"type":"html","meta":{"html":"<script>\n$(\".on-page-search\").on(\"keyup\", function() {\n var v = $(this).val();\n $(\".results\").removeClass(\"results\");\n $(\".noresults\").removeClass(\"noresults\");\n $(\".search-result\").each(function() {\n if (v != \"\" && $(this).text().search(new RegExp(v, 'gi')) != -1) {\n $(this).addClass(\"results\");\n } else if (v != \"\" && $(this).text().search(v) != 1) {\n $(this).addClass(\"noresults\");\n }\n });\n});\n</script>","div":false,"iframe":false,"script":true}}}}],"styles":[{"_id":"3b2317eb-5e16-6725-f50e-17a287acdc45","fake":false,"type":"class","name":"search-result","namespace":"","comb":"","styleLess":"position: relative; z-index: 2; display: flex; width: 100%; margin-bottom: 0.25rem; padding-top: 0.3rem; padding-bottom: 0.2rem; padding-left: 0.7rem; align-items: center; flex-grow: 0; flex-shrink: 0; flex-basis: auto; line-height: 1.4em;","variants":{"main_hover":{"styleLess":"position: relative; border-top-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-right-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-bottom-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-left-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); box-shadow: 0 20px 30px -10px hsla(0, 0.00%, 0.00%, 0.13);"}},"children":["80ba8221-4387-f799-9b99-9b181a18a17e","b86a3efd-6f34-d216-66d5-80f739691141"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93023b","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"min-height: 48px; margin-bottom: 0px; padding-top: 13px; padding-right: 45px; padding-bottom: 10px; padding-left: 18px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(230, 22.16%, 76.88%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(230, 22.16%, 76.88%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(230, 22.16%, 76.88%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(230, 22.16%, 76.88%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(231.42857142857142, 0.00%, 100.00%, 1.00); box-shadow: 0 3px 6px -2px hsla(261, 97.36%, 15.88%, 0.10); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 1rem;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(225, 0.00%, 0.00%, 1.00);"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-color: hsla(225, 0.00%, 0.00%, 1.00); box-shadow: none /* 0 1px 2px 0 hsla(261, 97.36%, 15.88%, 0.10) */;"},"tiny":{"styleLess":"font-size: 0.9rem;"},"main_open":{"styleLess":"border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);"}},"children":["6b8902a2-181b-b570-6fc0-60668a930250","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"selector":null},{"_id":"9d7afcd0-9551-4cec-530e-de1e593ce0d2","fake":false,"type":"class","name":"custom-checkbox-label-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; width: 100%; color: hsla(225, 0.00%, 0.00%, 1.00); font-weight: 600; mix-blend-mode: normal;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"31c90483-67e8-0f87-5113-5c4dfc1c6135","fake":false,"type":"class","name":"checkbox_button-b","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 3; display: inline-block; width: 100%; height: 100%; margin-top: 0px; margin-left: 0px; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; cursor: pointer;","variants":{"main_redirected-checked":{"styleLess":"width: 100%; height: 100%; border-top-width: 2px; border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-width: 2px; border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-width: 2px; border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-width: 2px; border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(147.22222222222223, 65.06%, 32.55%, 0.05); background-image: @img_63570cb1b1dd1607479f1327; background-position: 90% 50%; background-size: 14px; background-repeat: no-repeat;"},"main_hover":{"styleLess":"background-color: hsla(225, 0.00%, 0.00%, 0.05);"}},"children":["ef87cee6-e256-7d29-0598-deb47550485b"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"cbc4628c-0081-8554-c247-4cab6cb7180f","fake":false,"type":"class","name":"Icon-Search","namespace":"","comb":"","styleLess":"position: absolute; left: 16px; top: 16px; right: auto; bottom: auto; width: 15px; height: 15px; background-image: @img_6356d93cf10eab413db9a707; background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; opacity: 0.5;","variants":{"small":{"styleLess":"top: 17px;"}},"children":[],"selector":null},{"_id":"5eb75594-6c3e-db31-b9ee-097ba00a8425","fake":false,"type":"class","name":"multi-select-wrap","namespace":"","comb":"","styleLess":"display: flex; overflow: scroll; width: 100%; max-height: 150px; padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.25rem; padding-left: 0.5rem; flex-wrap: wrap; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: rgba(0, 0, 0, 0.02);","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"b86a3efd-6f34-d216-66d5-80f739691141","fake":false,"type":"class","name":"results","namespace":"","comb":"&","styleLess":"order: 2;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"9a3d63a4-b5e9-71f3-b661-8b7c8e972f0e","fake":false,"type":"class","name":"RESULTS CLASSES","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"80ba8221-4387-f799-9b99-9b181a18a17e","fake":false,"type":"class","name":"noresults","namespace":"","comb":"&","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a930241","fake":false,"type":"class","name":"text-color-grey","namespace":"","comb":"","styleLess":"opacity: 0.7;","variants":{},"children":[],"selector":null},{"_id":"32907061-dc2d-d5d1-55c4-d35bc2f326fc","fake":false,"type":"class","name":"relative","namespace":"","comb":"","styleLess":"position: relative;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"c4acd00f-eaee-8ed3-f4ea-74f51f2ddc2b","fake":false,"type":"class","name":"👋 Search Javascript","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"dc98219a-6639-055f-f1b8-f6e1f8809f52","fake":false,"type":"class","name":"on-page-search","namespace":"","comb":"&","styleLess":"width: 100%; margin-bottom: 0.5rem; padding-left: 44px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"ab8c9d71-affa-2b0d-cb88-f5754d399200","fake":false,"type":"class","name":"👋 Search CSS","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93022f","fake":false,"type":"class","name":"checkbox-label","namespace":"","comb":"","styleLess":"margin-bottom: 0.5rem; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 0.9rem; font-weight: 600;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","siteId":"635689ca57c4a5be05d92b4d","width":150,"isHD":false,"height":150,"fileName":"6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","createdOn":"2022-10-24T18:28:12.254Z","origFileName":"search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","fileHash":"4104413cca6c3d22278bf4cfd5dfb2c7","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/6356d93cf10eab413db9a707_search-5667_a8e43cc6-4999-42ce-91e5-374ec6671433.svg","_id":"6356d93cf10eab413db9a707","updatedOn":"2022-10-24T18:28:12.351Z","markedAsDeleted":false,"fileSize":475},{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","siteId":"635689ca57c4a5be05d92b4d","isHD":false,"fileName":"63570cb1b1dd1607479f1327_noun_Close_3610311.svg","createdOn":"2022-10-24T22:07:45.460Z","origFileName":"noun_Close_3610311.svg","fileHash":"be9e4811a472e18505cbd30538757206","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","_id":"63570cb1b1dd1607479f1327","updatedOn":"2022-10-24T22:07:45.460Z","fileSize":705}],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser niet ondersteund. Gebruik
CC Chrome of SS Safari.

Over dit onderdeel

AI-gegenereerd

Beschrijving van onderdeel (gegenereerd door AI)

This component allows users to select multiple options from a list while providing a search functionality to filter through the options efficiently.

Belangrijkste kenmerken:

  • Customizable multi-select
  • Instant search functionality to filter options
  • Always visible selections for user convenience
  • Responsive ontwerp geschikt voor verschillende schermformaten

Ontwerpelementen:

  • Minimalistic and clean layout
  • Soft color palette with grey, green and white tones
  • Rounded corners for input fields
  • Hover effects for better user interaction

Potentiële gebruikssituaties:

  • E-commerce websites for product filtering
  • Survey forms requiring multiple selections
  • Event registration forms with multiple options
  • Content management systems for categorizing items

Conclusion: The Custom Multi-select with Search component is a versatile tool that enhances user experience by simplifying the selection process while maintaining a clean and modern design.

Bouwen

Begin met het bouwen van je dromen

Memberstack is 100% gratis totdat u klaar bent om te lanceren - dus waar wacht u nog op? Maak je eerste app en begin vandaag nog.