<p>There is no real difference between a "normal" ajax request and an ajax request in Craft. You just leave the url blank, and insert an action parameter for your <a href="https://craftcms.com/docs/routing" rel="noreferrer">route</a>. Craft 3 uses <code>snake-case</code> routes instead of <code>camelCase</code>. So when you want to access your plugin you would do. </p>

<pre><code>action = "plugin-handle/controller-name/function-name
</code></pre>

<p>I full example as a CP request is</p>

<pre><code>var data = {
    action: 'form-builder/setting/get-settings-for-site',
    siteId: siteId
};
// include csrf token
var tokenName = Craft.csrfTokenName;
data[tokenName] = Craft.csrfTokenValue;
$.ajax({
    type: "post",
    url: '',
    data: data,
    success: function (response) {
            ...
    },
    error: function (XMLHttpRequest, textStatus) {
        console.log("Status: " + textStatus);
    }
});
</code></pre>

<p>This would access my <code>Form-builder</code> plugin. The controller is <code>SettingsController</code> and the action <code>actionGetSettingsForSite</code>. </p>

CC BY-SA 3.0
2018-03-12T12:42:33.290Z
Thank you Robin, you have been super helpful in getting me an understanding of Craft!
Eric Snyder
CC BY-SA 3.0
2018-03-12T13:05:10.097Z
If you were able to create an ajax request you can mark the question as solved
Robin Schambach
CC BY-SA 3.0
2018-03-12T07:50:47.393Z
2018-03-12T07:50:47.393Z
Robin Schambach
<p>I am new to Craft. I have done some ajax in the distant past. I have searched this forum and see lots of issues with ajax but it seems that there are a lot of different approaches. Craft docs have very little on Ajax.</p>

<p>I am wondering if there is a clear tutorial on doing ajax within craft. I have an address field set up and would like to click a button to retrieve all entries in a certain state and replace currently displayed data with the new data.</p>

<craft3><ajax>
Basic ajax - how to?
# Basic ajax - how to?

(Asked by: username_0 on 2018-03-12)

I am new to Craft. I have done some ajax in the distant past. I have searched this forum and see lots of issues with ajax but it seems that there are a lot of different approaches. Craft docs have very little on Ajax.

I am wondering if there is a clear tutorial on doing ajax within craft. I have an address field set up and would like to click a button to retrieve all entries in a certain state and replace currently displayed data with the new data.

**Tags:** craft3, ajax

---

## 1 answers

### Answer by username_1 on 2018-03-12. Score: 8

There is no real difference between a "normal" ajax request and an ajax request in Craft. You just leave the url blank, and insert an action parameter for your route. Craft 3 uses snake-case routes instead of camelCase. So when you want to access your plugin you would do. 
action = "plugin-handle/controller-name/function-name

I full example as a CP request is
var data = {
    action: 'form-builder/setting/get-settings-for-site',
    siteId: siteId
};
// include csrf token
var tokenName = Craft.csrfTokenName;
data[tokenName] = Craft.csrfTokenValue;
$.ajax({
    type: "post",
    url: '',
    data: data,
    success: function (response) {
            ...
    },
    error: function (XMLHttpRequest, textStatus) {
        console.log("Status: " + textStatus);
    }
});

This would access my Form-builder plugin. The controller is SettingsController and the action actionGetSettingsForSite.

> **Comments:**
> **username_0**: Thank you Robin, you have been super helpful in getting me an understanding of Craft!  
> **username_1**: If you were able to create an ajax request you can mark the question as solved  

---

