Hot answers tagged

21 votes
Accepted

How can I use CSRF protection with AJAX routes?

Disabling the CSRF protection is probably a bad idea... it's in there for a reason. But you can easily add your CSRF data to an AJAX call, and it works very well! The key is to make your CSRF token ...
  • 23.6k
10 votes

How can I use CSRF protection with AJAX routes?

This is the syntax for Craft 3: <script type="text/javascript"> window.csrfTokenName = "{{ craft.app.config.general.csrfTokenName }}"; window.csrfTokenValue = "{{ craft.app.request....
  • 1,932
10 votes
Accepted

How to load entries via ajax when a filter is clicked?

There's a ton of ways to pull this off, but in my opinion setting up pages/URLs for each category is probably a good idea, for SEO and sharing reasons. It's not something that requires a lot of work ...
9 votes
Accepted

Updating a user on the front end with Vue.js and Axios

Unlike Vue Resourse (if you've used it), Axios does not have a good way to emulateJSON on legacy servers or frameworks that do not understand submissions sent as application/json. Your data gets to ...
  • 1,623
8 votes
Accepted

Searching a specific section by four different types of parameters?

One method is to build your params before performing the search. {# set base params #} {% set params = { section: 'portfolio', limit: null } %} {% set relatedParams = ['and'] %} {# status #} ...
8 votes

Basic ajax - how to?

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 ...
7 votes
Accepted

How to load entry-objects with Ajax

Is it best to use jQuery for the Ajax-request?` Not necessarily. jQuery provides an easy-to-use ajax function, but nowadays it's perfectly simple to make an AJAX call with vanilla JS. How can I ...
  • 3,400
7 votes
Accepted

Update Commerce Cart using Ajax

Yes, you can do all the normal commerce actions via ajax. A basic recipe is this... HTML: <form method="POST" id="addToCartForm"> {{ getCsrfInput() }} <input type="...
6 votes

How can I set the HTTP status code?

I believe HeaderHelper::setHeader() is what you're looking for in the context of a plugin.
  • 66.5k
6 votes

How can I set the HTTP status code?

In Craft3, the correct way of setting HTTP status codes is Craft::$app->getResponse()->setStatusCode(404);
6 votes

How do i setup ajax paging for entries

Thanks to Kieth for posting an ajax solution. I just wanted to expand on it a little bit to figure out when we are at the end of the entries etc so we can hide loading more buttons etc. Here is what I ...
  • 801
6 votes
Accepted

AJAX page transitions with history.pushState

So I just went through my article step-by-step and I indeed missed adding the new content into $main. I think there may have been a versioning mistake in the article's code as I definitely tested it. ...
  • 525
5 votes
Accepted

Delete items from frontend with ajax

That looks perfect! Obviously this code doesn't prompt the user to confirm deletion, but that can easily be added. (Or perhaps you stripped that out of your example.) You are specifically doing two ...
  • 23.6k
5 votes
Accepted

How do you correctly handle errors using PT Contact Form when submitting via AJAX?

If you want the error messages to be displayed identical to P&T's template/macro default, this should do the trick: $(function(){ $('#ajax-form').submit( function(ev) { // Prevent ...
5 votes
Accepted

Ajax front-end user registration form - not returning JSON

EDIT Craft 2.4 is now available, and the users/saveUser action will now return a JSON response for AJAX requests. The original answer is still valid for <2.4 builds: No, there's no way to ...
5 votes
Accepted

Search Contact Person Plugin via Ajax

It's actually quite easy and you don't really need json or a plugin to do it. If you really need it as a plugin, then that's a whole different thing that would need a separate answer. In your search ...
5 votes
Accepted

What is the best way to append CSRF token without using a form?

You need to pass the token and name into javascript. Easiest is to just have a script tag somewhere. <script type="text/javascript"> window.csrfTokenName = "{{ craft.config.csrfTokenName }}"...
  • 1,332
5 votes
Accepted

Possible to change locale in PHP?

I think I got this resolved the proper way... looks like you just need to make sure that your AJAX calls are localized. In my main _layout template: <script type="text/javascript"> window....
  • 23.6k
5 votes
Accepted

Craft 3 - ajax request to plugin

95% of the time you see a 400 Bad Request error, it's because it's a CSRF token validation error (or you're just missing the token all-together). Craft 3 has CSRF validation enabled by default. Here'...
  • 66.5k
5 votes
Accepted

Load More Entries Button

The Sprig plugin will save you a lot of trouble, and dynamically loading more entries is a perfect use-case for it. If you prefer to use jQuery, then by all means do so, but keep in mind that it is ...
  • 6,401
4 votes
Accepted

Is there a way to divide an entry's data into multiple subviews with unique URLs?

Disclaimer: I haven't ever used structure, but hopefully the method described below also works for that section type. You can do this quite easily with URL-segments Consider a URL like so: http://...
  • 1,332
4 votes
Accepted

Twig Filter in Plugin/PHP?

In one of your plugin services, you can render a template that handles the markdown filter and return the results as an HTML string. You can then send that HTML to wherever you want to preview. In ...
4 votes

Using ajax with routes is it right?

Sure, you can do something like {% if not craft.request.isAjax() %} {% redirect siteUrl %} {% endif %}
  • 4,519
4 votes
Accepted

Sort / Order Entries on select or button click

Okay so you can either do this through ajax or through a page reload, a page reload is going to be much easier, but you can get it to work without reloading the page... Reloading the page You can ...
  • 4,519
4 votes
Accepted

How to check for new entries periodically from the front-end?

This is actually a pretty simple task. Create a template that your JS will reach out to returning the total number of entries. First create a template folder called "ajax" with an index.html file ...
  • 231
4 votes
Accepted

Call plugin controller from frontend with ajax

I found the solution by making an application of Front end login form with ajax and Posting to controller actions. Here is what is really important to understand with Craft controller call: Most ...
  • 972
4 votes

What is the best way to append CSRF token without using a form?

This is the syntax for Craft 3: <script type="text/javascript"> window.csrfTokenName = "{{ craft.app.config.general.csrfTokenName }}"; window.csrfTokenValue = "{{ craft.app.request....
  • 1,932
4 votes
Accepted

How can I call a controller method from the front-end using ajax

Make sure to check out the documentation on routing. Pay special attention to the part about action request(s). In this example, I want to call a controller method via ajax on page load. ...
  • 4,696
4 votes
Accepted

Ajax Post to guestEntries/saveEntries from another domain

TL;DR: Turns out this was an issue with my apache config on the Craft instance. Explanation: I did a little digging around the GuestEntriesController.php file and noticed that Craft was not picking ...
4 votes

How can I use Ajax function in Craft CMS?

Since Craft makes no assumptions about the front-end content of your website, it's 100% up to you on how you want to implement AJAX functionality on your site. So it wouldn't be any different if you ...
  • 66.5k

Only top scored, non community-wiki answers of a minimum length are eligible