# Vanilla JS Ajax - Request and method problems

**URL:** <https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088>\
**Category:** Questions\
**Tags:** v2\
**Created:** [September 24, 2015, 10:39am UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088 "2015-09-24T10:39:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![jenstornell](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jenstornell/32/546_2.png) [@jenstornell](https://forum.getkirby.com/u/jenstornell)\
**Post date:** [September 24, 2015, 10:39am UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088/1 "2015-09-24T10:39:19Z")

</div>

I have stopped using jQuery. It feels nice to save 85 kB on each pageload. However I have an ajax problem.

### Old jQuery Ajax

This was about what my old jQuery ajax looked like.

```js
$.ajax({
    method: "POST",
    url: 'ajax',
    data: {
        data: test
    },
    success : function(response) {
	console.log(response);
    }
});

```

### My new ajax call

```js
var request = new XMLHttpRequest(); 
request.open("POST", "ajax", true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.onreadystatechange = function () {
    if (request.readyState != 4 || request.status != 200) return; 
    console.log( request.responseText );
};
request.send('data=test');

```

### 1. Request ajax don’t work

This works with jQuery but not with vanilla (plain) javascript.

```php
if( kirby()->request()->ajax() )

```

Why does the above don’t work with `kirby()->request()->ajax()`. The ajax call is working fine without it.

### 2. Method POST don’t work

Method POST don’t work with vanilla JS. However I can use `'method' => 'ALL'` but I would prefer just POST like before.

---

<div class="post-metadata">

**Author:** ![lukasbestle](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/lukasbestle/32/11437_2.png) [@lukasbestle](https://forum.getkirby.com/u/lukasbestle)\
**Post date:** [September 24, 2015, 11:39am UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088/2 "2015-09-24T11:39:21Z")

</div>

> [@jenstornell](#):
>
> Why does the above don’t work with kirby()-\>request()-\>ajax().

Because the vanilla XMLHttpRequest does not add the necessary `X-Requested-With` header by default. The following line should make it work:

```js
request.setRequestHeader('X-Requested-With','XMLHttpRequest');

```

> [@jenstornell](#):
>
> Method POST don’t work with vanilla JS.

What do you mean by “does not work”?

---

<div class="post-metadata">

**Author:** ![jenstornell](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jenstornell/32/546_2.png) [@jenstornell](https://forum.getkirby.com/u/jenstornell)\
**Post date:** [September 24, 2015, 11:53am UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088/3 "2015-09-24T11:53:57Z")

</div>

Great! That solved it all, both questions.

---

<div class="post-metadata">

**Author:** ![lukasbestle](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/lukasbestle/32/11437_2.png) [@lukasbestle](https://forum.getkirby.com/u/lukasbestle)\
**Post date:** [September 24, 2015, 12:44pm UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088/4 "2015-09-24T12:44:00Z")

</div>

Great!

PS: Your forum threads are always very detailed and easy to understand and solve. I think that the last step to the solution is not very far: Taking a look into the Kirby source code. Because that’s often what I do.

---

<div class="post-metadata">

**Author:** ![distantnative](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/distantnative/32/11319_2.png) [@distantnative](https://forum.getkirby.com/u/distantnative)\
**Post date:** [February 6, 2025, 5:00pm UTC](https://forum.getkirby.com/t/vanilla-js-ajax-request-and-method-problems/2088/5 "2025-02-06T17:00:28Z")

</div>