Loading Component...
Loading
Thank you! I'll update
this project ASAP.
this project ASAP.
Oops! Something went wrong while submitting the form.
How to enable Google authentication
How to enable Facebook authentication
How to enable Spotify authentication
How to enable Dribbble authentication
How to enable Github authentication
How to enable LinkedIn authentication
How to enable passwordless logins
How to configure password validation
How to show/hide password
How to work with profile images
How to add a forgot password flow
How to work with checkboxes
How to configure pricing tables
About the Stripe Customer Portal
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"1ce9f439-fc70-7db6-6f77-36547c746a9e","type":"FormWrapper","tag":"div","classes":["2b9372b6-9818-d7ac-ba9e-bef3a8dbea50"],"children":["1ce9f439-fc70-7db6-6f77-36547c746a9f","1ce9f439-fc70-7db6-6f77-36547c746aa7","1ce9f439-fc70-7db6-6f77-36547c746aaa"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746a9f","type":"FormForm","tag":"form","classes":["72d0afe6-76e6-8ca4-2b01-5b72337a588e"],"children":["094f4ef9-86fc-3c5a-56dc-05414db2c3b9","ae52c201-53fc-70a7-da80-c6b712856d15","fd234bdb-ba78-03cd-fa83-02c5690a3f10","58b5b843-e340-de42-6bf9-9f7ef677647b"],"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":"094f4ef9-86fc-3c5a-56dc-05414db2c3b9","type":"FormTextInput","tag":"input","classes":[],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-Range","data-name":"Price Range","placeholder":"Example Text","type":"text","id":"Price-Range","disabled":false,"required":true},"xattr":[{"name":"ms-code-input","value":"range-slider"}],"form":{"name":"Price Range","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"ae52c201-53fc-70a7-da80-c6b712856d15","type":"Block","tag":"div","classes":["ac31597f-5746-68c2-929b-d27c45f1fdb4"],"children":["5936368a-986a-3702-eef5-df1989f4f24d","e3fc3c16-3104-65a1-6fc7-2e183604978b"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"5936368a-986a-3702-eef5-df1989f4f24d","type":"Block","tag":"div","classes":["0cf69da6-0432-b3ce-d1eb-b65253b04981"],"children":["1ce9f439-fc70-7db6-6f77-36547c746aa0","1ce9f439-fc70-7db6-6f77-36547c746aa2"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa0","type":"FormBlockLabel","tag":"label","classes":["b1cb8b07-7b6d-0eea-8e83-a421efc7bf53"],"children":["1ce9f439-fc70-7db6-6f77-36547c746aa1"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Price-From","id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa1","text":true,"v":"From ($)"},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa2","type":"FormTextInput","tag":"input","classes":["745733ea-cdea-4c61-e4a4-398db4810330"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-From","data-name":"Price (From)","placeholder":"","type":"number","id":"Price-From","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"price-from"}],"form":{"name":"Price (From)","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978b","type":"Block","tag":"div","classes":["0cf69da6-0432-b3ce-d1eb-b65253b04981"],"children":["e3fc3c16-3104-65a1-6fc7-2e183604978c","e3fc3c16-3104-65a1-6fc7-2e183604978e"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978c","type":"FormBlockLabel","tag":"label","classes":["b1cb8b07-7b6d-0eea-8e83-a421efc7bf53"],"children":["e3fc3c16-3104-65a1-6fc7-2e183604978d"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Price-To","id":""},"visibility":{"conditions":[]}}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978d","text":true,"v":"To ($)"},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978e","type":"FormTextInput","tag":"input","classes":["745733ea-cdea-4c61-e4a4-398db4810330"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-To","data-name":"Price (To)","placeholder":"","type":"number","id":"Price-To","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"price-to"}],"form":{"name":"Price (To)","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"fd234bdb-ba78-03cd-fa83-02c5690a3f10","type":"FormButton","tag":"input","classes":["a289c773-a23c-85c4-d6e2-68088d860233"],"children":[],"data":{"attr":{"type":"submit","value":"Search","data-wait":"Please wait...","id":""},"form":{"type":"button"},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"58b5b843-e340-de42-6bf9-9f7ef677647b","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #58 v0.1 💙 RANGE SLIDER INPUT -->\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js\"> </script>\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/css/ion.rangeSlider.min.css\" />\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/js/ion.rangeSlider.min.js\"></script>\n<style>\n .irs {\n font-family: inherit;\n }\n</style>\n<script>\n $(document).ready(function() {\n var rangeSlider = $('[ms-code-input=\"range-slider\"]');\n var priceFromInput = $('[ms-code-input=\"price-from\"]');\n var priceToInput = $('[ms-code-input=\"price-to\"]');\n \n // Set the default range values\n var defaultFrom = 20000;\n var defaultTo = 50000;\n\n rangeSlider.ionRangeSlider({\n skin: \"round\", // You can also try \"flat\", \"big\", \"modern\", \"sharp\", or \"square\". Default styles can be overridden with CSS.\n type: \"double\",\n grid: true,\n min: 0,\n max: 100000,\n from: defaultFrom,\n to: defaultTo,\n prefix: \"$\",\n onStart: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n },\n onChange: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n }\n });\n\n // Get the initial range values and update the inputs\n var initialRange = rangeSlider.data(\"ionRangeSlider\");\n var initialData = initialRange.result;\n priceFromInput.val(initialData.from);\n priceToInput.val(initialData.to);\n\n // Update the range slider and inputs when the inputs lose focus\n priceFromInput.on(\"blur\", function() {\n var value = $(this).val();\n var toValue = priceToInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value >= toValue ||\n value > initialData.to // Check if fromValue is higher than the current toValue\n ) {\n value = defaultFrom;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n from: value\n });\n priceFromInput.val(value);\n });\n\n priceToInput.on(\"blur\", function() {\n var value = $(this).val();\n var fromValue = priceFromInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value <= fromValue ||\n value < initialData.from // Check if toValue is lower than the current fromValue\n ) {\n value = defaultTo;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n to: value\n });\n priceToInput.val(value);\n });\n });\n</script>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<!-- 💙 MEMBERSCRIPT #58 v0.1 💙 RANGE SLIDER INPUT -->\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js\"> </script>\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/css/ion.rangeSlider.min.css\" />\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/js/ion.rangeSlider.min.js\"></script>\n<style>\n .irs {\n font-family: inherit;\n }\n</style>\n<script>\n $(document).ready(function() {\n var rangeSlider = $('[ms-code-input=\"range-slider\"]');\n var priceFromInput = $('[ms-code-input=\"price-from\"]');\n var priceToInput = $('[ms-code-input=\"price-to\"]');\n \n // Set the default range values\n var defaultFrom = 20000;\n var defaultTo = 50000;\n\n rangeSlider.ionRangeSlider({\n skin: \"round\", // You can also try \"flat\", \"big\", \"modern\", \"sharp\", or \"square\". Default styles can be overridden with CSS.\n type: \"double\",\n grid: true,\n min: 0,\n max: 100000,\n from: defaultFrom,\n to: defaultTo,\n prefix: \"$\",\n onStart: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n },\n onChange: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n }\n });\n\n // Get the initial range values and update the inputs\n var initialRange = rangeSlider.data(\"ionRangeSlider\");\n var initialData = initialRange.result;\n priceFromInput.val(initialData.from);\n priceToInput.val(initialData.to);\n\n // Update the range slider and inputs when the inputs lose focus\n priceFromInput.on(\"blur\", function() {\n var value = $(this).val();\n var toValue = priceToInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value >= toValue ||\n value > initialData.to // Check if fromValue is higher than the current toValue\n ) {\n value = defaultFrom;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n from: value\n });\n priceFromInput.val(value);\n });\n\n priceToInput.on(\"blur\", function() {\n var value = $(this).val();\n var fromValue = priceFromInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value <= fromValue ||\n value < initialData.from // Check if toValue is lower than the current fromValue\n ) {\n value = defaultTo;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n to: value\n });\n priceToInput.val(value);\n });\n });\n</script>","div":false,"iframe":false,"script":true}},"insideRTE":false}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa7","type":"FormSuccessMessage","tag":"div","classes":["5b91f9bb-6729-b5e2-03ad-6c6fc64ed72a"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046d"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046d","type":"Block","tag":"div","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f00"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046e","3bc0513b-f00c-78d3-7001-734b58d50472","3bc0513b-f00c-78d3-7001-734b58d50476"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046e","type":"Heading","tag":"h1","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f01"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046f","3bc0513b-f00c-78d3-7001-734b58d50471"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"h1"}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046f","type":"Strong","tag":"strong","classes":[],"children":["3bc0513b-f00c-78d3-7001-734b58d50470"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50470","text":true,"v":"Save these inputs"},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50471","text":true,"v":" to member profiles."},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50472","type":"Paragraph","tag":"p","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f02"],"children":["3bc0513b-f00c-78d3-7001-734b58d50473","3bc0513b-f00c-78d3-7001-734b58d50474"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50473","text":true,"v":"With Memberstack, you can allow your members to save this data to their profile and reuse it at any time as a saved filter, or anything else."},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50474","type":"Strong","tag":"strong","classes":[],"children":["3bc0513b-f00c-78d3-7001-734b58d50475"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50475","text":true,"v":""},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50476","type":"Link","tag":"a","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f03"],"children":["3bc0513b-f00c-78d3-7001-734b58d50477"],"data":{"search":{"exclude":true},"xattr":[],"block":"","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"button":true,"link":{"mode":"external","url":"https://app.memberstack.com/signup"}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50477","text":true,"v":"Try Memberstack"},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aaa","type":"FormErrorMessage","tag":"div","classes":[],"children":["1ce9f439-fc70-7db6-6f77-36547c746aab"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aab","type":"Block","tag":"div","classes":[],"children":["1ce9f439-fc70-7db6-6f77-36547c746aac"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aac","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"a289c773-a23c-85c4-d6e2-68088d860233","fake":false,"type":"class","name":"submit","namespace":"","comb":"","styleLess":"margin-top: 10px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: hsla(214.08, 100.00%, 49.02%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f01","fake":false,"type":"class","name":"h1","namespace":"","comb":"","styleLess":"margin-top: 0px; color: hsla(0, 0.00%, 100.00%, 1.00); font-weight: 400;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"2b9372b6-9818-d7ac-ba9e-bef3a8dbea50","fake":false,"type":"class","name":"form-block","namespace":"","comb":"","styleLess":"max-width: 500px; margin-bottom: 0px; padding-top: 20px; padding-right: 20px; padding-bottom: 20px; padding-left: 20px; border-top-style: solid; border-top-width: 1px; border-top-color: rgba(0, 0, 0, 0.1); border-right-style: solid; border-right-width: 1px; border-right-color: rgba(0, 0, 0, 0.1); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: rgba(0, 0, 0, 0.1); border-left-style: solid; border-left-width: 1px; border-left-color: rgba(0, 0, 0, 0.1); border-top-left-radius: 15px; border-top-right-radius: 15px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; background-color: hsla(0, 0.00%, 100.00%, 1.00); box-shadow: 0 5px 17px 0 rgba(0, 0, 0, 0.1);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"745733ea-cdea-4c61-e4a4-398db4810330","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"margin-bottom: 0px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(0, 0.00%, 0.00%, 0.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(0, 0.00%, 0.00%, 0.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(0, 0.00%, 0.00%, 0.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(0, 0.00%, 0.00%, 0.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.1);","variants":{"main_focus":{"styleLess":"border-top-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-right-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-bottom-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-left-color: hsla(214.08, 100.00%, 49.02%, 1.00);"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f02","fake":false,"type":"class","name":"p","namespace":"","comb":"","styleLess":"color: hsla(0, 0.00%, 100.00%, 0.90); font-size: 16px; line-height: 1.7; font-weight: 300;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"b1cb8b07-7b6d-0eea-8e83-a421efc7bf53","fake":false,"type":"class","name":"label","namespace":"","comb":"","styleLess":"font-weight: 500;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"72d0afe6-76e6-8ca4-2b01-5b72337a588e","fake":false,"type":"class","name":"form","namespace":"","comb":"","styleLess":"display: flex; flex-direction: column; grid-column-gap: 10px; grid-row-gap: 10px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f03","fake":false,"type":"class","name":"button_white","namespace":"","comb":"","styleLess":"margin-top: 10px; padding-right: 20px; padding-left: 20px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: hsla(208.00000000000003, 0.00%, 100.00%, 1.00); color: hsla(0, 0.00%, 5.10%, 1.00); font-weight: 600;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"5b91f9bb-6729-b5e2-03ad-6c6fc64ed72a","fake":false,"type":"class","name":"success","namespace":"","comb":"","styleLess":"padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; background-color: transparent; text-align: left;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"ac31597f-5746-68c2-929b-d27c45f1fdb4","fake":false,"type":"class","name":"form-row","namespace":"","comb":"","styleLess":"display: flex; justify-content: space-between; align-items: center; grid-column-gap: 10px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f00","fake":false,"type":"class","name":"disclaimer-inner","namespace":"","comb":"","styleLess":"display: flex; width: 100%; margin-right: auto; margin-left: auto; padding-top: 40px; padding-right: 40px; padding-bottom: 40px; padding-left: 40px; flex-direction: column; justify-content: center; align-items: flex-start; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background-color: hsla(224.01869158878503, 100.00%, 58.04%, 1.00);","variants":{"small":{"styleLess":"padding-right: 20px; padding-left: 20px;"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"0cf69da6-0432-b3ce-d1eb-b65253b04981","fake":false,"type":"class","name":"input-wrap","namespace":"","comb":"","styleLess":"","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":"1ce9f439-fc70-7db6-6f77-36547c746a9e","type":"FormWrapper","tag":"div","classes":["2b9372b6-9818-d7ac-ba9e-bef3a8dbea50"],"children":["1ce9f439-fc70-7db6-6f77-36547c746a9f","1ce9f439-fc70-7db6-6f77-36547c746aa7","1ce9f439-fc70-7db6-6f77-36547c746aaa"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746a9f","type":"FormForm","tag":"form","classes":["72d0afe6-76e6-8ca4-2b01-5b72337a588e"],"children":["094f4ef9-86fc-3c5a-56dc-05414db2c3b9","ae52c201-53fc-70a7-da80-c6b712856d15","fd234bdb-ba78-03cd-fa83-02c5690a3f10","58b5b843-e340-de42-6bf9-9f7ef677647b"],"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":"094f4ef9-86fc-3c5a-56dc-05414db2c3b9","type":"FormTextInput","tag":"input","classes":[],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-Range","data-name":"Price Range","placeholder":"Example Text","type":"text","id":"Price-Range","disabled":false,"required":true},"xattr":[{"name":"ms-code-input","value":"range-slider"}],"form":{"name":"Price Range","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"ae52c201-53fc-70a7-da80-c6b712856d15","type":"Block","tag":"div","classes":["ac31597f-5746-68c2-929b-d27c45f1fdb4"],"children":["5936368a-986a-3702-eef5-df1989f4f24d","e3fc3c16-3104-65a1-6fc7-2e183604978b"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"5936368a-986a-3702-eef5-df1989f4f24d","type":"Block","tag":"div","classes":["0cf69da6-0432-b3ce-d1eb-b65253b04981"],"children":["1ce9f439-fc70-7db6-6f77-36547c746aa0","1ce9f439-fc70-7db6-6f77-36547c746aa2"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa0","type":"FormBlockLabel","tag":"label","classes":["b1cb8b07-7b6d-0eea-8e83-a421efc7bf53"],"children":["1ce9f439-fc70-7db6-6f77-36547c746aa1"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Price-From","id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa1","text":true,"v":"From ($)"},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa2","type":"FormTextInput","tag":"input","classes":["745733ea-cdea-4c61-e4a4-398db4810330"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-From","data-name":"Price (From)","placeholder":"","type":"number","id":"Price-From","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"price-from"}],"form":{"name":"Price (From)","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978b","type":"Block","tag":"div","classes":["0cf69da6-0432-b3ce-d1eb-b65253b04981"],"children":["e3fc3c16-3104-65a1-6fc7-2e183604978c","e3fc3c16-3104-65a1-6fc7-2e183604978e"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978c","type":"FormBlockLabel","tag":"label","classes":["b1cb8b07-7b6d-0eea-8e83-a421efc7bf53"],"children":["e3fc3c16-3104-65a1-6fc7-2e183604978d"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Price-To","id":""},"visibility":{"conditions":[]}}},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978d","text":true,"v":"To ($)"},{"_id":"e3fc3c16-3104-65a1-6fc7-2e183604978e","type":"FormTextInput","tag":"input","classes":["745733ea-cdea-4c61-e4a4-398db4810330"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Price-To","data-name":"Price (To)","placeholder":"","type":"number","id":"Price-To","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"price-to"}],"form":{"name":"Price (To)","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"fd234bdb-ba78-03cd-fa83-02c5690a3f10","type":"FormButton","tag":"input","classes":["a289c773-a23c-85c4-d6e2-68088d860233"],"children":[],"data":{"attr":{"type":"submit","value":"Search","data-wait":"Please wait...","id":""},"form":{"type":"button"},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"58b5b843-e340-de42-6bf9-9f7ef677647b","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #58 v0.1 💙 RANGE SLIDER INPUT -->\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js\"> </script>\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/css/ion.rangeSlider.min.css\" />\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/js/ion.rangeSlider.min.js\"></script>\n<style>\n .irs {\n font-family: inherit;\n }\n</style>\n<script>\n $(document).ready(function() {\n var rangeSlider = $('[ms-code-input=\"range-slider\"]');\n var priceFromInput = $('[ms-code-input=\"price-from\"]');\n var priceToInput = $('[ms-code-input=\"price-to\"]');\n \n // Set the default range values\n var defaultFrom = 20000;\n var defaultTo = 50000;\n\n rangeSlider.ionRangeSlider({\n skin: \"round\", // You can also try \"flat\", \"big\", \"modern\", \"sharp\", or \"square\". Default styles can be overridden with CSS.\n type: \"double\",\n grid: true,\n min: 0,\n max: 100000,\n from: defaultFrom,\n to: defaultTo,\n prefix: \"$\",\n onStart: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n },\n onChange: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n }\n });\n\n // Get the initial range values and update the inputs\n var initialRange = rangeSlider.data(\"ionRangeSlider\");\n var initialData = initialRange.result;\n priceFromInput.val(initialData.from);\n priceToInput.val(initialData.to);\n\n // Update the range slider and inputs when the inputs lose focus\n priceFromInput.on(\"blur\", function() {\n var value = $(this).val();\n var toValue = priceToInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value >= toValue ||\n value > initialData.to // Check if fromValue is higher than the current toValue\n ) {\n value = defaultFrom;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n from: value\n });\n priceFromInput.val(value);\n });\n\n priceToInput.on(\"blur\", function() {\n var value = $(this).val();\n var fromValue = priceFromInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value <= fromValue ||\n value < initialData.from // Check if toValue is lower than the current fromValue\n ) {\n value = defaultTo;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n to: value\n });\n priceToInput.val(value);\n });\n });\n</script>","data":{"search":{"exclude":true},"embed":{"type":"html","meta":{"html":"<!-- 💙 MEMBERSCRIPT #58 v0.1 💙 RANGE SLIDER INPUT -->\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js\"> </script>\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/css/ion.rangeSlider.min.css\" />\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/js/ion.rangeSlider.min.js\"></script>\n<style>\n .irs {\n font-family: inherit;\n }\n</style>\n<script>\n $(document).ready(function() {\n var rangeSlider = $('[ms-code-input=\"range-slider\"]');\n var priceFromInput = $('[ms-code-input=\"price-from\"]');\n var priceToInput = $('[ms-code-input=\"price-to\"]');\n \n // Set the default range values\n var defaultFrom = 20000;\n var defaultTo = 50000;\n\n rangeSlider.ionRangeSlider({\n skin: \"round\", // You can also try \"flat\", \"big\", \"modern\", \"sharp\", or \"square\". Default styles can be overridden with CSS.\n type: \"double\",\n grid: true,\n min: 0,\n max: 100000,\n from: defaultFrom,\n to: defaultTo,\n prefix: \"$\",\n onStart: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n },\n onChange: function(data) {\n priceFromInput.val(data.from);\n priceToInput.val(data.to);\n }\n });\n\n // Get the initial range values and update the inputs\n var initialRange = rangeSlider.data(\"ionRangeSlider\");\n var initialData = initialRange.result;\n priceFromInput.val(initialData.from);\n priceToInput.val(initialData.to);\n\n // Update the range slider and inputs when the inputs lose focus\n priceFromInput.on(\"blur\", function() {\n var value = $(this).val();\n var toValue = priceToInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value >= toValue ||\n value > initialData.to // Check if fromValue is higher than the current toValue\n ) {\n value = defaultFrom;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n from: value\n });\n priceFromInput.val(value);\n });\n\n priceToInput.on(\"blur\", function() {\n var value = $(this).val();\n var fromValue = priceFromInput.val();\n \n // Perform validation\n if (\n value < initialRange.options.min ||\n value > initialRange.options.max ||\n value <= fromValue ||\n value < initialData.from // Check if toValue is lower than the current fromValue\n ) {\n value = defaultTo;\n }\n\n rangeSlider.data(\"ionRangeSlider\").update({\n to: value\n });\n priceToInput.val(value);\n });\n });\n</script>","div":false,"iframe":false,"script":true}},"insideRTE":false}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aa7","type":"FormSuccessMessage","tag":"div","classes":["5b91f9bb-6729-b5e2-03ad-6c6fc64ed72a"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046d"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046d","type":"Block","tag":"div","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f00"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046e","3bc0513b-f00c-78d3-7001-734b58d50472","3bc0513b-f00c-78d3-7001-734b58d50476"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046e","type":"Heading","tag":"h1","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f01"],"children":["3bc0513b-f00c-78d3-7001-734b58d5046f","3bc0513b-f00c-78d3-7001-734b58d50471"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"h1"}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d5046f","type":"Strong","tag":"strong","classes":[],"children":["3bc0513b-f00c-78d3-7001-734b58d50470"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50470","text":true,"v":"Save these inputs"},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50471","text":true,"v":" to member profiles."},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50472","type":"Paragraph","tag":"p","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f02"],"children":["3bc0513b-f00c-78d3-7001-734b58d50473","3bc0513b-f00c-78d3-7001-734b58d50474"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50473","text":true,"v":"With Memberstack, you can allow your members to save this data to their profile and reuse it at any time as a saved filter, or anything else."},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50474","type":"Strong","tag":"strong","classes":[],"children":["3bc0513b-f00c-78d3-7001-734b58d50475"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50475","text":true,"v":""},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50476","type":"Link","tag":"a","classes":["e9b7e8b4-3830-713a-81e0-62f7bcb29f03"],"children":["3bc0513b-f00c-78d3-7001-734b58d50477"],"data":{"search":{"exclude":true},"xattr":[],"block":"","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"button":true,"link":{"mode":"external","url":"https://app.memberstack.com/signup"}}},{"_id":"3bc0513b-f00c-78d3-7001-734b58d50477","text":true,"v":"Try Memberstack"},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aaa","type":"FormErrorMessage","tag":"div","classes":[],"children":["1ce9f439-fc70-7db6-6f77-36547c746aab"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aab","type":"Block","tag":"div","classes":[],"children":["1ce9f439-fc70-7db6-6f77-36547c746aac"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"1ce9f439-fc70-7db6-6f77-36547c746aac","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"a289c773-a23c-85c4-d6e2-68088d860233","fake":false,"type":"class","name":"submit","namespace":"","comb":"","styleLess":"margin-top: 10px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: hsla(214.08, 100.00%, 49.02%, 1.00);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f01","fake":false,"type":"class","name":"h1","namespace":"","comb":"","styleLess":"margin-top: 0px; color: hsla(0, 0.00%, 100.00%, 1.00); font-weight: 400;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"2b9372b6-9818-d7ac-ba9e-bef3a8dbea50","fake":false,"type":"class","name":"form-block","namespace":"","comb":"","styleLess":"max-width: 500px; margin-bottom: 0px; padding-top: 20px; padding-right: 20px; padding-bottom: 20px; padding-left: 20px; border-top-style: solid; border-top-width: 1px; border-top-color: rgba(0, 0, 0, 0.1); border-right-style: solid; border-right-width: 1px; border-right-color: rgba(0, 0, 0, 0.1); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: rgba(0, 0, 0, 0.1); border-left-style: solid; border-left-width: 1px; border-left-color: rgba(0, 0, 0, 0.1); border-top-left-radius: 15px; border-top-right-radius: 15px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; background-color: hsla(0, 0.00%, 100.00%, 1.00); box-shadow: 0 5px 17px 0 rgba(0, 0, 0, 0.1);","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"745733ea-cdea-4c61-e4a4-398db4810330","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"margin-bottom: 0px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(0, 0.00%, 0.00%, 0.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(0, 0.00%, 0.00%, 0.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(0, 0.00%, 0.00%, 0.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(0, 0.00%, 0.00%, 0.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.1);","variants":{"main_focus":{"styleLess":"border-top-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-right-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-bottom-color: hsla(214.08, 100.00%, 49.02%, 1.00); border-left-color: hsla(214.08, 100.00%, 49.02%, 1.00);"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f02","fake":false,"type":"class","name":"p","namespace":"","comb":"","styleLess":"color: hsla(0, 0.00%, 100.00%, 0.90); font-size: 16px; line-height: 1.7; font-weight: 300;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"b1cb8b07-7b6d-0eea-8e83-a421efc7bf53","fake":false,"type":"class","name":"label","namespace":"","comb":"","styleLess":"font-weight: 500;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"72d0afe6-76e6-8ca4-2b01-5b72337a588e","fake":false,"type":"class","name":"form","namespace":"","comb":"","styleLess":"display: flex; flex-direction: column; grid-column-gap: 10px; grid-row-gap: 10px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f03","fake":false,"type":"class","name":"button_white","namespace":"","comb":"","styleLess":"margin-top: 10px; padding-right: 20px; padding-left: 20px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: hsla(208.00000000000003, 0.00%, 100.00%, 1.00); color: hsla(0, 0.00%, 5.10%, 1.00); font-weight: 600;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"5b91f9bb-6729-b5e2-03ad-6c6fc64ed72a","fake":false,"type":"class","name":"success","namespace":"","comb":"","styleLess":"padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; background-color: transparent; text-align: left;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"ac31597f-5746-68c2-929b-d27c45f1fdb4","fake":false,"type":"class","name":"form-row","namespace":"","comb":"","styleLess":"display: flex; justify-content: space-between; align-items: center; grid-column-gap: 10px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"e9b7e8b4-3830-713a-81e0-62f7bcb29f00","fake":false,"type":"class","name":"disclaimer-inner","namespace":"","comb":"","styleLess":"display: flex; width: 100%; margin-right: auto; margin-left: auto; padding-top: 40px; padding-right: 40px; padding-bottom: 40px; padding-left: 40px; flex-direction: column; justify-content: center; align-items: flex-start; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background-color: hsla(224.01869158878503, 100.00%, 58.04%, 1.00);","variants":{"small":{"styleLess":"padding-right: 20px; padding-left: 20px;"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"0cf69da6-0432-b3ce-d1eb-b65253b04981","fake":false,"type":"class","name":"input-wrap","namespace":"","comb":"","styleLess":"","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
Chrome or Safari.
Chrome or Safari.
About this component
AI Generated
Component Description (Generated by AI)
The Price Range Picker is a user-friendly component designed to allow users to select a price range using a slider interface. It includes input fields for precise price entry and a submit button for searching.
Key Features:
- Interactive price range slider with adjustable min and max values
- Input fields for manual price entry
- Responsive design suitable for various devices
- Success and error messages for form submission feedback
- Integration with Memberstack for saving user preferences
Design Elements:
- Modern and clean layout with rounded corners
- Color scheme featuring shades of blue and white
- Clear labels for input fields ('From ($)' and 'To ($)')
- Hover and focus effects on input fields and buttons
Potential Use Cases:
- E-commerce websites looking to enhance product filtering options
- Real estate platforms for property price searches
- Travel booking sites for budget range selection
- Event ticketing services allowing users to set price limits
- Subscription services offering tiered pricing plans
Conclusion: The Price Range Picker is a versatile and visually appealing component that enhances user experience by simplifying price selection, making it an excellent addition for various online platforms.