Magento2 update minicart using custom ajaxMagento 2: Mini Cart return no itemsMagento2 Moving minicart to sidebar removing ajaxMagento2: Update minicart view using ajaxMagento 2 : Mini-cart quantity update button not working properlyAjax cart validation on change qtyMagento 2 cart event observers not redirecting correctlyMagento 2 - Update quantity and totals of cart page without page reload?Magento 2 Minicart Ajax updateEdit in Cart using AJAX with model popup to update qty and options of productHow to create custom form in Magento 2.2.3
Would getting a natural 20 with a penalty still count as a critical hit?
"sh -c" does not expand positional parameters, if I run it from "sudo --login". Is there a way around this?
What was the intention with the Commodore 128?
How to render "have ideas above his station" into German
What allows us to use imaginary numbers?
What's the relationship betweeen MS-DOS and XENIX?
What should I do if actually I found a serious flaw in someone's PhD thesis and an article derived from that PhD thesis?
String routines
Good way to stop electrolyte tabs from turning into powder?
What is the fastest way to level past 95 in Diablo II?
Change the default Bookmarks Folder In Firefox
Minimum population for language survival
Difference between "va faire" and "ira faire"
Setting up a Mathematical Institute of Refereeing?
Can I use my OWN published papers' images in my thesis without Copyright infringment
Airline power sockets shut down when I plug my computer in. How can I avoid that?
Who owns content posted at Paizo.com forums?
Problem with GFCI at start of circuit with both lights and two receptacles
Why does Japan use the same type of AC power outlet as the US?
May the tower use the runway while an emergency aircraft is inbound?
Unsolved Problems due to Lack of Computational Power
Gofer work in exchange for LoR
SQL Server query scanning more partitions than expected
What happens when a person with some edited genetics (like say, eagle eyes) reproduces with a person with regular genetics?
Magento2 update minicart using custom ajax
Magento 2: Mini Cart return no itemsMagento2 Moving minicart to sidebar removing ajaxMagento2: Update minicart view using ajaxMagento 2 : Mini-cart quantity update button not working properlyAjax cart validation on change qtyMagento 2 cart event observers not redirecting correctlyMagento 2 - Update quantity and totals of cart page without page reload?Magento 2 Minicart Ajax updateEdit in Cart using AJAX with model popup to update qty and options of productHow to create custom form in Magento 2.2.3
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I have scenario to update quantity using +/- button in in magento2 minicart.
I override MagentoCheckout to my theme and edited minicart/items/default.html and made the changes , now i need to make auto update of price and quantity change on click of +/- button.
My ajax call on click
function plus(idvl)
fieldName = idvl;
fieldName = fieldName.slice(1);
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
if (!isNaN(currentVal))
$('input[name='+fieldName+']').val(currentVal + 1);
vr=new Object();
vr["item_id"] = fieldName;
vr["item_qty"] = currentVal;
vr["form_key"] = '<?php echo $FormKey->getFormKey();?>';
$.ajax(
url: '<?php echo $this->getBaseUrl(); ?>checkout/sidebar/updateItemQty/',
dataType: 'json',
type : 'post',
data: vr,
success: function(data)
console.log(JSON.stringify(data));
);
else
$('input[name='+fieldName+']').val(0);
Now the ajax call works and it return status 200K success:true but the contents are not updated. is there any way to achieve it ?
After updateItemQty ajax call there is a another call which works if i directly clicking on the update button in the minicart like
customer/section/load/?sections=cart%2Cmessages&update_section_id=true&_=12
But i'm not sure how this one is triggered in the core code. Any help is appreciated thanks in advance.
magento2 mini-cart
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
add a comment |
I have scenario to update quantity using +/- button in in magento2 minicart.
I override MagentoCheckout to my theme and edited minicart/items/default.html and made the changes , now i need to make auto update of price and quantity change on click of +/- button.
My ajax call on click
function plus(idvl)
fieldName = idvl;
fieldName = fieldName.slice(1);
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
if (!isNaN(currentVal))
$('input[name='+fieldName+']').val(currentVal + 1);
vr=new Object();
vr["item_id"] = fieldName;
vr["item_qty"] = currentVal;
vr["form_key"] = '<?php echo $FormKey->getFormKey();?>';
$.ajax(
url: '<?php echo $this->getBaseUrl(); ?>checkout/sidebar/updateItemQty/',
dataType: 'json',
type : 'post',
data: vr,
success: function(data)
console.log(JSON.stringify(data));
);
else
$('input[name='+fieldName+']').val(0);
Now the ajax call works and it return status 200K success:true but the contents are not updated. is there any way to achieve it ?
After updateItemQty ajax call there is a another call which works if i directly clicking on the update button in the minicart like
customer/section/load/?sections=cart%2Cmessages&update_section_id=true&_=12
But i'm not sure how this one is triggered in the core code. Any help is appreciated thanks in advance.
magento2 mini-cart
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
add a comment |
I have scenario to update quantity using +/- button in in magento2 minicart.
I override MagentoCheckout to my theme and edited minicart/items/default.html and made the changes , now i need to make auto update of price and quantity change on click of +/- button.
My ajax call on click
function plus(idvl)
fieldName = idvl;
fieldName = fieldName.slice(1);
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
if (!isNaN(currentVal))
$('input[name='+fieldName+']').val(currentVal + 1);
vr=new Object();
vr["item_id"] = fieldName;
vr["item_qty"] = currentVal;
vr["form_key"] = '<?php echo $FormKey->getFormKey();?>';
$.ajax(
url: '<?php echo $this->getBaseUrl(); ?>checkout/sidebar/updateItemQty/',
dataType: 'json',
type : 'post',
data: vr,
success: function(data)
console.log(JSON.stringify(data));
);
else
$('input[name='+fieldName+']').val(0);
Now the ajax call works and it return status 200K success:true but the contents are not updated. is there any way to achieve it ?
After updateItemQty ajax call there is a another call which works if i directly clicking on the update button in the minicart like
customer/section/load/?sections=cart%2Cmessages&update_section_id=true&_=12
But i'm not sure how this one is triggered in the core code. Any help is appreciated thanks in advance.
magento2 mini-cart
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
I have scenario to update quantity using +/- button in in magento2 minicart.
I override MagentoCheckout to my theme and edited minicart/items/default.html and made the changes , now i need to make auto update of price and quantity change on click of +/- button.
My ajax call on click
function plus(idvl)
fieldName = idvl;
fieldName = fieldName.slice(1);
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
var currentVal = parseInt($('#cart-item-'+fieldName+'-qty').val());
if (!isNaN(currentVal))
$('input[name='+fieldName+']').val(currentVal + 1);
vr=new Object();
vr["item_id"] = fieldName;
vr["item_qty"] = currentVal;
vr["form_key"] = '<?php echo $FormKey->getFormKey();?>';
$.ajax(
url: '<?php echo $this->getBaseUrl(); ?>checkout/sidebar/updateItemQty/',
dataType: 'json',
type : 'post',
data: vr,
success: function(data)
console.log(JSON.stringify(data));
);
else
$('input[name='+fieldName+']').val(0);
Now the ajax call works and it return status 200K success:true but the contents are not updated. is there any way to achieve it ?
After updateItemQty ajax call there is a another call which works if i directly clicking on the update button in the minicart like
customer/section/load/?sections=cart%2Cmessages&update_section_id=true&_=12
But i'm not sure how this one is triggered in the core code. Any help is appreciated thanks in advance.
magento2 mini-cart
magento2 mini-cart
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
edited Nov 30 '17 at 9:45
Nikolas
1,6205 silver badges13 bronze badges
1,6205 silver badges13 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
asked Nov 30 '17 at 8:48
ManoharSinghManoharSingh
1064 bronze badges
1064 bronze badges
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
The cart should be automagically updated due to the 'ajaxComplete' event (listened for in the customer-data.js file). Can you check if this js module is loaded? If this is triggered, verify in the sectionConfig.getAffectedSections(settings.url) method if the response contains the cart section.
Otherwise you can update the minicart manually like this:
if (res.minicart)
$(self.options.minicartSelector).replaceWith(res.minicart);
$(self.options.minicartSelector).trigger('contentUpdated');
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
add a comment |
Your Answer
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "479"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f203885%2fmagento2-update-minicart-using-custom-ajax%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
The cart should be automagically updated due to the 'ajaxComplete' event (listened for in the customer-data.js file). Can you check if this js module is loaded? If this is triggered, verify in the sectionConfig.getAffectedSections(settings.url) method if the response contains the cart section.
Otherwise you can update the minicart manually like this:
if (res.minicart)
$(self.options.minicartSelector).replaceWith(res.minicart);
$(self.options.minicartSelector).trigger('contentUpdated');
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
add a comment |
The cart should be automagically updated due to the 'ajaxComplete' event (listened for in the customer-data.js file). Can you check if this js module is loaded? If this is triggered, verify in the sectionConfig.getAffectedSections(settings.url) method if the response contains the cart section.
Otherwise you can update the minicart manually like this:
if (res.minicart)
$(self.options.minicartSelector).replaceWith(res.minicart);
$(self.options.minicartSelector).trigger('contentUpdated');
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
add a comment |
The cart should be automagically updated due to the 'ajaxComplete' event (listened for in the customer-data.js file). Can you check if this js module is loaded? If this is triggered, verify in the sectionConfig.getAffectedSections(settings.url) method if the response contains the cart section.
Otherwise you can update the minicart manually like this:
if (res.minicart)
$(self.options.minicartSelector).replaceWith(res.minicart);
$(self.options.minicartSelector).trigger('contentUpdated');
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
The cart should be automagically updated due to the 'ajaxComplete' event (listened for in the customer-data.js file). Can you check if this js module is loaded? If this is triggered, verify in the sectionConfig.getAffectedSections(settings.url) method if the response contains the cart section.
Otherwise you can update the minicart manually like this:
if (res.minicart)
$(self.options.minicartSelector).replaceWith(res.minicart);
$(self.options.minicartSelector).trigger('contentUpdated');
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
answered Nov 30 '17 at 9:15
QuisseQuisse
3652 silver badges10 bronze badges
3652 silver badges10 bronze badges
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
add a comment |
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
customer-data.js is not loaded in the viewsource of the page. If i included it directly in the Magento_theme js its getting some console error and the minicart stops working.
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
I referred in google that to add this script but not sure in which phtml we need to add it , i tried adding it in footer section but its not working. <script> require([ 'Magento_Customer/js/customer-data' ], function (customerData) var sections = ['cart']; customerData.invalidate(sections); ); </script>
– ManoharSingh
Nov 30 '17 at 11:43
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
The customer-data.js shouldnt be visible in the source because it is lazy loaded using requirejs. You should see if it is loaded by using the web-inspector. Normally the minicart.js depends on it like this : define([ 'uiComponent', 'Magento_Customer/js/customer-data', 'jquery', 'ko', 'underscore', 'sidebar', 'mage/translate' ], function (Component, customerData, $, ko, _) {
– Quisse
Nov 30 '17 at 11:48
add a comment |
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f203885%2fmagento2-update-minicart-using-custom-ajax%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
