2

I'm building a JSS App and need to set up a basic contact form (sends an email). Since I'm using Sitecore 9.1, Sitecore Forms is unavailable in JSS.

How do I set up an endpoint in Sitecore to send an email?

For example, if I wanted an endpoint (mysite.com/contact/submit) to handle the POST of the HTML form. How and where do I set that up?

Any information on this will be very helpful, thank you!

1

It is feasible and you just need to expose the API. So, on your react component, you will have a button whereby you will bind it to a function.

In that particular function, you can use Axio to call your endpoint (contact/submit).

Then, it is pretty much straight forward. You need to implement the API and register it in Sitecore so that when the url mysite.com/contact/submit is called, it will go through your WebApi Controller and perform the action.

Below is a code snippet example used to call an API from ReactJS and its implementation. Note that I had removed unnecessary code for brevity.

The ReactJS Component

handleSubmit = () => {
    //get the parameters to be passed to the API. In my case

    axios({
        url: '/contact/submit',
        method: 'POST',
        data: yourData
    }).then(result => {

        if (!result.data){
            return;
        }

        const resultObject = JSON.parse(result.data.result);

        //Process your result here using the resultObject
    })
}

WebApi Implementation

public class FormSubmitApiController : ApiController
{
    [HttpPost]
    public IHttpActionResult SubmitAction(YourModelType model)
    {
        // Your implementation goes here

        return this.Ok();
    }
}

Route Registration

public class RouteRegistration
{
    public virtual void Process(PipelineArgs args)
    {
        GlobalConfiguration.Configure(WebApiConfig.Register);
    }
}

public class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.Routes.MapHttpRoute(
            name: "SubmitForm",
            routeTemplate: "contact/submit",
            defaults: new { controller = "FormSubmitApi", action = "SubmitAction" });
    }
}

Finally, you need to register the route to Sitecore by adding a configuration patch file.

<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/">
  <sitecore>    
    <pipelines>
      <initialize>
        <processor type="YourNamespace.RouteRegistration, YourAssemblyName" patch:after="processor[@type='Sitecore.PathAnalyzer.Services.Pipelines.Initialize.WebApiInitializer, Sitecore.PathAnalyzer.Services']" />
      </initialize>
    </pipelines>
    <api>
      <services>
        <configuration type="Sitecore.Services.Infrastructure.Configuration.ServicesConfiguration, Sitecore.Services.Infrastructure">
          <allowedControllers hint="list:AddController">
            <allowedController desc="FormSubmitApiController">YourNamespace.FormSubmitApi, YourAssemblyName</allowedController>
          </allowedControllers>
        </configuration>
      </services>
    </api>
  </sitecore>
</configuration>
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.