# Sending Successful Form Submission

![](https://107069962-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M0QGDMRD8y_Kd-BpOvT%2F-MYJJyBGThO13UTEyTtE%2F-MYJKReaM-vsWpZagmk7%2Fimage.png?alt=media\&token=e6d7dcc0-3983-4909-96f7-9c2d653e80fb)

If you configured sending successful form submission on the dashboard, and you're using the JS SDK (`cotter` or `cotter-react`), you can add the following to your success function:

{% tabs %}
{% tab title="`cotter` JS SDK" %}

```javascript

import Cotter, { CotterEnum } from 'cotter';

var cotterApiKeyID = "<YOUR_API_KEY_ID>"
var cotter = new Cotter(cotterApiKeyID); // 👈 Specify your API KEY ID here
var formID = "form_default"
cotter
  .withFormID(formID) // Use customization for form "form_default"
  .signInWithLink() // Sign In with Magic Link
  .showPhoneForm() // Send Magic Link via Phone Number
  .then((resp) => {   
  
      // == 
      // RUN SUCCESSFUL FORM SUBMISSION 
      // SETUP THAT YOU HAVE IN THE DASHBOARD 
      // ==
      fetch(`${CotterEnum.WorkerURL}/completion/form?form-id=${encodeURIComponent(formID)}`,{
          method: "POST",
          headers: {
            API_KEY_ID: cotterApiKeyID,
            "Content-type": "application/json",
          },
          body: JSON.stringify(resp),
        }).then((_) => {
            window.location.href = "/protected";// redirect to the protected page
        })       
      // == 
      
  })
  .catch(err => {
    console.log(err) // handle error
  });
```

{% endtab %}

{% tab title="`cotter-react` React SDK" %}

```jsx
import { LoginForm } from "cotter-react";
import { CotterEnum } from 'cotter';
//...

const onSuccess = (resp) => {
  // == 
  // RUN SUCCESSFUL FORM SUBMISSION 
  // SETUP THAT YOU HAVE IN THE DASHBOARD 
  // ==
  fetch(`${CotterEnum.WorkerURL}/completion/form?form-id=${encodeURIComponent(formID)}`,{
      method: "POST",
      headers: {
        API_KEY_ID: cotterApiKeyID,
        "Content-type": "application/json",
      },
      body: JSON.stringify(resp),
    }).then((_) => { 
        window.location.href = "/protected";// redirect to the protected page
    })       
  // == 
}

//...
<LoginForm
  type="EMAIL" // - EMAIL or PHONE
  authMethod="MAGIC_LINK" // - OTP or MAGIC_LINK
  onSuccess={onSuccess} // - A function that runs after the login/signup is successful
  onError={(err) => console.log(err)} // - A function that runs if the login/signup encountered an error
  width={340} // - Width & height of the form
  height={300} //  Recommended at least 300x300
  formID={"form_default"}
/>
```

{% endtab %}
{% endtabs %}