Can leverage the API_URL constant somehow in the builder context so the form derives the URL instead of hardcoding it

Technical Questions
1

I have created Contact form in content model and form details passing /sending to backend API on submit action in custom code .
fetch(“https://abc.dev.azurewebsites.net/v1/forms”, {
method: “POST”,
body: formData
})
.then(() => {
document.getElementById(‘contactUsForm’).reset();
state.formSuccess = true
setTimeout(() => {
state.formSuccess = false
}, 5000)
})
.catch(e => {
state.formError = e.message
}).finally(() => {
submitButton.disabled = false;
});

so I don’t wanted to make it hardcode .
can leverage the API_URL constant somehow in the builder context so the form derives the URL instead of hardcoding it.

2

Hello @sanket.pokale,

To configure your contact form’s API URL dynamically within Builder, you can leverage Builder’s custom fields. Here’s how you can do it:

  1. Add a Custom Field to the Model:
  • Go to your Models.
  • Select the model for which you want to add the custom field (e.g., Contact Form).
  • Click “Edit Fields”.
  • Click “+ New Field”.
  • Name the field (e.g., apiEndpoint).
  • Set the field type to URL.
  • Save the model.
  1. Use the Custom Field in Your Form Code: You can fetch the value of the custom field in your form submission code from context object, to know more you can refer to the following forum post Is it possible to access Page Fields in data bindings? - #4 by nicke920

Hope this helps!

Thanks,

3

suppose I wanted to use for another model wanted to make it global as base URL.

4

Hello @sanket.pokale,

In that case, I would recommend using symbols. Symbols in Builder allow you to create reusable blocks of content that you can include in various parts of your site, and they can contain custom fields that you define, such as a base URL.

5

I Got solution I am taking from context.