25
votes
Accepted
How to enable AJAX for the the 'Add to Cart' button of product widgets in Magento 2?
You have to override addtocart.phtml file
app/design/frontend/vendorname/themename/Magento_Catalog/templates/product/view/addtocart.phtml
Now Just Replace "bindSubmit": false to "bindSubmit": true
&...
- 22.9k
24
votes
Accepted
How to make a simple ajax call in Magento 2.1.0
below is the example how to do this, Please modify it according to your requirement.
I used js template for this.
Following example will create drop down in your phtml file using ajax functionality.
...
- 1,116
24
votes
How to render HTML with AJAX in Magento 2
I would also go the way 2 and, indeed, you actually can render "pure" HTML via AJAX without the head, body, css and so on.
The trick is to:
tell your controller to instanciate a Response that is of ...
- 545
22
votes
Accepted
Magento 2: How to send data using Ajax form in custom form?
You can just set below code in your phtml file to use ajax,
You have to change your customurl in below code,
<script type="text/javascript">
require(["jquery"],function($) {
$(...
- 42.4k
20
votes
Magento 2 : Show loader till all ajax call not completed
You can try below ajax call for showing loader during ajax call is runnig.
jQuery.ajax({
url: url,
type: 'POST',
dataType: 'json',
showLoader: true //use for display loader
}).done(...
- 2,392
20
votes
Magento 2: How to send data using Ajax form in custom form?
Accepted answer is good, but i think could be useful take advantage of the js validation that magento core offers.
So, try to use below js script:
<script type="text/javascript">
require([
"...
- 2,332
19
votes
Accepted
How to update minicart view using AJAX?
You can try the below code.
require([
'Magento_Customer/js/customer-data'
], function (customerData) {
var sections = ['cart'];
customerData.invalidate(...
- 15.9k
16
votes
Accepted
Magento 2 - Send form data to Controller using AJAX and return Result to PHTML
Calculation Layout -
Vendor/Module/view/frontend/layout/module_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column"
xsi:...
- 6,465
13
votes
Accepted
Magento 2 : How do I create my own action in controller to call url from Ajax in Magento 2.x
You can use the code below your own Action in controller to call url from Ajax.
Using phtml file.
In your (Like vendor/module/Block/Example.php) block put below code.
public function getAjaxUrl(){
...
- 1,511
13
votes
Accepted
Retreive and return response from controller in magento2
ajax
<script>
require(['jquery', 'jquery/ui'], function($){
$.ajax({
method: "POST",
url: "<?php echo $block->getUrl('modulanefrontname/ajax/search'); ?>",...
- 32.5k
12
votes
Accepted
Return bool gives error "Invalid return type" for Ajax Controller
Try this example:
protected $resultJsonFactory;
/**
* @param Context $context
* @param \Magento\Framework\Controller\Result\JsonFactory $resultJsonFactory
*/
public function __construct(
...
- 16.2k
12
votes
Magento 2 automatically appends form key at the end of my ajax call
Magento 2 adds the form key and the isAjax by using jQuery's beforeSend handler. to remove it override the beforeSend handler with and empty function for example.
You can also put the form_key in the ...
- 176
10
votes
Accepted
Magento 2 : Modal Popup using Ajax
define([
'jquery',
'Magento_Ui/js/modal/modal'
], function ($,example,modal) {
var options = {
type: 'popup',
responsive: true,
innerScroll: true,
...
- 1,511
9
votes
Accepted
How to submit a form to controller using ajax with magento 2 validation
Try this:
if (jQuery('#donation-request-form').valid()) {
jQuery.ajax({
type : 'POST',
url : customurl,
data : jQuery('#donation-request-form').serialize(),
success: function(msg){...
- 1,328
9
votes
How to update cart qty using ajax Magento 2
Reload totals cart after ajax change quantity
1. Step
In your custom them create ( Magento_Theme/layout/checkout_cart_index.xml )
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ...
- 1,589
9
votes
Accepted
Invalid form key while making an ajax request in Admin panel in Magento 2.3
Please try to update below your script code :
<script type="text/javascript">
require([
"jquery"
], function($){
$('#submit-button').on('click',function(){
...
- 2,637
8
votes
Retreive and return response from controller in magento2
Try with below code in controller,
<?php
namespace Vendor\Modulename\Controller\Index;
use Magento\Framework\Controller\ResultFactory;
class Custom extends \Magento\Framework\App\Action\...
- 42.4k
8
votes
Magento 2: How shipping rest api function called On Checkout?
As you pointed out, when you click "Ship here" a HTTP POST request is dispatched to "/V1/carts/mine/estimate-shipping-methods-by-address-id" REST API (from module-quote).
If you take a look at module-...
- 1,460
8
votes
Magento 1.9.3.3 - How do you return a JSON array from a controller to ajax
use this one.
public function suburbSearchAction()
{
/* Get Suburb text from POST Request */
$suburbNameQuery = $this->getRequest()->getParam('inputSuburbData');
/*...
- 2,094
8
votes
Accepted
Magento 2 - Add to cart not working after products loaded by ajax
I found the solution of this one few times ago but forgot to post it. I just add this line in my ajax request success case jQuery( "form[data-role='tocart-form']" ).catalogAddToCart();
require([
'...
- 8,742
7
votes
How to enable AJAX for the the 'Add to Cart' button of product widgets in Magento 2?
You can extend the Catalog Products List to use the ajax cart by creating a module with the following files:
/Your/Module/Block/Product/ListBlock.php with content:
<?php
namespace Your\Module\...
- 9,009
7
votes
Accepted
Magento 2 : Update Cart summary html
Update cart summary in ajax response has been solved, we need to call getTotalsAction() javascript function as i mentioned below code :
demo.js
define([
'jquery',
'Magento_Checkout/...
- 315
7
votes
Accepted
Magento 2 - Ajax is not calling Controller
Error 500 (internal server error) - something went wrong on the server side.
We need to add use Magento\Framework\App\Action\Context at the first of class. Or, change Context to Magento\Framework\...
- 32.2k
7
votes
how to call controller using ajax in admin backend magento 2
Our Ajax response should return the key values. We can create an Admin controller like:
app/code/Vendor/Module/Controller/Adminhtml/CustomAjax/Index.php
<?php
namespace Vendor\Module\Controller\...
- 32.2k
7
votes
Accepted
Magento2 - Ajax Add to Cart - Out of stock situation - Stop redirect and show message dynamically
In order to achieve this, you need to follow these steps:
1) Override Magento2 default theme js file by copying it from this path: vendor/magento/module-catalog/view/frontend/web/js/catalog-add-to-...
- 232
7
votes
Magento 2: how to send ajax request in knockout js?
Use mage/storage for ajax call in knockoutjs
define(
[
...
'mage/storage'
...
],
function(
...
storage
...
) {
return ...
- 22.9k
7
votes
How to get the Quote Id from Masked Quote Id (QuoteIdMask) in magento 2
Since 2.3 version of Magento you can use the \Magento\Quote\Model\MaskedQuoteIdToQuoteIdInterface::execute(string $maskedQuoteId) to obtain a real quote id (int):
<?php
namespace Vendor\Module\...
- 16.2k
7
votes
Accepted
Plus, Minus, automatic cart update on Magento 2.3.3
Override default.html from
vendor\magento\module-checkout\view\frontend\web\template\minicart\item\default.html
to
app\design\yourvendor\yourtheme\Magento_Checkout\web\template\minicart\item\...
- 3,230
6
votes
Accepted
Add to cart issue - Magento 2.1
Should add more validation:
vendor/magento/module-catalog/view/frontend/web/js/catalog-add-to-cart.js
_bindSubmit: function() {
var self = this;
this.element.mage('validation'...
- 32.2k
6
votes
Magento 2 : Add to compare and add to wishlist with ajax
I have added Ajax add to wishlist functionality on product page following below method:
Added custom "Add to wishlist" button to following file inside <?php if ($block->isWishListAllowed()) : ?&...
- 7,066
Only top scored, non community-wiki answers of a minimum length are eligible