[{"data":1,"prerenderedAt":681},["ShallowReactive",2],{"header:help":3,"footer:default":67,"story:navigation\u002Fsearch:help":250,"story:help\u002Fcategories":288,"story:help\u002Farticles\u002Fpopulate-custom-checkout-field-options-from-an-endpoint":314,"no-guide:populate-custom-checkout-field-options-from-an-endpoint":59,"article:\u002Fhelp\u002Farticles\u002Fpopulate-custom-checkout-field-options-from-an-endpoint":421,"story:contact":435,"help:tree:4a0e0d6c-0df1-4cd0-8755-74eace6bf033":626,"_apollo:default":680},{"name":4,"created_at":5,"published_at":6,"updated_at":7,"id":8,"uuid":9,"content":10,"slug":57,"full_slug":58,"sort_by_date":59,"position":60,"tag_list":61,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":63,"first_published_at":64,"release_id":59,"lang":65,"path":59,"alternates":66,"default_full_slug":59,"translated_slugs":59},"Help Center Header","2024-08-09T18:06:34.939Z","2024-10-21T21:58:39.217Z","2024-10-21T21:58:39.232Z",10082752,"3e9b88f7-c163-4657-a2f2-62532d600fad",{"_uid":11,"link":12,"badge":16,"items":17,"title":13,"buttons":50,"new_tab":24,"submenu":51,"alignment":13,"component":52,"badge_link":53,"top_menu_items":56},"e5645a1a-f991-40e8-8d67-e40ebc082b5a",{"id":13,"url":13,"linktype":14,"fieldtype":15,"cached_url":13},"","story","multilink","Help Center",[18,27,34,39,44],{"_uid":19,"link":20,"title":23,"new_tab":24,"submenu":25,"component":26},"5cbe2861-1f49-4166-97da-a4dddd8105e3",{"id":21,"url":13,"linktype":14,"fieldtype":15,"cached_url":22},"4c0a2d99-ec30-4579-8ef1-6bf5564d4839","help\u002Fcategories\u002F","Articles",false,[],"header___item",{"_uid":28,"link":29,"title":32,"new_tab":33,"component":26},"1c8edeb5-b9e9-4cb8-b1c6-c1f292f7d7cd",{"id":13,"url":30,"linktype":31,"fieldtype":15,"cached_url":30},"https:\u002F\u002Fwiki.foxycart.com\u002F","url","Documentation",true,{"_uid":35,"link":36,"title":38,"new_tab":33,"component":26},"8d7df70e-f087-4da0-b616-6f0e9a5af35c",{"id":13,"url":37,"linktype":31,"fieldtype":15,"cached_url":37},"https:\u002F\u002Fapi.foxycart.com\u002F","API Documentation",{"_uid":40,"link":41,"title":43,"new_tab":33,"component":26},"f76e7944-23d5-4652-87e4-cdae79272762",{"id":13,"url":42,"linktype":31,"fieldtype":15,"cached_url":42},"https:\u002F\u002Fstatus.foxy.io\u002F","System Status",{"_uid":45,"link":46,"title":49,"new_tab":24,"component":26},"0de16771-4c84-466c-a1da-d8568113c71f",{"id":47,"url":13,"linktype":14,"fieldtype":15,"cached_url":48},"01e4e370-f9b9-45af-8fa9-f15540699b0d","contact","Contact Us",[],[],"header",{"id":54,"url":13,"linktype":14,"fieldtype":15,"cached_url":55},"4a679eb7-662d-4ea4-a976-5a2acbf0b663","help\u002F",[],"help-header","navigation\u002Fhelp-header",null,20,[],10082747,"71b81c2e-5e09-48a1-a397-a3c72fcd344a","2022-09-21T14:50:25.655Z","default",[],{"name":68,"created_at":69,"published_at":70,"updated_at":71,"id":72,"uuid":73,"content":74,"slug":243,"full_slug":244,"sort_by_date":59,"position":245,"tag_list":246,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":247,"first_published_at":248,"release_id":59,"lang":65,"path":59,"alternates":249,"default_full_slug":59,"translated_slugs":59},"Default Footer","2024-08-09T18:06:59.024Z","2025-09-04T06:24:46.223Z","2025-09-04T06:24:46.241Z",10082753,"e59e67ac-248a-482f-84a1-53d4f318186a",{"_uid":75,"about":76,"logos":77,"socials":82,"sections":108,"component":225,"cta_title":226,"bottom_links":227,"cta_subtitle":241,"cta_button_link":242,"cta_button_text":183},"830983f5-c4c4-43c8-b150-86a5e3fa6dc8","Foxy’s hosted cart & payment page allow you to sell anything, using your existing website or platform.",[78],{"id":79,"alt":13,"name":13,"focus":13,"title":13,"filename":80,"copyright":13,"fieldtype":81},14760,"https:\u002F\u002Fa-us.storyblok.com\u002Ff\u002F1001040\u002Fx\u002F3b030847ec\u002Fb-corp.svg","asset",[83,90,96,102],{"_uid":84,"icon":85,"link":86,"name":88,"component":89},"faf0a618-ea94-42ea-9182-03be18c43216","fa-facebook",{"id":13,"url":87,"linktype":31,"fieldtype":15,"cached_url":87},"https:\u002F\u002Fwww.facebook.com\u002Ffoxycart","Facebook","footer___social",{"_uid":91,"icon":92,"link":93,"name":95,"component":89},"14309c18-7e79-423e-b375-34555bac0811","fa-instagram",{"id":13,"url":94,"linktype":31,"fieldtype":15,"cached_url":94},"https:\u002F\u002Fwww.instagram.com\u002Ffoxy_io","Instagram",{"_uid":97,"icon":98,"link":99,"name":101,"component":89},"8f7fe7cf-0dd3-4596-8334-226ea466716a","fa-linkedin",{"id":13,"url":100,"linktype":31,"fieldtype":15,"cached_url":100},"https:\u002F\u002Fwww.linkedin.com\u002Fcompany\u002Ffoxycart.com","LinkedIn",{"_uid":103,"icon":104,"link":105,"name":107,"component":89},"90a675b4-dd97-40b5-be09-00a87223d4c5","fa-youtube",{"id":13,"url":106,"linktype":31,"fieldtype":15,"cached_url":106},"https:\u002F\u002Fwww.youtube.com\u002Fuser\u002Ffoxycart","Youtube",[109,139,184,206],{"_uid":110,"name":111,"items":112,"component":138},"82849945-282f-488c-b18d-a8d2252f514a","Company",[113,120,126,132],{"_uid":114,"link":115,"title":118,"new_tab":24,"component":119},"1f699ab1-938b-4d9d-9825-aabcbe6f57fe",{"id":116,"url":13,"linktype":14,"fieldtype":15,"cached_url":117},"63634293-a749-4226-9439-9f38ee6dcda0","about-us","About Us","footer___menu_items",{"_uid":121,"link":122,"title":125,"new_tab":24,"component":119},"b26b00f1-a0e7-4be2-8ab3-428b8cc841f8",{"id":123,"url":13,"linktype":14,"fieldtype":15,"cached_url":124},"26cb7c55-faed-4a77-a291-1552d4111b3e","how-foxy-works","How Foxy Works",{"_uid":127,"link":128,"title":131,"new_tab":24,"component":119},"b40c68a0-1ceb-4226-9515-6176534f61fe",{"id":129,"url":13,"linktype":14,"fieldtype":15,"cached_url":130},"dc6657d7-7f4f-4c0d-b781-e971b038ee26","for-good","Foxy For Good",{"_uid":133,"link":134,"title":137,"new_tab":24,"component":119},"3ad0c134-bef9-4fff-b891-e09f16109036",{"id":135,"url":13,"linktype":14,"fieldtype":15,"cached_url":136},"23cae210-baf4-4588-9862-d09f4f52ccd2","brand-assets","Brand Assets","footer___section",{"_uid":140,"name":141,"items":142,"component":138},"a6805fa8-ac60-47f1-b8f0-f27aded0afbe","Product",[143,149,155,161,167,173,179],{"_uid":144,"link":145,"title":148,"new_tab":24,"component":119},"b39c8a4e-2383-486f-b76a-11fbb15d8134",{"id":146,"url":13,"linktype":14,"fieldtype":15,"cached_url":147},"bb04690f-fe98-4ce6-80be-05b950f2364f","features\u002F","Features",{"_uid":150,"link":151,"title":154,"new_tab":24,"component":119},"64f8a41f-c181-433d-bc0a-fc94e71ecbf6",{"id":152,"url":13,"linktype":14,"fieldtype":15,"cached_url":153},"c450c58d-761d-48c0-a9af-0b064611689b","pricing","Pricing",{"_uid":156,"link":157,"title":160,"new_tab":24,"component":119},"6e0b287f-fd8c-4146-9e0e-0ab0b5c9ce3c",{"id":158,"url":13,"linktype":14,"fieldtype":15,"cached_url":159},"fab20ad9-e76a-4947-b709-3a6fdfa88028","blog\u002Fcategories\u002Fproduct-updates","Product Updates",{"_uid":162,"link":163,"title":166,"new_tab":24,"component":119},"47e5a074-a6b5-4f1c-8c2f-89a2ae9f83eb",{"id":164,"url":13,"linktype":14,"fieldtype":15,"cached_url":165},"d2c83612-d611-47f3-a3b4-ca7fe08540b8","changelogs\u002F","Changelogs",{"_uid":168,"link":169,"title":172,"new_tab":24,"component":119},"b5c08774-542f-4ffd-b357-c94d674488b9",{"id":170,"url":13,"linktype":14,"fieldtype":15,"cached_url":171},"08876121-0df3-4ed9-aa11-902b3e41cd02","whats-next","What's Next",{"_uid":174,"link":175,"title":178,"new_tab":24,"component":119},"9c2704ed-6d9f-43e1-9e67-c8d91c083288",{"id":176,"url":13,"linktype":14,"fieldtype":15,"cached_url":177},"056a7857-b18f-4025-8f97-91a38fc19bc8","compare\u002F","Compare",{"_uid":180,"link":181,"title":183,"new_tab":24,"component":119},"5f2db35b-674b-406a-8fa7-d246633af9fe",{"id":13,"url":182,"linktype":31,"fieldtype":15,"cached_url":182},"https:\u002F\u002Fadmin.foxy.io\u002Fsign-up","Try Foxy Free",{"_uid":185,"name":186,"items":187,"component":138},"63fa1f29-4252-4640-9922-fe310e69e54a","Security",[188,194,200],{"_uid":189,"link":190,"title":193,"new_tab":24,"component":119},"1158ddb6-9eb0-466f-8eb6-7ca2ae66c8b8",{"id":191,"url":13,"linktype":14,"fieldtype":15,"cached_url":192},"1f58fb2c-8681-4742-b6e8-09999beae9f6","security-contact","Security Contact",{"_uid":195,"link":196,"title":199,"new_tab":24,"component":119},"9a79c54a-6022-4dfd-854b-766f5e4703ba",{"id":197,"url":13,"linktype":14,"fieldtype":15,"cached_url":198},"55cbfcc3-425a-4261-8037-54e919851d2d","pci","PCI Compliance",{"_uid":201,"link":202,"title":205,"new_tab":24,"component":119},"0b85f5b6-9534-4071-b323-b39d053dd4d7",{"id":203,"url":13,"linktype":14,"fieldtype":15,"cached_url":204},"c3ac0fe3-83e2-4879-afbd-d4c83e1590df","help\u002Farticles\u002Four-official-domains-public-code","Domains & Codebases",{"_uid":207,"name":208,"items":209,"component":138},"998ded67-d107-49f4-8154-ca6be51671ec","Support",[210,213,216,219,222],{"_uid":211,"link":212,"title":16,"new_tab":24,"component":119},"594ffd35-3049-4004-bb08-0db568ebd819",{"id":54,"url":13,"linktype":14,"fieldtype":15,"cached_url":55},{"_uid":214,"link":215,"title":32,"new_tab":33,"component":119},"0a1a55ab-a985-4f9d-8b42-26da714d0c1c",{"id":13,"url":30,"linktype":31,"fieldtype":15,"cached_url":30},{"_uid":217,"link":218,"title":38,"new_tab":33,"component":119},"61e0b7c8-aadf-419b-a339-b3ccabc65bf4",{"id":13,"url":37,"linktype":31,"fieldtype":15,"cached_url":37},{"_uid":220,"link":221,"title":43,"new_tab":33,"component":119},"fd67a89e-1c54-4d31-94b5-64be999062d6",{"id":13,"url":42,"linktype":31,"fieldtype":15,"cached_url":42},{"_uid":223,"link":224,"title":49,"new_tab":24,"component":119},"231a6f71-e996-4ad4-b033-d4d5542f34f0",{"id":47,"url":13,"linktype":14,"fieldtype":15,"cached_url":48},"footer","Get started with our *unlimited free trial*.",[228,235],{"_uid":229,"link":230,"text":233,"component":234},"f0b77210-2632-45a2-8436-e57cad84d01a",{"id":231,"url":13,"linktype":14,"fieldtype":15,"cached_url":232},"60ba16a2-c1f4-485f-b978-8d2eeeafbf5a","terms-of-service","Terms of Service","footer___bottom_links",{"_uid":236,"link":237,"text":240,"component":234},"4bd497b0-993f-4b4d-a5b7-8a49c7c8fec9",{"id":238,"url":13,"linktype":14,"fieldtype":15,"cached_url":239},"332302b9-1d18-4016-b9c8-9b33c72d782b","privacy-policy","Privacy Policy","No credit card required.",{"id":13,"url":182,"linktype":31,"fieldtype":15,"cached_url":182},"default-footer","navigation\u002Fdefault-footer",50,[],"11006268-07f9-41e9-96f3-c51fb723399d","2022-09-21T20:39:02.357Z",[],{"name":251,"created_at":252,"published_at":253,"updated_at":254,"id":255,"uuid":256,"content":257,"slug":279,"full_slug":282,"sort_by_date":59,"position":283,"tag_list":284,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":285,"first_published_at":286,"release_id":59,"lang":65,"path":59,"alternates":287,"default_full_slug":59,"translated_slugs":59},"Search","2024-10-21T22:08:54.973Z","2025-05-26T09:17:25.790Z","2025-05-26T09:17:25.804Z",13592003,"14cbc359-9ac1-4a7a-a8de-ad4ac8ef26d4",{"_uid":258,"name":251,"indices":259,"summary":13,"component":279,"primary_image":280},"5e4a56e8-76f1-4790-b3a7-70f1be97d042",[260,265,269,274],{"key":261,"_uid":262,"icon":13,"name":263,"component":264},"all","c12a3210-7323-4273-8217-5215e52efe84","All","index",{"key":266,"_uid":267,"icon":268,"name":23,"component":264},"help_center_article","5acff080-95e4-44d3-8dcf-1b19720af382","fa-file-alt",{"key":270,"_uid":271,"icon":272,"name":273,"component":264},"help_center_guide","b8fbc206-c083-471e-a1f0-0ebeb90a669d","fa-book","Guides",{"key":275,"_uid":276,"icon":277,"name":278,"component":264},"blog_post","23419e83-2e56-4c4c-8a05-9fd1b3c9a9bd","fa-file-image","Blog Posts","search",{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":281},{},"navigation\u002Fsearch",60,[],"11e1fd31-95cd-4fc9-b736-8b8910663e6c","2024-10-21T23:17:05.904Z",[],{"name":23,"created_at":289,"published_at":290,"updated_at":291,"id":292,"uuid":21,"content":293,"slug":307,"full_slug":22,"sort_by_date":59,"position":308,"tag_list":309,"is_startpage":33,"parent_id":310,"meta_data":59,"group_id":311,"first_published_at":312,"release_id":59,"lang":65,"path":59,"alternates":313,"default_full_slug":59,"translated_slugs":59},"2022-09-19T14:42:29.685Z","2024-07-30T18:17:22.506Z","2024-07-30T18:17:22.525Z",2660,{"_uid":294,"icon":13,"name":23,"guides":295,"pinned":24,"summary":296,"category":13,"component":297,"blog_posts":298,"content_hub":24,"icon_custom":299,"case_studies":300,"faq_sections":301,"help_articles":302,"featured_guides":303,"mailbox_category":13,"featured_articles":304,"featured_blog_posts":305,"featured_case_studies":306},"d6dae89a-907a-4bf7-82de-fe2ba875ee6e",[],"Get your questions answered with our browsable knowledge base.","help_center_category",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"filename":13,"copyright":59,"fieldtype":81},[],[],[],[],[],[],[],"categories",530,[],2658,"19ebcdd2-027f-47f5-9a5b-a8992c959578","2022-09-19T16:24:39.219Z",[],{"name":315,"created_at":316,"published_at":317,"updated_at":318,"id":319,"uuid":320,"content":321,"slug":414,"full_slug":415,"sort_by_date":59,"position":416,"tag_list":417,"is_startpage":24,"parent_id":418,"meta_data":59,"group_id":419,"first_published_at":317,"release_id":59,"lang":65,"path":59,"alternates":420,"default_full_slug":59,"translated_slugs":59},"Populate custom checkout field options from an endpoint","2026-07-21T15:48:11.099Z","2026-07-22T17:45:01.071Z","2026-07-22T17:45:01.087Z",200537256395411,"4a0e0d6c-0df1-4cd0-8755-74eace6bf033",{"_uid":322,"body":323,"name":315,"image":409,"pinned":24,"summary":411,"category":412,"component":266,"related_articles":413},"12395e6a-67bb-4db1-a1ff-3a3e745ca238",{"type":324,"content":325},"doc",[326,333,338,345,350,356,374,379,384,389,394,399,404],{"type":327,"attrs":328,"content":329},"paragraph",{"textAlign":59},[330],{"text":331,"type":332},"While Foxy provides the ability to define custom checkout fields to allow you to capture any details you need from the customer on the checkout - this requires that the options available are hard-coded on the page. Sometimes it may be easier to be able to populate the options for the customer to select dynamically from your own website.","text",{"type":327,"attrs":334,"content":335},{"textAlign":59},[336],{"text":337,"type":332},"To allow for that, you will need to add a little javascript to your checkout to perform the request dynamically, and also set up an endpoint on your website, \u003Cwrap hi>which is secured with an SSL certificate\u003C\u002Fwrap>, that can respond to the request.",{"type":339,"attrs":340,"content":342},"heading",{"level":341,"textAlign":59},2,[343],{"text":344,"type":332},"Set up your endpoint",{"type":327,"attrs":346,"content":347},{"textAlign":59},[348],{"text":349,"type":332},"This is an example in PHP - but the same process can be applied in other languages too. The key is that JSON is returned, and headers are present giving authority for your Foxy store checkout to communicate with your endpoint:",{"type":351,"attrs":352,"content":353},"code_block",{"class":59},[354],{"text":355,"type":332},"\u003C?php\nheader('Content-Type:application\u002Fjson;charset=utf-8');\nheader('X-Content-Type-Options: nosniff');\nheader('Access-Control-Allow-Origin: https:\u002F\u002Fmy-store.foxycart.com');\n\n$resp = [\n\t\"options\" => [\n\t\t\"Option 1\",\n\t\t\"Option 2\",\n\t\t\"Option 3\"\n\t]\n];\n\necho json_encode($resp);",{"type":327,"attrs":357,"content":358},{"textAlign":59},[359,361,366,368,372],{"text":360,"type":332},"Note that you'll need to update the ",{"text":362,"type":332,"marks":363},"my-store.foxycart.com",[364],{"type":365},"code",{"text":367,"type":332}," above to be your own store's subdomain, and also update the ",{"text":369,"type":332,"marks":370},"$resp",[371],{"type":365},{"text":373,"type":332}," object to return the results you're after. In practice, this would probably be from some sort of database on your side, or you would refactor this code into your own system.",{"type":339,"attrs":375,"content":376},{"level":341,"textAlign":59},[377],{"text":378,"type":332},"Add custom javascript to the checkout",{"type":327,"attrs":380,"content":381},{"textAlign":59},[382],{"text":383,"type":332},"To perform the dynamic request to your server, you'll need to add a little bit of javascript to the page. You'll add this on your stores \"configuration\" page in the administration, enable the option labelled \"Add custom header and footer code to your templates\", and paste the following into the \"footer\" textarea:",{"type":351,"attrs":385,"content":386},{"class":59},[387],{"text":388,"type":332},"{% if context == \"checkout\" %}\n\u003Cscript>\n$(function() {\n\t$.get(\"https:\u002F\u002Fwww.your-website.com\u002Foptions.php\", function(data) {\n\t\tFC.json.custom_options = data.options;\n\t\tFC.checkout.renderAdditionalFields();\n\t});\n});\n\u003C\u002Fscript>\n{% endif %}",{"type":327,"attrs":390,"content":391},{"textAlign":59},[392],{"text":393,"type":332},"You'll need to update the URL above to point to wherever your script is located from the first step.",{"type":339,"attrs":395,"content":396},{"level":341,"textAlign":59},[397],{"text":398,"type":332},"Update custom checkout fields",{"type":327,"attrs":400,"content":401},{"textAlign":59},[402],{"text":403,"type":332},"Finally, also on the configuration in the admin, enable the \"Add custom form fields to your checkout\" option present. Here you'll add in any custom fields you want to provide. As a quick example of utilising the example response above in a select object, it would look like this:",{"type":351,"attrs":405,"content":406},{"class":59},[407],{"text":408,"type":332},"{% if custom_options is defined %}\n\u003Cselect name=\"size\">\n\t{% for option in custom_options %}\n\t\t\u003Coption value=\"\" {% if size == option %}selected{% endif %}>\u003C\u002Foption>\n\t{% endfor %}\n\u003C\u002Fselect>\n{% endif %}",{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":410},{},"How to fill select, radio, or checkbox options on the checkout from an endpoint on your site.","3cb122dc-4180-4f38-bd81-4597e4c7dd46",[],"populate-custom-checkout-field-options-from-an-endpoint","help\u002Farticles\u002Fpopulate-custom-checkout-field-options-from-an-endpoint",-4180,[],2659,"9700995b-35fe-4132-a3b3-362e36578b56",[],{"html":422,"sections":423,"segments":431},"\u003Cp>While Foxy provides the ability to define custom checkout fields to allow you to capture any details you need from the customer on the checkout - this requires that the options available are hard-coded on the page. Sometimes it may be easier to be able to populate the options for the customer to select dynamically from your own website.\u003C\u002Fp>\u003Cp>To allow for that, you will need to add a little javascript to your checkout to perform the request dynamically, and also set up an endpoint on your website, <wrap hi>which is secured with an SSL certificate<\u002Fwrap>, that can respond to the request.\u003C\u002Fp>\u003Csection id=\"set-up-your-endpoint\" data-title=\"Set up your endpoint\" data-title-node=\"H2\">\u003Chr class=\"my-8\" style=\"margin-left: -48px; margin-right: -40vw\">\u003Ch2 data-anchor-id=\"set-up-your-endpoint\">Set up your endpoint\u003C\u002Fh2>\u003Cp>This is an example in PHP - but the same process can be applied in other languages too. The key is that JSON is returned, and headers are present giving authority for your Foxy store checkout to communicate with your endpoint:\u003C\u002Fp>\u003Cdiv class=\"position-relative w-100 overflow-hidden rounded-2\" data-code-block>\u003Cdiv class=\"d-flex justify-content-end border-bottom\" style=\"background:#2b2c3b;\">\u003Cbutton type=\"button\" class=\"btn btn-link btn-sm text-light\" title=\"Copy\" data-code-button>\u003Cspan data-code-default style=\"\">\u003Ci class=\"fal fa-copy me-2\">\u003C\u002Fi> Copy \u003C\u002Fspan>\u003Cspan class=\"text-success\" data-code-success style=\"display:none;\">\u003Ci class=\"fal fa-check ms-2\">\u003C\u002Fi> Copied \u003C\u002Fspan>\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv class=\"small\">\u003Cpre class=\"hljs p-2\" data-code-content>\u003Cspan class=\"hljs-meta\"><?php\nheader('Content-Type:application\u002Fjson;charset=utf-8');\nheader('X-Content-Type-Options: nosniff');\nheader('Access-Control-Allow-Origin: https:\u002F\u002Fmy-store.foxycart.com');\n\n$resp = [\n\t"options" => [\n\t\t"Option 1",\n\t\t"Option 2",\n\t\t"Option 3"\n\t]\n];\n\necho json_encode($resp);\u003C\u002Fspan>\u003C\u002Fpre>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003Cp>Note that you'll need to update the \u003Ccode class=\"badge bg-soft-danger text-danger\">my-store.foxycart.com\u003C\u002Fcode> above to be your own store's subdomain, and also update the \u003Ccode class=\"badge bg-soft-danger text-danger\">$resp\u003C\u002Fcode> object to return the results you're after. In practice, this would probably be from some sort of database on your side, or you would refactor this code into your own system.\u003C\u002Fp>\u003C\u002Fsection>\u003Csection id=\"add-custom-javascript-to-the-checkout\" data-title=\"Add custom javascript to the checkout\" data-title-node=\"H2\">\u003Chr class=\"my-8\" style=\"margin-left: -48px; margin-right: -40vw\">\u003Ch2 data-anchor-id=\"add-custom-javascript-to-the-checkout\">Add custom javascript to the checkout\u003C\u002Fh2>\u003Cp>To perform the dynamic request to your server, you'll need to add a little bit of javascript to the page. You'll add this on your stores "configuration" page in the administration, enable the option labelled "Add custom header and footer code to your templates", and paste the following into the "footer" textarea:\u003C\u002Fp>\u003Cdiv class=\"position-relative w-100 overflow-hidden rounded-2\" data-code-block>\u003Cdiv class=\"d-flex justify-content-end border-bottom\" style=\"background:#2b2c3b;\">\u003Cbutton type=\"button\" class=\"btn btn-link btn-sm text-light\" title=\"Copy\" data-code-button>\u003Cspan data-code-default style=\"\">\u003Ci class=\"fal fa-copy me-2\">\u003C\u002Fi> Copy \u003C\u002Fspan>\u003Cspan class=\"text-success\" data-code-success style=\"display:none;\">\u003Ci class=\"fal fa-check ms-2\">\u003C\u002Fi> Copied \u003C\u002Fspan>\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv class=\"small\">\u003Cpre class=\"hljs p-2\" data-code-content>{% if context == "checkout" %}\n\u003Cspan class=\"hljs-tag\"><\u003Cspan class=\"hljs-name\">script\u003C\u002Fspan>>\u003C\u002Fspan>\u003Cspan class=\"language-javascript\">\n$(\u003Cspan class=\"hljs-keyword\">function\u003C\u002Fspan>(\u003Cspan class=\"hljs-params\">\u003C\u002Fspan>) {\n\t$.\u003Cspan class=\"hljs-title function_\">get\u003C\u002Fspan>(\u003Cspan class=\"hljs-string\">"https:\u002F\u002Fwww.your-website.com\u002Foptions.php"\u003C\u002Fspan>, \u003Cspan class=\"hljs-keyword\">function\u003C\u002Fspan>(\u003Cspan class=\"hljs-params\">data\u003C\u002Fspan>) {\n\t\t\u003Cspan class=\"hljs-variable constant_\">FC\u003C\u002Fspan>.\u003Cspan class=\"hljs-property\">json\u003C\u002Fspan>.\u003Cspan class=\"hljs-property\">custom_options\u003C\u002Fspan> = data.\u003Cspan class=\"hljs-property\">options\u003C\u002Fspan>;\n\t\t\u003Cspan class=\"hljs-variable constant_\">FC\u003C\u002Fspan>.\u003Cspan class=\"hljs-property\">checkout\u003C\u002Fspan>.\u003Cspan class=\"hljs-title function_\">renderAdditionalFields\u003C\u002Fspan>();\n\t});\n});\n\u003C\u002Fspan>\u003Cspan class=\"hljs-tag\"><\u002F\u003Cspan class=\"hljs-name\">script\u003C\u002Fspan>>\u003C\u002Fspan>\n{% endif %}\u003C\u002Fpre>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003Cp>You'll need to update the URL above to point to wherever your script is located from the first step.\u003C\u002Fp>\u003C\u002Fsection>\u003Csection id=\"update-custom-checkout-fields\" data-title=\"Update custom checkout fields\" data-title-node=\"H2\">\u003Chr class=\"my-8\" style=\"margin-left: -48px; margin-right: -40vw\">\u003Ch2 data-anchor-id=\"update-custom-checkout-fields\">Update custom checkout fields\u003C\u002Fh2>\u003Cp>Finally, also on the configuration in the admin, enable the "Add custom form fields to your checkout" option present. Here you'll add in any custom fields you want to provide. As a quick example of utilising the example response above in a select object, it would look like this:\u003C\u002Fp>\u003Cdiv class=\"position-relative w-100 overflow-hidden rounded-2\" data-code-block>\u003Cdiv class=\"d-flex justify-content-end border-bottom\" style=\"background:#2b2c3b;\">\u003Cbutton type=\"button\" class=\"btn btn-link btn-sm text-light\" title=\"Copy\" data-code-button>\u003Cspan data-code-default style=\"\">\u003Ci class=\"fal fa-copy me-2\">\u003C\u002Fi> Copy \u003C\u002Fspan>\u003Cspan class=\"text-success\" data-code-success style=\"display:none;\">\u003Ci class=\"fal fa-check ms-2\">\u003C\u002Fi> Copied \u003C\u002Fspan>\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv class=\"small\">\u003Cpre class=\"hljs p-2\" data-code-content>{% if custom_options is defined %}\n\u003Cspan class=\"hljs-tag\"><\u003Cspan class=\"hljs-name\">select\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">name\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">"size"\u003C\u002Fspan>>\u003C\u002Fspan>\n\t{% for option in custom_options %}\n\t\t\u003Cspan class=\"hljs-tag\"><\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">""\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">size\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">option\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}>\u003C\u002Fspan>\u003Cspan class=\"hljs-tag\"><\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>>\u003C\u002Fspan>\n\t{% endfor %}\n\u003Cspan class=\"hljs-tag\"><\u002F\u003Cspan class=\"hljs-name\">select\u003C\u002Fspan>>\u003C\u002Fspan>\n{% endif %}\u003C\u002Fpre>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003C\u002Fsection>",[424,427,429],{"id":425,"title":344,"level":426},"set-up-your-endpoint","H2",{"id":428,"title":378,"level":426},"add-custom-javascript-to-the-checkout",{"id":430,"title":398,"level":426},"update-custom-checkout-fields",[432],{"type":433,"content":434},"html","\u003Cp>While Foxy provides the ability to define custom checkout fields to allow you to capture any details you need from the customer on the checkout - this requires that the options available are hard-coded on the page. Sometimes it may be easier to be able to populate the options for the customer to select dynamically from your own website.\u003C\u002Fp>\u003Cp>To allow for that, you will need to add a little javascript to your checkout to perform the request dynamically, and also set up an endpoint on your website, <wrap hi>which is secured with an SSL certificate<\u002Fwrap>, that can respond to the request.\u003C\u002Fp>\u003Ch2>Set up your endpoint\u003C\u002Fh2>\u003Cp>This is an example in PHP - but the same process can be applied in other languages too. The key is that JSON is returned, and headers are present giving authority for your Foxy store checkout to communicate with your endpoint:\u003C\u002Fp>\u003Cpre>\u003Ccode><?php\nheader('Content-Type:application\u002Fjson;charset=utf-8');\nheader('X-Content-Type-Options: nosniff');\nheader('Access-Control-Allow-Origin: https:\u002F\u002Fmy-store.foxycart.com');\n\n$resp = [\n\t"options" => [\n\t\t"Option 1",\n\t\t"Option 2",\n\t\t"Option 3"\n\t]\n];\n\necho json_encode($resp);\u003C\u002Fcode>\u003C\u002Fpre>\u003Cp>Note that you'll need to update the \u003Ccode class=\"badge bg-soft-danger text-danger\">my-store.foxycart.com\u003C\u002Fcode> above to be your own store's subdomain, and also update the \u003Ccode class=\"badge bg-soft-danger text-danger\">$resp\u003C\u002Fcode> object to return the results you're after. In practice, this would probably be from some sort of database on your side, or you would refactor this code into your own system.\u003C\u002Fp>\u003Ch2>Add custom javascript to the checkout\u003C\u002Fh2>\u003Cp>To perform the dynamic request to your server, you'll need to add a little bit of javascript to the page. You'll add this on your stores "configuration" page in the administration, enable the option labelled "Add custom header and footer code to your templates", and paste the following into the "footer" textarea:\u003C\u002Fp>\u003Cpre>\u003Ccode>{% if context == "checkout" %}\n<script>\n$(function() {\n\t$.get("https:\u002F\u002Fwww.your-website.com\u002Foptions.php", function(data) {\n\t\tFC.json.custom_options = data.options;\n\t\tFC.checkout.renderAdditionalFields();\n\t});\n});\n<\u002Fscript>\n{% endif %}\u003C\u002Fcode>\u003C\u002Fpre>\u003Cp>You'll need to update the URL above to point to wherever your script is located from the first step.\u003C\u002Fp>\u003Ch2>Update custom checkout fields\u003C\u002Fh2>\u003Cp>Finally, also on the configuration in the admin, enable the "Add custom form fields to your checkout" option present. Here you'll add in any custom fields you want to provide. As a quick example of utilising the example response above in a select object, it would look like this:\u003C\u002Fp>\u003Cpre>\u003Ccode>{% if custom_options is defined %}\n<select name="size">\n\t{% for option in custom_options %}\n\t\t<option value="" {% if size == option %}selected{% endif %}><\u002Foption>\n\t{% endfor %}\n<\u002Fselect>\n{% endif %}\u003C\u002Fcode>\u003C\u002Fpre>",{"name":436,"created_at":437,"published_at":438,"updated_at":439,"id":440,"uuid":47,"content":441,"slug":48,"full_slug":48,"sort_by_date":59,"position":621,"tag_list":622,"is_startpage":24,"parent_id":59,"meta_data":59,"group_id":623,"first_published_at":624,"release_id":59,"lang":65,"path":59,"alternates":625,"default_full_slug":59,"translated_slugs":59},"Contact","2022-09-23T19:56:58.957Z","2025-05-08T18:24:40.382Z","2025-05-08T18:24:40.392Z",3138,{"seo":442,"_uid":445,"title":446,"action":447,"fields":448,"method":597,"columns":598,"subtitle":612,"component":48,"button_text":618,"submit_title":619,"submit_subtitle":620},{"_uid":443,"title":436,"plugin":444,"description":13},"24ff7574-3bcc-48d2-85b5-e529dfea1cc4","meta-fields","8f54f1da-9d8f-49b2-89e7-840e886491cb","We're here to help.","https:\u002F\u002Fusebasin.com\u002Ff\u002F029f48d65402",[449,454,458,568,571,576,591],{"_uid":450,"name":451,"type":332,"label":452,"options":13,"required":33,"component":453,"placeholder":13},"9a70b226-2036-4f90-a052-b3efa61c5896","name","Name","form___field",{"_uid":455,"name":456,"type":456,"label":457,"options":13,"required":33,"component":453,"placeholder":13},"86ba35be-ff43-4a28-8633-14052a8f6622","email","Email Address",{"_uid":459,"name":460,"type":461,"label":462,"options":463,"required":33,"component":453,"conditions":464,"placeholder":13},"3f827475-492c-4f97-aa1e-2386ac263b6c","topic","select","Topic","Presales, Support, Billing, Partnerships, Order Enquiry, Other",[465,522,532,539,547,555,561],{"_uid":466,"equals":467,"fields":468,"component":521},"e21d97dd-e68e-4fa6-ba97-bc40f3041dde","Order Enquiry",[469],{"_uid":470,"body":471,"type":519,"title":13,"component":520},"b64992bc-6d53-48b8-b7a0-d81e5a062e50",{"type":324,"content":472},[473],{"type":327,"content":474},[475,477,485,487,489,490,495,497,502,510,512,517],{"text":476,"type":332},"We are ",{"text":478,"type":332,"marks":479},"Foxy.io",[480],{"type":481,"attrs":482},"link",{"href":483,"uuid":59,"anchor":59,"custom":484,"target":59,"linktype":31},"http:\u002F\u002FFoxy.io",{},{"text":486,"type":332},", an ecommerce platform powering ecommerce for other merchants. We do not sell products, and are unable to assist with questions about order statuses or refunds for any merchants using our platform. Please contact the merchant you ordered from for assistance. If you’d like to report a store using Foxy for fraudulent practices, please select ‘other’ in the subject.",{"type":488},"hard_break",{"type":488},{"text":491,"type":332,"marks":492},"NOTE:",[493],{"type":494},"bold",{"text":496,"type":332}," We are ",{"text":498,"type":332,"marks":499},"not ",[500],{"type":501},"italic",{"text":503,"type":332,"marks":504},"Foxy.in",[505,509],{"type":481,"attrs":506},{"href":507,"uuid":59,"anchor":59,"custom":508,"target":59,"linktype":31},"http:\u002F\u002FFoxy.in",{},{"type":501},{"text":511,"type":332},". We are not in any way affiliated with ",{"text":503,"type":332,"marks":513},[514],{"type":481,"attrs":515},{"href":507,"uuid":59,"anchor":59,"custom":516,"target":59,"linktype":31},{},{"text":518,"type":332},", and cannot help in any way with your order from that website.","danger","global___alert","form___condition",{"_uid":523,"equals":524,"fields":525,"component":521},"8765c3e1-25cf-44aa-b8ea-fc6094acf9c3","Presales",[526],{"_uid":527,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":530,"placeholder":13,"default_value":531},"cf464f8e-d643-4f6e-af29-d3abffaf7380","department_email_address","hidden",[],"hello@foxy.io",{"_uid":533,"equals":208,"fields":534,"component":521},"4007b6d8-77e5-421d-bd1e-6f336dd853fb",[535],{"_uid":536,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":537,"placeholder":13,"default_value":538},"7b4c6aa5-a68c-45e0-9ce1-0a36af10c0c2",[],"help@foxy.io",{"_uid":540,"equals":541,"fields":542,"component":521},"1dbb8f11-613d-43cd-9e09-1b94f6e19219","Billing",[543],{"_uid":544,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":545,"placeholder":13,"default_value":546},"a0ac0d1b-bc4f-4a6c-a682-581d450b0b73",[],"help+billing@foxy.io",{"_uid":548,"equals":549,"fields":550,"component":521},"a0a53a50-7172-4a29-ba58-181e38874e12","Partnerships",[551],{"_uid":552,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":553,"placeholder":13,"default_value":554},"7aa011d9-f374-4aed-b5a5-929b54aaf152",[],"partners@foxy.io",{"_uid":556,"equals":467,"fields":557,"component":521},"a4cd431f-25d5-41c7-bfdc-02c908c8fb47",[558],{"_uid":559,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":560,"placeholder":13,"default_value":531},"f5d52168-d6ae-451b-94ee-2ced1cbd28ad",[],{"_uid":562,"equals":563,"fields":564,"component":521},"25aba1ed-eb41-4bbc-aa89-f7a7167ea86e","Other",[565],{"_uid":566,"name":528,"type":529,"label":13,"options":13,"required":24,"component":453,"conditions":567,"placeholder":13,"default_value":531},"f40dfaef-c203-4b71-bf4e-e1b43cef192b",[],{"_uid":569,"component":570},"e9c53a05-f40a-4510-aaf8-bc072a235a0c","form___subject",{"_uid":572,"name":573,"type":574,"label":575,"options":13,"required":33,"component":453,"placeholder":13},"a4c4d385-fff4-4978-99fb-b68cfea623d6","message","textarea","Message",{"_uid":577,"name":578,"type":461,"label":579,"options":580,"required":33,"component":453,"conditions":581,"placeholder":13},"8a3c9f85-f438-427d-9c7a-d7b295a14b5b","existing_user","Are you an existing user?","No, Yes",[582],{"_uid":583,"equals":584,"fields":585,"component":521},"115933d6-262a-4b59-8fa8-579c5ad73de1","Yes",[586],{"_uid":587,"name":588,"type":332,"label":589,"options":13,"required":33,"component":453,"conditions":590,"placeholder":13},"44b6ff23-98f0-4e95-b7f5-c23e06415c2d","subdomain","Store Subdomain",[],{"_uid":592,"name":593,"type":461,"label":594,"options":595,"required":33,"component":453,"conditions":596,"placeholder":13},"922a5cef-3af2-4113-8855-36c7910e3ee3","user_type","What type of user are you?","Developer, Designer, Merchant",[],"POST",[599],{"_uid":600,"text":601,"title":610,"component":611},"7323b90d-a93a-4bf1-baa9-20d0b7ead61b",{"type":324,"content":602},[603],{"type":327,"content":604},[605,607,608],{"text":606,"type":332},"855.369.9227",{"type":488},{"text":609,"type":332},"9:30am-6pm Central M-F","Pre-sales, Sales, & Partnerships","contact___footer_column",{"type":324,"content":613},[614],{"type":327,"content":615},[616],{"text":617,"type":332},"Get in touch to get help from our friendly support team.","Submit","Success!","Your email has been received. We'll get back to you as soon as we can, but it might take a business day. If you don't hear back from us in a timely manner, please check your spam folder to ensure our reply didn't go there.",-80,[],"2fd9fb7d-a48a-4184-acfd-30022d8d6f08","2022-09-23T20:10:45.360Z",[],[288,627,656],{"name":628,"created_at":629,"published_at":630,"updated_at":631,"id":632,"uuid":633,"content":634,"slug":649,"full_slug":650,"sort_by_date":59,"position":651,"tag_list":652,"is_startpage":24,"parent_id":310,"meta_data":59,"group_id":653,"first_published_at":654,"release_id":59,"lang":65,"path":59,"alternates":655,"default_full_slug":59,"translated_slugs":59},"Checkout","2024-11-06T19:56:29.907Z","2026-07-02T22:04:34.438Z","2026-07-02T22:04:34.451Z",14898631,"60b73dc2-7635-487c-bd1f-fd7fba18ab4d",{"_uid":635,"icon":13,"name":628,"type":636,"guides":637,"pinned":24,"summary":638,"category":13,"component":297,"blog_posts":639,"content_hub":24,"icon_custom":640,"case_studies":642,"faq_sections":643,"help_articles":644,"featured_guides":645,"mailbox_category":13,"featured_articles":646,"featured_blog_posts":647,"featured_case_studies":648},"0a484217-201f-4f60-a813-d8d8bda736e4","simple",[],"How the checkout works, configuration options, customizations, and advanced integrations.",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":641},{},[],[],[],[],[],[],[],"checkout","help\u002Fcategories\u002Fcheckout",0,[],"b3bfcd1f-8386-4ed8-9218-2f4c2989a1b2","2024-11-06T19:56:44.870Z",[],{"name":657,"created_at":658,"published_at":659,"updated_at":660,"id":661,"uuid":412,"content":662,"slug":674,"full_slug":675,"sort_by_date":59,"position":676,"tag_list":677,"is_startpage":24,"parent_id":310,"meta_data":59,"group_id":678,"first_published_at":659,"release_id":59,"lang":65,"path":59,"alternates":679,"default_full_slug":59,"translated_slugs":59},"Custom Checkout Fields","2026-07-02T20:09:31.264Z","2026-07-02T20:10:29.634Z","2026-07-02T20:10:29.643Z",193877488751878,{"_uid":663,"icon":13,"name":657,"type":636,"pinned":24,"summary":664,"category":633,"component":297,"blog_posts":665,"icon_custom":666,"case_studies":668,"faq_sections":669,"featured_guides":670,"mailbox_category":13,"featured_articles":671,"featured_blog_posts":672,"featured_case_studies":673},"ce0f4c6a-abc9-4e6e-bf6e-74a6e0c769e8","Add, validate, and manage custom input fields on your checkout, from simple text inputs to multilingual and sensitive fields.",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":667},{},[],[],[],[],[],[],"custom-checkout-fields","help\u002Fcategories\u002Fcustom-checkout-fields",-570,[],"0254bc69-c069-4130-866c-ac97b8f25471",[],{},1784742856244]