# Double records when sending a form and CORS error thrown on the console

**URL:** <https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054>\
**Category:** Product Support\
**Created:** [December 5, 2017, 6:15pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054 "2017-12-05T18:15:02Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 5, 2017, 6:15pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/1 "2017-12-05T18:15:02Z")

</div>

Hey guys. I have this issue when sending a form from my website to mautic.  
  
  
  
I basically adapted the HTML markup from the “manual copy” after creating the form.  
  
Problem is:

1. when I hit the submit button, Mautic gets the same data two times.  
2. The developer tools console from Chrome shows me this message:  
  
“Failed to load [https://mautic.outpay.io/form/submit?formId=4:](https://mautic.outpay.io/form/submit?formId=4:) No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘[https://outpay.io](https://outpay.io)’ is therefore not allowed access.”  
  
  
  
I already disabled the CORS on settings but it doesn’t worked. ![=(]( "=(")  
  
  
  
Can someone help?  
  
  
  
Thank you.  
  
  
  
On the I pasted the code:

Code:

  
And, on the I pasted and adapted this code:  

Code:

# Receba nosso informativo e ofertas exclusivas por email!

```
                       <div id="mauticform_sitehomeinformativo_nome" data-validate="nome" data-validation-type="text" class="mauticform-row mauticform-text mauticform-field-1 mauticform-required">
                          <input id="mauticform_input_sitehomeinformativo_nome" name="mauticform[nome]" value="" placeholder="Seu Nome" class="mauticform-input Nome" type="text" />
                          <label for="" class="Nome"><span class="fo-p fo-perfil"></span></label>
                          <span class="mauticform-errormsg" style="display: none;">Nome obrigatório</span>
                       </div>

                       <div id="mauticform_sitehomeinformativo_email" data-validate="email" data-validation-type="email" class="mauticform-row mauticform-email mauticform-field-2 mauticform-required">
                          <input id="mauticform_input_sitehomeinformativo_email" name="mauticform[email]" placeholder="seu@email.com.br" class="mauticform-input Email" type="email" />
                          <label for="" class="Email"><span class="fo-p fo-email"></span></label>
                          <span class="mauticform-errormsg" style="display: none;">Por favor, digite um endereço de email válido</span>
                       </div>

                       <div id="mauticform_sitehomeinformativo_submit" class="mauticform-row mauticform-button-wrapper mauticform-field-3">
                          <button type="submit" name="mauticform[submit]" id="mauticform_input_sitehomeinformativo_submit" name="mauticform[submit]" class="mauticform-button btn btn-default Btn" value="1">Comece Já</button>
                       </div>

                    </div>
                 </div>
                 <input type="hidden" name="mauticform[formId]" id="mauticform_sitehomeinformativo_id" value="4"/>
                 <input type="hidden" name="mauticform[return]" id="mauticform_sitehomeinformativo_return" value=""/>
                 <input type="hidden" name="mauticform[formName]" id="mauticform_sitehomeinformativo_name" value="sitehomeinformativo"/>
              </form>
           </div></div>

```

  
On Jquey AJAX:  

Code:

$(document).ready(function(){ //Formulário de contato assíncrono let form = $('#mauticform\_sitehomeinformativo');

```
     $(form).submit(function(event){
        //evite a atualização da página
        event.preventDefault();

        //serialização das informações do formulário
        let formData = $(form).serialize();

        //AJAX
        $.ajax({
           type: 'POST',
           url: $(form).attr('action'),
           data: formData
        })
        .done(function(response){
           Alert('Você está em nossa lista!', 'sucesso');

           $('#mauticform_input_sitehomeinformativo_f_name').val('');
           $('#mauticform_input_sitehomeinformativo_email').val('');
        })
        .fail(function(data){
           Alert('Oops, houve um problema.', 'erro');
        });
     });
  });</div>

```

---

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 5, 2017, 6:15pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/2 "2017-12-05T18:15:02Z")

</div>

Hey guys. I have this issue when sending a form from my website to mautic.

I basically adapted the HTML markup from the “manual copy” after creating the form.  
Problem is:

1. when I hit the submit button, Mautic gets the same data two times.
2. The developer tools console from Chrome shows me this message:  
“Failed to load [https://mautic.outpay.io/form/submit?formId=4:](https://mautic.outpay.io/form/submit?formId=4:) No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘[https://outpay.io](https://outpay.io)’ is therefore not allowed access.”

I already disabled the CORS on settings but it doesn’t worked. =(

Can someone help?

Thank you.

On the I pasted the code:

```auto
<script type="text/javascript">
    / **This section is only needed once per page if manually copying** /
    if (typeof MauticSDKLoaded == 'undefined') {
        var MauticSDKLoaded = true;
        var head = document.getElementsByTagName('head')[0];
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'https://mautic.outpay.io/index.php/media/js/mautic-form.js';
        script.onload = function() {
            MauticSDK.onLoad();
        };
        head.appendChild(script);
        var MauticDomain = 'https://mautic.outpay.io/index.php';
        var MauticLang = {
            'submittingMessage': "Please wait..."
        }
    }
</script>
```

And, on the I pasted and adapted this code:

```auto
<div id="mauticform_wrapper_sitehomeinformativo" class="mauticform_wrapper Informativo">
                  <form autocomplete="false" role="form" method="post" action="https://mautic.outpay.io/form/submit?formId=4" id="mauticform_sitehomeinformativo" data-mautic-form="sitehomeinformativo" enctype="multipart/form-data">
                     <h1 class="--sublinhado --vermelho">Receba nosso informativo e ofertas exclusivas por email!</h1>
                     <div class="mauticform-innerform">
                        <div class="mauticform-page-wrapper mauticform-page-1" data-mautic-form-page="1">

                           <div id="mauticform_sitehomeinformativo_nome" data-validate="nome" data-validation-type="text" class="mauticform-row mauticform-text mauticform-field-1 mauticform-required">
                              <input id="mauticform_input_sitehomeinformativo_nome" name="mauticform[nome]" value="" placeholder="Seu Nome" class="mauticform-input Nome" type="text" />
                              <label for="" class="Nome"><span class="fo-p fo-perfil"></span></label>
                              <span class="mauticform-errormsg" style="display: none;">Nome obrigatório</span>
                           </div>

                           <div id="mauticform_sitehomeinformativo_email" data-validate="email" data-validation-type="email" class="mauticform-row mauticform-email mauticform-field-2 mauticform-required">
                              <input id="mauticform_input_sitehomeinformativo_email" name="mauticform[email]" placeholder="seu@email.com.br" class="mauticform-input Email" type="email" />
                              <label for="" class="Email"><span class="fo-p fo-email"></span></label>
                              <span class="mauticform-errormsg" style="display: none;">Por favor, digite um endereço de email válido</span>
                           </div>

                           <div id="mauticform_sitehomeinformativo_submit" class="mauticform-row mauticform-button-wrapper mauticform-field-3">
                              <button type="submit" name="mauticform[submit]" id="mauticform_input_sitehomeinformativo_submit" name="mauticform[submit]" class="mauticform-button btn btn-default Btn" value="1">Comece Já</button>
                           </div>

                        </div>
                     </div>
                     <input type="hidden" name="mauticform[formId]" id="mauticform_sitehomeinformativo_id" value="4"/>
                     <input type="hidden" name="mauticform[return]" id="mauticform_sitehomeinformativo_return" value=""/>
                     <input type="hidden" name="mauticform[formName]" id="mauticform_sitehomeinformativo_name" value="sitehomeinformativo"/>
                  </form>
               </div>
```

On Jquey AJAX:

```auto
$(document).ready(function(){
         //Formulário de contato assíncrono
         let form = $('#mauticform_sitehomeinformativo');

         $(form).submit(function(event){
            //evite a atualização da página
            event.preventDefault();

            //serialização das informações do formulário
            let formData = $(form).serialize();

            //AJAX
            $.ajax({
               type: 'POST',
               url: $(form).attr('action'),
               data: formData
            })
            .done(function(response){
               Alert('Você está em nossa lista!', 'sucesso');

               $('#mauticform_input_sitehomeinformativo_f_name').val('');
               $('#mauticform_input_sitehomeinformativo_email').val('');
            })
            .fail(function(data){
               Alert('Oops, houve um problema.', 'erro');
            });
         });
      });
```

---

<div class="post-metadata">

**Author:** ![bizcrony](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/bizcrony/32/409_2.png) [@bizcrony](https://forum.mautic.org/u/bizcrony)\
**Post date:** [December 5, 2017, 6:21pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/3 "2017-12-05T18:21:55Z")

</div>

@victormorettir you integrated both code on website , or you intergrate one code twice ? can you share the link

---

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 5, 2017, 6:32pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/4 "2017-12-05T18:32:10Z")

</div>

@bizcrony I used both code on the same page: the script in the , the html form in the and the ajax script on the bottom of the . All on the same page. Here’s the link: [https://outpay.io](https://outpay.io) (it’s on the index page). Thanks!

---

<div class="post-metadata">

**Author:** ![bizcrony](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/bizcrony/32/409_2.png) [@bizcrony](https://forum.mautic.org/u/bizcrony)\
**Post date:** [December 5, 2017, 6:34pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/5 "2017-12-05T18:34:52Z")

</div>

@victormorettir you should use only one code either HTML or Java,

---

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 5, 2017, 6:39pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/6 "2017-12-05T18:39:24Z")

</div>

The problem remains… do you have any clue on the  
“Failed to load [https://mautic.outpay.io/form/submit?formId=4:](https://mautic.outpay.io/form/submit?formId=4:) No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘[https://outpay.io](https://outpay.io)’ is therefore not allowed access.”  
error @bizcrony ?

---

<div class="post-metadata">

**Author:** ![bizcrony](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/bizcrony/32/409_2.png) [@bizcrony](https://forum.mautic.org/u/bizcrony)\
**Post date:** [December 5, 2017, 6:39pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/7 "2017-12-05T18:39:35Z")

</div>

@victormorettir give me form link, where form execute.

---

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 5, 2017, 6:53pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/8 "2017-12-05T18:53:32Z")

</div>

@bizcrony this form executes on the main home page. There is only one form on this page, which is on the very bottom of it.  
[https://drive.google.com/file/d/1lSPIb9v3f4TjMBLD9JQbvXLRAJabJaU9/view?usp=sharing](https://drive.google.com/file/d/1lSPIb9v3f4TjMBLD9JQbvXLRAJabJaU9/view?usp=sharing)

---

<div class="post-metadata">

**Author:** ![bizcrony](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/bizcrony/32/409_2.png) [@bizcrony](https://forum.mautic.org/u/bizcrony)\
**Post date:** [December 5, 2017, 7:03pm UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/9 "2017-12-05T19:03:11Z")

</div>

@victormorettir form is working , but does not says anything … why don’t you check my profile for better understanding.

---

<div class="post-metadata">

**Author:** ![victormorettir](https://avatars.discourse-cdn.com/v4/letter/v/a88e4f/32.png) [@victormorettir](https://forum.mautic.org/u/victormorettir)\
**Post date:** [December 12, 2017, 4:41am UTC](https://forum.mautic.org/t/double-records-when-sending-a-form-and-cors-error-thrown-on-the-console/10054/10 "2017-12-12T04:41:11Z")

</div>

Hi everyone, a quick update here.

I solved the issue. The problem was my JQuery ajax function competing with the native mautic script to send forms assynchronously.

I had inserted: the mautic script tag + the html markup for the form + a Jquery script to send the form. Because of that, I was getting doubled records on my mautic dashboard everytime someone clicked the submit button.

I solved this by deleting my JQuery ajax POST function and leting the Mautic script do it’s work lol.

The reason why I inserted the Jquery script is because I wanted to make an animated response when the form had been submited with a success response from the server. The native Mautic response inside the apropriate divs for this task is non-animatable (they use either a javascript “element.text” or an “element.innerHTML” property, which just inserts information inside that div).

The CORS problem is actually something from JQuery, they explain very clearly on [their documentation](https://api.jquery.com/jquery.post/), as follows:  
“Due to browser security restrictions, most “Ajax” requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol.”