Loading Component...

Loading

More Components

View All
Part of

Increase & Decrease Select Value

Oops! Something went wrong while submitting the form.
Increase & Decrease Select Value
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5df2","type":"FormWrapper","tag":"div","classes":["e0a085cf-c9bd-a44f-c571-60d79530ddcd"],"children":["390127e1-59a1-b0b2-6035-f1619cbe5df3","390127e1-59a1-b0b2-6035-f1619cbe5dfb","390127e1-59a1-b0b2-6035-f1619cbe5dfe"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5df3","type":"FormForm","tag":"form","classes":[],"children":["4cbef2eb-82c5-34e9-e2f3-d6ef9f481a9d","fd6f6374-1a4c-2fa5-b75a-9a5bd298418c"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"email-form","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"4cbef2eb-82c5-34e9-e2f3-d6ef9f481a9d","type":"Block","tag":"div","classes":["48b902ac-5b9b-9c3c-0ce1-fa36d9b7bf03"],"children":["a26f6e9a-e42c-d69d-d0aa-ae1952788383","9d0200fa-3431-83d1-e5cb-ef316239b9a0","8181ab13-07c4-c101-be22-522db7eff883","837c46d9-4ca3-f4de-0f49-02b245344043"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"a26f6e9a-e42c-d69d-d0aa-ae1952788383","type":"Block","tag":"div","classes":["bdf5d7e2-69b0-2e2e-0b81-23553d403ad6"],"children":["eac20038-c187-c48a-8133-19e6a0b19e18"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-select","value":"prev"}],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"eac20038-c187-c48a-8133-19e6a0b19e18","type":"Block","tag":"div","classes":["3e30f9ff-f85c-29bb-11ac-9efe2c46a020"],"children":["f941a183-9334-ec50-8d20-5e737756a657"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"f941a183-9334-ec50-8d20-5e737756a657","type":"Block","tag":"div","classes":["90d2c7a3-0d3b-4d93-501e-77089e3a0002"],"children":[],"data":{"tag":"div","text":false}},{"_id":"9d0200fa-3431-83d1-e5cb-ef316239b9a0","type":"FormSelect","tag":"select","classes":["895c4f17-7cce-8184-2037-b219c1ec9f78"],"children":[],"data":{"attr":{"id":"field-2","name":"field-2","data-name":"Field 2","required":false,"multiple":false},"form":{"type":"select","opts":[{"t":"1","v":"1"},{"t":"2","v":"2"},{"t":"3","v":"3"},{"t":"4","v":"4"},{"t":"5","v":"5"},{"t":"6","v":"6"},{"t":"7","v":"7"},{"t":"8","v":"8"},{"t":"9","v":"9"},{"t":"10","v":"10"}],"name":"Field 2"},"xattr":[{"name":"ms-code-select","value":"input"}]}},{"_id":"8181ab13-07c4-c101-be22-522db7eff883","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<style>\n.w-select {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n</style>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<style>\n.w-select {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n</style>","div":false,"iframe":false,"script":false,"compilable":false}},"insideRTE":false}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344043","type":"Block","tag":"div","classes":["ad6a7c9e-aa5b-6e66-992f-1be9d61a7292"],"children":["837c46d9-4ca3-f4de-0f49-02b245344044"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-select","value":"next"}],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344044","type":"Block","tag":"div","classes":["3e30f9ff-f85c-29bb-11ac-9efe2c46a020"],"children":["837c46d9-4ca3-f4de-0f49-02b245344045","837c46d9-4ca3-f4de-0f49-02b245344046"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344045","type":"Block","tag":"div","classes":["e0863d88-da61-b8da-ca84-c495e25d5c61"],"children":[],"data":{"tag":"div","text":false}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344046","type":"Block","tag":"div","classes":["90d2c7a3-0d3b-4d93-501e-77089e3a0002"],"children":[],"data":{"tag":"div","text":false}},{"_id":"fd6f6374-1a4c-2fa5-b75a-9a5bd298418c","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #60 v0.1 💙 INCREASE/DECREASE SELECT VALUE -->\n<script>\n var select = document.querySelector('[ms-code-select=\"input\"]');\n var prev = document.querySelector('[ms-code-select=\"prev\"]');\n var next = document.querySelector('[ms-code-select=\"next\"]');\n\n function updateButtons() {\n prev.style.opacity = select.selectedIndex === 0 ? '0.5' : '1';\n next.style.opacity = select.selectedIndex === select.options.length - 1 ? '0.5' : '1';\n }\n\n prev.addEventListener('click', function() {\n if (select.selectedIndex > 0) {\n select.selectedIndex--;\n }\n updateButtons();\n });\n\n next.addEventListener('click', function() {\n if (select.selectedIndex < select.options.length - 1) {\n select.selectedIndex++;\n }\n updateButtons();\n });\n\n updateButtons();\n</script>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<!-- 💙 MEMBERSCRIPT #60 v0.1 💙 INCREASE/DECREASE SELECT VALUE -->\n<script>\n var select = document.querySelector('[ms-code-select=\"input\"]');\n var prev = document.querySelector('[ms-code-select=\"prev\"]');\n var next = document.querySelector('[ms-code-select=\"next\"]');\n\n function updateButtons() {\n prev.style.opacity = select.selectedIndex === 0 ? '0.5' : '1';\n next.style.opacity = select.selectedIndex === select.options.length - 1 ? '0.5' : '1';\n }\n\n prev.addEventListener('click', function() {\n if (select.selectedIndex > 0) {\n select.selectedIndex--;\n }\n updateButtons();\n });\n\n next.addEventListener('click', function() {\n if (select.selectedIndex < select.options.length - 1) {\n select.selectedIndex++;\n }\n updateButtons();\n });\n\n updateButtons();\n</script>","div":false,"iframe":false,"script":true}},"insideRTE":false}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfb","type":"FormSuccessMessage","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dfc"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfc","type":"Block","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dfd"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfd","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfe","type":"FormErrorMessage","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dff"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dff","type":"Block","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5e00"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5e00","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"e0a085cf-c9bd-a44f-c571-60d79530ddcd","fake":false,"type":"class","name":"form-block","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"48b902ac-5b9b-9c3c-0ce1-fa36d9b7bf03","fake":false,"type":"class","name":"select-wrap","namespace":"","comb":"","styleLess":"display: flex; overflow: hidden; justify-content: center; align-items: center; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(237, 96.51%, 12.21%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(237, 96.51%, 12.21%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"bdf5d7e2-69b0-2e2e-0b81-23553d403ad6","fake":false,"type":"class","name":"select-button","namespace":"","comb":"","styleLess":"display: flex; width: 50px; height: 50px; min-width: 50px; justify-content: center; align-items: center; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 96.00%, 1.00); font-size: 30px; line-height: 30px; cursor: pointer;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"3e30f9ff-f85c-29bb-11ac-9efe2c46a020","fake":false,"type":"class","name":"plus-minus-wrap","namespace":"","comb":"","styleLess":"position: relative; display: flex; width: 15px; height: 15px; justify-content: center; align-items: center;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"90d2c7a3-0d3b-4d93-501e-77089e3a0002","fake":false,"type":"class","name":"minus","namespace":"","comb":"","styleLess":"position: absolute; width: 100%; height: 3px; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; background-color: hsla(237, 96.51%, 12.21%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"895c4f17-7cce-8184-2037-b219c1ec9f78","fake":false,"type":"class","name":"select","namespace":"","comb":"","styleLess":"width: 100px; height: 50px; margin-bottom: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-style: none; border-top-width: 1px; border-top-color: black; border-right-style: solid; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-bottom-style: none; border-bottom-width: 1px; border-bottom-color: black; border-left-style: solid; border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 100.00%, 1.00); font-size: 20px; font-weight: 700; text-align: center;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"ad6a7c9e-aa5b-6e66-992f-1be9d61a7292","fake":false,"type":"class","name":"select-button_plus","namespace":"","comb":"","styleLess":"display: flex; width: 50px; height: 50px; min-width: 50px; justify-content: center; align-items: center; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 96.00%, 1.00); font-size: 30px; line-height: 30px; cursor: pointer;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e0863d88-da61-b8da-ca84-c495e25d5c61","fake":false,"type":"class","name":"plus","namespace":"","comb":"","styleLess":"position: absolute; width: 3px; height: 100%; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; background-color: hsla(237, 96.51%, 12.21%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Clone in Webflow
Copy Component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5df2","type":"FormWrapper","tag":"div","classes":["e0a085cf-c9bd-a44f-c571-60d79530ddcd"],"children":["390127e1-59a1-b0b2-6035-f1619cbe5df3","390127e1-59a1-b0b2-6035-f1619cbe5dfb","390127e1-59a1-b0b2-6035-f1619cbe5dfe"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5df3","type":"FormForm","tag":"form","classes":[],"children":["4cbef2eb-82c5-34e9-e2f3-d6ef9f481a9d","fd6f6374-1a4c-2fa5-b75a-9a5bd298418c"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"email-form","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"4cbef2eb-82c5-34e9-e2f3-d6ef9f481a9d","type":"Block","tag":"div","classes":["48b902ac-5b9b-9c3c-0ce1-fa36d9b7bf03"],"children":["a26f6e9a-e42c-d69d-d0aa-ae1952788383","9d0200fa-3431-83d1-e5cb-ef316239b9a0","8181ab13-07c4-c101-be22-522db7eff883","837c46d9-4ca3-f4de-0f49-02b245344043"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"a26f6e9a-e42c-d69d-d0aa-ae1952788383","type":"Block","tag":"div","classes":["bdf5d7e2-69b0-2e2e-0b81-23553d403ad6"],"children":["eac20038-c187-c48a-8133-19e6a0b19e18"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-select","value":"prev"}],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"eac20038-c187-c48a-8133-19e6a0b19e18","type":"Block","tag":"div","classes":["3e30f9ff-f85c-29bb-11ac-9efe2c46a020"],"children":["f941a183-9334-ec50-8d20-5e737756a657"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"f941a183-9334-ec50-8d20-5e737756a657","type":"Block","tag":"div","classes":["90d2c7a3-0d3b-4d93-501e-77089e3a0002"],"children":[],"data":{"tag":"div","text":false}},{"_id":"9d0200fa-3431-83d1-e5cb-ef316239b9a0","type":"FormSelect","tag":"select","classes":["895c4f17-7cce-8184-2037-b219c1ec9f78"],"children":[],"data":{"attr":{"id":"field-2","name":"field-2","data-name":"Field 2","required":false,"multiple":false},"form":{"type":"select","opts":[{"t":"1","v":"1"},{"t":"2","v":"2"},{"t":"3","v":"3"},{"t":"4","v":"4"},{"t":"5","v":"5"},{"t":"6","v":"6"},{"t":"7","v":"7"},{"t":"8","v":"8"},{"t":"9","v":"9"},{"t":"10","v":"10"}],"name":"Field 2"},"xattr":[{"name":"ms-code-select","value":"input"}]}},{"_id":"8181ab13-07c4-c101-be22-522db7eff883","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<style>\n.w-select {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n</style>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<style>\n.w-select {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n</style>","div":false,"iframe":false,"script":false,"compilable":false}},"insideRTE":false}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344043","type":"Block","tag":"div","classes":["ad6a7c9e-aa5b-6e66-992f-1be9d61a7292"],"children":["837c46d9-4ca3-f4de-0f49-02b245344044"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-select","value":"next"}],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344044","type":"Block","tag":"div","classes":["3e30f9ff-f85c-29bb-11ac-9efe2c46a020"],"children":["837c46d9-4ca3-f4de-0f49-02b245344045","837c46d9-4ca3-f4de-0f49-02b245344046"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344045","type":"Block","tag":"div","classes":["e0863d88-da61-b8da-ca84-c495e25d5c61"],"children":[],"data":{"tag":"div","text":false}},{"_id":"837c46d9-4ca3-f4de-0f49-02b245344046","type":"Block","tag":"div","classes":["90d2c7a3-0d3b-4d93-501e-77089e3a0002"],"children":[],"data":{"tag":"div","text":false}},{"_id":"fd6f6374-1a4c-2fa5-b75a-9a5bd298418c","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #60 v0.1 💙 INCREASE/DECREASE SELECT VALUE -->\n<script>\n var select = document.querySelector('[ms-code-select=\"input\"]');\n var prev = document.querySelector('[ms-code-select=\"prev\"]');\n var next = document.querySelector('[ms-code-select=\"next\"]');\n\n function updateButtons() {\n prev.style.opacity = select.selectedIndex === 0 ? '0.5' : '1';\n next.style.opacity = select.selectedIndex === select.options.length - 1 ? '0.5' : '1';\n }\n\n prev.addEventListener('click', function() {\n if (select.selectedIndex > 0) {\n select.selectedIndex--;\n }\n updateButtons();\n });\n\n next.addEventListener('click', function() {\n if (select.selectedIndex < select.options.length - 1) {\n select.selectedIndex++;\n }\n updateButtons();\n });\n\n updateButtons();\n</script>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<!-- 💙 MEMBERSCRIPT #60 v0.1 💙 INCREASE/DECREASE SELECT VALUE -->\n<script>\n var select = document.querySelector('[ms-code-select=\"input\"]');\n var prev = document.querySelector('[ms-code-select=\"prev\"]');\n var next = document.querySelector('[ms-code-select=\"next\"]');\n\n function updateButtons() {\n prev.style.opacity = select.selectedIndex === 0 ? '0.5' : '1';\n next.style.opacity = select.selectedIndex === select.options.length - 1 ? '0.5' : '1';\n }\n\n prev.addEventListener('click', function() {\n if (select.selectedIndex > 0) {\n select.selectedIndex--;\n }\n updateButtons();\n });\n\n next.addEventListener('click', function() {\n if (select.selectedIndex < select.options.length - 1) {\n select.selectedIndex++;\n }\n updateButtons();\n });\n\n updateButtons();\n</script>","div":false,"iframe":false,"script":true}},"insideRTE":false}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfb","type":"FormSuccessMessage","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dfc"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfc","type":"Block","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dfd"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfd","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dfe","type":"FormErrorMessage","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5dff"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5dff","type":"Block","tag":"div","classes":[],"children":["390127e1-59a1-b0b2-6035-f1619cbe5e00"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"390127e1-59a1-b0b2-6035-f1619cbe5e00","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"e0a085cf-c9bd-a44f-c571-60d79530ddcd","fake":false,"type":"class","name":"form-block","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"48b902ac-5b9b-9c3c-0ce1-fa36d9b7bf03","fake":false,"type":"class","name":"select-wrap","namespace":"","comb":"","styleLess":"display: flex; overflow: hidden; justify-content: center; align-items: center; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(237, 96.51%, 12.21%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(237, 96.51%, 12.21%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"bdf5d7e2-69b0-2e2e-0b81-23553d403ad6","fake":false,"type":"class","name":"select-button","namespace":"","comb":"","styleLess":"display: flex; width: 50px; height: 50px; min-width: 50px; justify-content: center; align-items: center; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 96.00%, 1.00); font-size: 30px; line-height: 30px; cursor: pointer;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"3e30f9ff-f85c-29bb-11ac-9efe2c46a020","fake":false,"type":"class","name":"plus-minus-wrap","namespace":"","comb":"","styleLess":"position: relative; display: flex; width: 15px; height: 15px; justify-content: center; align-items: center;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"90d2c7a3-0d3b-4d93-501e-77089e3a0002","fake":false,"type":"class","name":"minus","namespace":"","comb":"","styleLess":"position: absolute; width: 100%; height: 3px; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; background-color: hsla(237, 96.51%, 12.21%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"895c4f17-7cce-8184-2037-b219c1ec9f78","fake":false,"type":"class","name":"select","namespace":"","comb":"","styleLess":"width: 100px; height: 50px; margin-bottom: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-style: none; border-top-width: 1px; border-top-color: black; border-right-style: solid; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-bottom-style: none; border-bottom-width: 1px; border-bottom-color: black; border-left-style: solid; border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 100.00%, 1.00); font-size: 20px; font-weight: 700; text-align: center;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"ad6a7c9e-aa5b-6e66-992f-1be9d61a7292","fake":false,"type":"class","name":"select-button_plus","namespace":"","comb":"","styleLess":"display: flex; width: 50px; height: 50px; min-width: 50px; justify-content: center; align-items: center; border-right-width: 1px; border-right-color: hsla(237, 96.51%, 12.21%, 1.00); border-left-width: 1px; border-left-color: hsla(237, 96.51%, 12.21%, 1.00); background-color: hsla(0, 0.00%, 96.00%, 1.00); font-size: 30px; line-height: 30px; cursor: pointer;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e0863d88-da61-b8da-ca84-c495e25d5c61","fake":false,"type":"class","name":"plus","namespace":"","comb":"","styleLess":"position: absolute; width: 3px; height: 100%; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; background-color: hsla(237, 96.51%, 12.21%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser not supported. Use
CC Chrome or SS Safari.

About this component

AI Generated

Component Description (Generated by AI)

This component allows users to easily increase or decrease a selected value from a dropdown menu using intuitive buttons. It enhances user experience by providing a visual and interactive way to select options.

Key Features:

  • Interactive buttons to increase or decrease selection
  • Responsive design suitable for various devices
  • Includes success and error messages for form submissions

Design Elements:

  • Flexbox layout for alignment and spacing
  • Rounded borders with a solid color scheme
  • Custom styles for select dropdown and buttons
  • Minimalistic design with clear visual cues

Potential Use Cases:

  • E-commerce websites for quantity selection
  • Survey forms requiring numerical input
  • Booking systems for selecting dates or times
  • Educational platforms for quiz or test responses

Conclusion: The Increase & Decrease Select Value component is a versatile tool that enhances user interaction on forms, making it ideal for various applications across different industries.

Start building

Start building your dreams

Memberstack is 100% free until you're ready to launch - so, what are you waiting for? Create your first app and start building today.