Komponente laden...

Laden

Weitere Komponenten

Alle anzeigen
Teil von

Autocomplete Address Form

Huch! Beim Absenden des Formulars ist etwas schief gelaufen.
Autocomplete Address Form
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace7","type":"FormWrapper","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1ace8","4e78d6b9-2bf6-4d91-d199-e2e70ae1acf2","4e78d6b9-2bf6-4d91-d199-e2e70ae1acf5"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace8","type":"FormForm","tag":"form","classes":[],"children":["6d6f96e5-ec0f-3678-71ea-2f667a61f5d3","8fcd0359-b1b5-1db7-8654-cd72221f48bd","a81c3770-ef11-3bea-f2d9-d368f16619ba"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[{"name":"ms-code-file-upload","value":"form"}],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"myForm","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"6d6f96e5-ec0f-3678-71ea-2f667a61f5d3","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["55c1e578-0176-afe7-e2ed-077013ff6edd","4e78d6b9-2bf6-4d91-d199-e2e70ae1aceb"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"55c1e578-0176-afe7-e2ed-077013ff6edd","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["55c1e578-0176-afe7-e2ed-077013ff6ede"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Address","id":""},"visibility":{"conditions":[]}}},{"_id":"55c1e578-0176-afe7-e2ed-077013ff6ede","text":true,"v":"Address"},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1aceb","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"id":"Address","name":"Address","maxlength":256,"data-name":"Address","placeholder":"","disabled":false,"type":"text","required":false,"autofocus":false},"xattr":[{"name":"ms-code-input","value":"address"}],"form":{"name":"Address","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"8fcd0359-b1b5-1db7-8654-cd72221f48bd","type":"Block","tag":"div","classes":["1a559f26-8eba-6eed-7814-cf8bb59a80c3"],"children":["b532ba5d-93a7-ad4b-4f8a-c5c6befcc3a5","de7c4538-ad2d-c3d2-2dda-a10621f10eb1"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"b532ba5d-93a7-ad4b-4f8a-c5c6befcc3a5","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["7f26ce14-59d1-5f1e-f063-6dbdd2882d04","bad15e24-a0ca-d046-bdcd-98f97ca7ebd4"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"7f26ce14-59d1-5f1e-f063-6dbdd2882d04","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["7f26ce14-59d1-5f1e-f063-6dbdd2882d05"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Postal-Code","id":""},"visibility":{"conditions":[]}}},{"_id":"7f26ce14-59d1-5f1e-f063-6dbdd2882d05","text":true,"v":"ZIP Code"},{"_id":"bad15e24-a0ca-d046-bdcd-98f97ca7ebd4","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Postal-Code","data-name":"Postal Code","placeholder":"","type":"text","id":"Postal-Code","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"postal-code"}],"form":{"name":"Postal Code","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"de7c4538-ad2d-c3d2-2dda-a10621f10eb1","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["bc5656b6-f693-d157-4fbe-bbf1b71dcb21","c9c95dce-d8fc-e45b-73b6-61cf17ec6135"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"bc5656b6-f693-d157-4fbe-bbf1b71dcb21","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["bc5656b6-f693-d157-4fbe-bbf1b71dcb22"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"City","id":""},"visibility":{"conditions":[]}}},{"_id":"bc5656b6-f693-d157-4fbe-bbf1b71dcb22","text":true,"v":"City"},{"_id":"c9c95dce-d8fc-e45b-73b6-61cf17ec6135","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"City","data-name":"City","placeholder":"","type":"text","id":"City","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"city"}],"form":{"name":"City","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"a81c3770-ef11-3bea-f2d9-d368f16619ba","type":"Block","tag":"div","classes":["1a559f26-8eba-6eed-7814-cf8bb59a80c3"],"children":["dc880ed6-8ba2-a7ce-4e58-a0707e3d1181","d11ff575-b0d7-b4dd-d64b-4b5498d39888"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"dc880ed6-8ba2-a7ce-4e58-a0707e3d1181","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1ace9","5e57614f-e1a0-669d-093e-fb916d1f0306"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace9","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acea"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Region","id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acea","text":true,"v":"Region"},{"_id":"5e57614f-e1a0-669d-093e-fb916d1f0306","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Region","data-name":"Region","placeholder":"","type":"text","id":"Region","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"region"}],"form":{"name":"Region","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"d11ff575-b0d7-b4dd-d64b-4b5498d39888","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["7f452277-d3d0-39c3-e277-f5fc688a78f6","d938d553-4408-2587-5d07-27e3caec6b4a"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"7f452277-d3d0-39c3-e277-f5fc688a78f6","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["7f452277-d3d0-39c3-e277-f5fc688a78f7"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Country-3","id":""},"visibility":{"conditions":[]}}},{"_id":"7f452277-d3d0-39c3-e277-f5fc688a78f7","text":true,"v":"Country"},{"_id":"d938d553-4408-2587-5d07-27e3caec6b4a","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Country","data-name":"Country","placeholder":"","type":"text","id":"Country-3","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"country"}],"form":{"name":"Country","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf2","type":"FormSuccessMessage","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf3"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf3","type":"Block","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf4"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf4","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf5","type":"FormErrorMessage","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf6"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf6","type":"Block","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf7"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf7","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"cd0f4d1d-a2e3-b02f-bc69-bd666830a475","fake":false,"type":"class","name":"input-wrap","namespace":"","comb":"","styleLess":"flex-grow: 1; flex-shrink: 1; flex-basis: 0%;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"af43c57f-501e-ecf6-e8b1-92b519a5a3f1","fake":false,"type":"class","name":"label","namespace":"","comb":"","styleLess":"margin-top: 20px; font-weight: 500;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"af43c57f-501e-ecf6-e8b1-92b519a5a3f2","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%, 85.33%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(0, 0.00%, 85.33%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(0, 0.00%, 85.33%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(0, 0.00%, 85.33%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; box-shadow: 0 2px 2px 0 hsla(0, 0.00%, 0.00%, 0.10);","variants":{"main_focus-visible":{"styleLess":"border-top-color: hsla(229, 100.00%, 64.00%, 1.00); border-right-color: hsla(229, 100.00%, 64.00%, 1.00); border-bottom-color: hsla(229, 100.00%, 64.00%, 1.00); border-left-color: hsla(229, 100.00%, 64.00%, 1.00);"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"1a559f26-8eba-6eed-7814-cf8bb59a80c3","fake":false,"type":"class","name":"form-row","namespace":"","comb":"","styleLess":"display: flex; justify-content: space-between; grid-column-gap: 20px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Klonen in Webflow
Komponente kopieren
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace7","type":"FormWrapper","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1ace8","4e78d6b9-2bf6-4d91-d199-e2e70ae1acf2","4e78d6b9-2bf6-4d91-d199-e2e70ae1acf5"],"data":{"form":{"type":"wrapper"},"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace8","type":"FormForm","tag":"form","classes":[],"children":["6d6f96e5-ec0f-3678-71ea-2f667a61f5d3","8fcd0359-b1b5-1db7-8654-cd72221f48bd","a81c3770-ef11-3bea-f2d9-d368f16619ba"],"data":{"form":{"type":"form","name":"Email Form"},"search":{"exclude":false},"xattr":[{"name":"ms-code-file-upload","value":"form"}],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"myForm","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","method":"get"},"visibility":{"conditions":[]},"Source":{"tag":"Default form","val":{}}}},{"_id":"6d6f96e5-ec0f-3678-71ea-2f667a61f5d3","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["55c1e578-0176-afe7-e2ed-077013ff6edd","4e78d6b9-2bf6-4d91-d199-e2e70ae1aceb"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"55c1e578-0176-afe7-e2ed-077013ff6edd","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["55c1e578-0176-afe7-e2ed-077013ff6ede"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Address","id":""},"visibility":{"conditions":[]}}},{"_id":"55c1e578-0176-afe7-e2ed-077013ff6ede","text":true,"v":"Address"},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1aceb","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"id":"Address","name":"Address","maxlength":256,"data-name":"Address","placeholder":"","disabled":false,"type":"text","required":false,"autofocus":false},"xattr":[{"name":"ms-code-input","value":"address"}],"form":{"name":"Address","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"8fcd0359-b1b5-1db7-8654-cd72221f48bd","type":"Block","tag":"div","classes":["1a559f26-8eba-6eed-7814-cf8bb59a80c3"],"children":["b532ba5d-93a7-ad4b-4f8a-c5c6befcc3a5","de7c4538-ad2d-c3d2-2dda-a10621f10eb1"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"b532ba5d-93a7-ad4b-4f8a-c5c6befcc3a5","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["7f26ce14-59d1-5f1e-f063-6dbdd2882d04","bad15e24-a0ca-d046-bdcd-98f97ca7ebd4"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"7f26ce14-59d1-5f1e-f063-6dbdd2882d04","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["7f26ce14-59d1-5f1e-f063-6dbdd2882d05"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Postal-Code","id":""},"visibility":{"conditions":[]}}},{"_id":"7f26ce14-59d1-5f1e-f063-6dbdd2882d05","text":true,"v":"ZIP Code"},{"_id":"bad15e24-a0ca-d046-bdcd-98f97ca7ebd4","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Postal-Code","data-name":"Postal Code","placeholder":"","type":"text","id":"Postal-Code","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"postal-code"}],"form":{"name":"Postal Code","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"de7c4538-ad2d-c3d2-2dda-a10621f10eb1","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["bc5656b6-f693-d157-4fbe-bbf1b71dcb21","c9c95dce-d8fc-e45b-73b6-61cf17ec6135"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"bc5656b6-f693-d157-4fbe-bbf1b71dcb21","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["bc5656b6-f693-d157-4fbe-bbf1b71dcb22"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"City","id":""},"visibility":{"conditions":[]}}},{"_id":"bc5656b6-f693-d157-4fbe-bbf1b71dcb22","text":true,"v":"City"},{"_id":"c9c95dce-d8fc-e45b-73b6-61cf17ec6135","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"City","data-name":"City","placeholder":"","type":"text","id":"City","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"city"}],"form":{"name":"City","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"a81c3770-ef11-3bea-f2d9-d368f16619ba","type":"Block","tag":"div","classes":["1a559f26-8eba-6eed-7814-cf8bb59a80c3"],"children":["dc880ed6-8ba2-a7ce-4e58-a0707e3d1181","d11ff575-b0d7-b4dd-d64b-4b5498d39888"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"dc880ed6-8ba2-a7ce-4e58-a0707e3d1181","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1ace9","5e57614f-e1a0-669d-093e-fb916d1f0306"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1ace9","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acea"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Region","id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acea","text":true,"v":"Region"},{"_id":"5e57614f-e1a0-669d-093e-fb916d1f0306","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Region","data-name":"Region","placeholder":"","type":"text","id":"Region","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"region"}],"form":{"name":"Region","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"d11ff575-b0d7-b4dd-d64b-4b5498d39888","type":"Block","tag":"div","classes":["cd0f4d1d-a2e3-b02f-bc69-bd666830a475"],"children":["7f452277-d3d0-39c3-e277-f5fc688a78f6","d938d553-4408-2587-5d07-27e3caec6b4a"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"7f452277-d3d0-39c3-e277-f5fc688a78f6","type":"FormBlockLabel","tag":"label","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f1"],"children":["7f452277-d3d0-39c3-e277-f5fc688a78f7"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":"","xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Country-3","id":""},"visibility":{"conditions":[]}}},{"_id":"7f452277-d3d0-39c3-e277-f5fc688a78f7","text":true,"v":"Country"},{"_id":"d938d553-4408-2587-5d07-27e3caec6b4a","type":"FormTextInput","tag":"input","classes":["af43c57f-501e-ecf6-e8b1-92b519a5a3f2"],"children":[],"data":{"attr":{"autofocus":false,"maxlength":256,"name":"Country","data-name":"Country","placeholder":"","type":"text","id":"Country-3","disabled":false,"required":false},"xattr":[{"name":"ms-code-input","value":"country"}],"form":{"name":"Country","type":"input","passwordPage":false},"displayName":"","search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf2","type":"FormSuccessMessage","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf3"],"data":{"form":{"type":"msg-done"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf3","type":"Block","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf4"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf4","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf5","type":"FormErrorMessage","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf6"],"data":{"form":{"type":"msg-fail"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf6","type":"Block","tag":"div","classes":[],"children":["4e78d6b9-2bf6-4d91-d199-e2e70ae1acf7"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"4e78d6b9-2bf6-4d91-d199-e2e70ae1acf7","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"cd0f4d1d-a2e3-b02f-bc69-bd666830a475","fake":false,"type":"class","name":"input-wrap","namespace":"","comb":"","styleLess":"flex-grow: 1; flex-shrink: 1; flex-basis: 0%;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"af43c57f-501e-ecf6-e8b1-92b519a5a3f1","fake":false,"type":"class","name":"label","namespace":"","comb":"","styleLess":"margin-top: 20px; font-weight: 500;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"af43c57f-501e-ecf6-e8b1-92b519a5a3f2","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%, 85.33%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(0, 0.00%, 85.33%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(0, 0.00%, 85.33%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(0, 0.00%, 85.33%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; box-shadow: 0 2px 2px 0 hsla(0, 0.00%, 0.00%, 0.10);","variants":{"main_focus-visible":{"styleLess":"border-top-color: hsla(229, 100.00%, 64.00%, 1.00); border-right-color: hsla(229, 100.00%, 64.00%, 1.00); border-bottom-color: hsla(229, 100.00%, 64.00%, 1.00); border-left-color: hsla(229, 100.00%, 64.00%, 1.00);"}},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null},{"_id":"1a559f26-8eba-6eed-7814-cf8bb59a80c3","fake":false,"type":"class","name":"form-row","namespace":"","comb":"","styleLess":"display: flex; justify-content: space-between; grid-column-gap: 20px;","variants":{},"children":[],"createdBy":"633c39086cc87120cfb65542","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser nicht unterstützt. Verwenden Sie
CC Chrome oder SS Safari.

Über diese Komponente

AI-generiert

Komponentenbeschreibung (von AI generiert)

The Autocomplete Address Form is a user-friendly form component designed to streamline the process of entering address details by providing autocomplete suggestions. It enhances user experience by reducing input errors and speeding up form completion.

Wesentliche Merkmale:

  • Includes fields for Address, ZIP Code, City, Region, and Country.
  • Provides success and error messages upon form submission.
  • Responsive design suitable for various devices.
  • Customizable input fields with placeholder options.
  • Live preview available for testing.

Gestaltungselemente:

  • Clean and modern layout with a flexible form structure.
  • Utilizes a light color scheme with subtle borders and shadows.
  • Labels are clearly defined with a margin for better readability.
  • Input fields are styled with rounded corners and focus effects.

Potenzielle Anwendungsfälle:

  • E-commerce websites requiring shipping address collection.
  • Real estate platforms for property inquiries.
  • Event registration forms needing attendee address details.
  • Subscription services that require user address verification.
  • Contact forms for businesses that need location information.

Conclusion: The Autocomplete Address Form is a versatile and efficient solution for any website needing address input, enhancing user experience while ensuring accurate data collection.

Mit dem Bau beginnen

Bauen Sie Ihre Träume

Memberstack ist 100% kostenlos, bis Sie bereit sind, zu starten - worauf warten Sie also noch? Erstellen Sie Ihre erste App und beginnen Sie noch heute mit der Entwicklung.