# Ajax jquery Error cakephp 3.6.10 (Solved)

**URL:** <https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686>\
**Category:** Need Help\
**Created:** [August 8, 2018, 4:26pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686 "2018-08-08T16:26:03Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![joserafael](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/joserafael/32/285_2.png) [@joserafael](https://discourse.cakephp.org/u/joserafael)\
**Post date:** [August 8, 2018, 4:26pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/1 "2018-08-08T16:26:03Z")

</div>

Hello. Im making a simple select change. But I have a problem ang getting the following error:

Error: [Cake\Http\Exception\InvalidCsrfTokenException] CSRF token mismatch.

This is my function on the controller:

public function municipios() {

```
    $this->viewBuilder()->layout('ajax');
   $this->LoadModel('Municipios');
    $subregion = $this->request->getData['subregion_id'];
    

        $municipios = $this->Municipios->find('list',[
            'limit' => 200,

            'conditions' => ['Municipios.subregion_id' => $subregion],
            'contain' => ['Subregiones']

           ]);

        $this->set(compact('municipios'));
        $this->set('_serialize', 'municipios');

    }

```

This is my jquery ajax:

```
$(document).ready(function () {
    $("#subregion-id").bind("change",
    function (event) {
      $.ajax({
    async:true,
    data: $("#subregion-id").serialize(),
    dataType:"html",
    success:
    function (data, textStatus) {
      $("#municipio-id").html(data);
      },
      type:"post", url:"\/lavaderos\/municipios"});
  return false;
      });
  });

```

I read on the documentation that need a token but I dont know how to do it.

That code work fine in 3.5.x but no in 3.6.x

Thank you

---

<div class="post-metadata">

**Author:** ![rrd](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/rrd/32/113_2.png) [@rrd](https://discourse.cakephp.org/u/rrd)\
**Post date:** [August 8, 2018, 5:24pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/2 "2018-08-08T17:24:57Z")

</div>

This may help  
[https://book.cakephp.org/3.0/en/controllers/components/csrf.html#csrf-protection-and-ajax-requests](https://book.cakephp.org/3.0/en/controllers/components/csrf.html#csrf-protection-and-ajax-requests)

---

<div class="post-metadata">

**Author:** ![joserafael](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/joserafael/32/285_2.png) [@joserafael](https://discourse.cakephp.org/u/joserafael)\
**Post date:** [August 8, 2018, 7:21pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/3 "2018-08-08T19:21:55Z")

</div>

Thanks rdd. Not woking ☹

---

<div class="post-metadata">

**Author:** ![elhotrod](https://avatars.discourse-cdn.com/v4/letter/e/cab0a1/32.png) [@elhotrod](https://discourse.cakephp.org/u/elhotrod)\
**Post date:** [August 8, 2018, 7:35pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/4 "2018-08-08T19:35:49Z")

</div>

are you using CSRF in your application ? if so you need to read the CSRF component with javascript in order to submit the post ajax request from jQuery !

---

<div class="post-metadata">

**Author:** ![joserafael](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/joserafael/32/285_2.png) [@joserafael](https://discourse.cakephp.org/u/joserafael)\
**Post date:** [August 8, 2018, 7:49pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/5 "2018-08-08T19:49:08Z")

</div>

No, only I need filter a select like countries states. Work fine in cakephp 3.5.

---

<div class="post-metadata">

**Author:** ![elhotrod](https://avatars.discourse-cdn.com/v4/letter/e/cab0a1/32.png) [@elhotrod](https://discourse.cakephp.org/u/elhotrod)\
**Post date:** [August 8, 2018, 8:05pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/6 "2018-08-08T20:05:55Z")

</div>

you must get an error. what does your logs look like? see in the error logs. You may find the answer there !

---

<div class="post-metadata">

**Author:** ![joserafael](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/joserafael/32/285_2.png) [@joserafael](https://discourse.cakephp.org/u/joserafael)\
**Post date:** [August 8, 2018, 9:46pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/7 "2018-08-08T21:46:54Z")

</div>

Error log:

```
2018-08-08 10:04:28 Error: [Cake\Http\Exception\InvalidCsrfTokenException] CSRF token mismatch.
Request URL: /lavaderos/municipios
Referer URL: http://localhost:8765/lavaderos/add

```

I dont Know what is “CSRF token mismatch”, first time that happen.

The function and the jquery script previosly mentioned work fine in cakephp 3.5.x but not working on 3.6.10

---

<div class="post-metadata">

**Author:** ![elhotrod](https://avatars.discourse-cdn.com/v4/letter/e/cab0a1/32.png) [@elhotrod](https://discourse.cakephp.org/u/elhotrod)\
**Post date:** [August 8, 2018, 10:37pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/8 "2018-08-08T22:37:07Z")

</div>

Like I said before, you have to read the CSRF to send in your post request from $.ajax() so your controller reads it and treats your request as a legit request from the web-app. I am not sure if cakePhP 3.6 has the CSRF component loaded by default. Check the resources on the website about the CSRF component.

[https://book.cakephp.org/3.0/en/controllers/components/csrf.html](https://book.cakephp.org/3.0/en/controllers/components/csrf.html)

Ultimately, try to disable the component on your controller just for testing purposes, I DO NOT RECOMMEND to disable it on production.

```
public function beforeFilter(Event $event)
{
    $this->getEventManager()->off($this->Csrf);
}
```

---

<div class="post-metadata">

**Author:** ![joserafael](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.cakephp.org/joserafael/32/285_2.png) [@joserafael](https://discourse.cakephp.org/u/joserafael)\
**Post date:** [August 10, 2018, 6:44pm UTC](https://discourse.cakephp.org/t/ajax-jquery-error-cakephp-3-6-10-solved/4686/14 "2018-08-10T18:44:52Z")

</div>

I found the solution. Just add new line in jquery script:

```auto
$(document).ready(function () {
    $("#subregion-id").bind("change",
    function (event) {
      $.ajax({
    async:true,
    data: $("#subregion-id").serialize(),
    dataType:"html",
    beforeSend: function (xhr) { // Add this line
        xhr.setRequestHeader('X-CSRF-Token', $('[name="_csrfToken"]').val());
    }, // Add this line
    success:function (data, textStatus) {
      $("#municipio-id").html(data);
    },
      type:"post", url:"\/lavaderos\/municipios"});
  return false;
      });
  });

```