I am currently trying to implement some extra product price attribute which will take user input and calculate the price according to that. Tried with price attribute but not working. Any idea how to do it, as new in magento unable to fix that. Please note height and width are input type text, a user can add any value
To achieve this, i have created a set of attributes in admin section,
From the front end trying to calculate the price,
require([
'jquery','Magento_Catalog/js/price-utils','jquery/ui','Magento_Catalog/js/price-box'
], function($,priceUtils,priceBox){
"use strict";
var priceBoxes = $('[data-role=priceBox]');
$('.product-custom-optionval').change(function () {
var value = $(this).val();
if (value === '') {
$(this).val(0);
updatePriceOnChange(0, $(this).attr('data-attr-id'));
return;
}
disableAddToCartBtn('#product_addtocart_form');
calculatePrice($(this));
enableAddToCartBtn('#product_addtocart_form');
});
****** But after calculating the price what will my approach to update product price, please help *******
HI for this you can do something like
Create custom module
Define custom controller
whenever user puts the input in the height and width
Send those parameters to the controller along with the product id and qty
Do your calculations there on basis of your logic and return response
upadte the price in the div on basis of the response
than when user hits add to cart , listen before add to cart event and upadte the cart item price with the new price of your calculations
rest magento will do itself
hope that will help you somehwere
Related
So I'm using Wix to create a ecommerce store, however the standard store isn't flexible enough for me.
I have a dynamic product page and I want to access product quantity in stock with code in order to show whether the product is in stock or not.
I fount this in the documentation (Link)
$w('#myProductPage').getProduct()
.then( (product) => {
let productName = product.name;
let productDescription = product.description;
// see example product object below
} )
.catch( (error) => {
console.log(error);
} );
The only thing is that I don't know whats the page name with what i have to replace '#myProductPage'.
As far as I understand it I have to replace it with my slug product page name however I don't know where I could see it - it should be named products-2 but that doesn't work, it shows an error that the name is not a valid selector.
I haven't found basically any example codes for Wix Corvid and that's why I'm reaaally struggling with such a small thing.
With $w(), you want to pass in the page element's ID -> $w('#elementID')
The element ID can be found in the property pane on the page. Select the page element, right click > View Properties. This will give you the ID you want to pass in to the function. Think of it like a document.getElementById() function replacement.
I need dynamically change custom attribute on the configurable page when I click to the swatch color attribute. On this purpose I programmatically created custom attributes with options on the admin panel, where I can save for every product his own custom attributes.
I figure out how to call my custom attributes on simple products but I can't to do this with configurable product.
I see when I change color attribute - price is changed for every simple product([it's default thing), how to do same but with my custom attributes?
I have one idea but I don't know how this one implement. So I know how to get current product id when you clicked on the color attribute(through js code) then I need pass this id data to the controller via ajax. I need to know how exactly to do this, how to pass js data through ajax to controller and then call needed block on the category page every time when I click on the color attribute? ? When I will be know how to do that I get with this id data - custom attribute values and call this template in the needed place.
Code below is that what call custom attributes on the configurable product, but it's call all attributes for all simple products included in the configurable product. I need call these attributes for current product every time when I cliked on the color attribute. For example: if I click on the black color (which related to the product with id 123 ) I get custom block with custom attributes without reloading page(like price).color attributes
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$product = $objectManager->get('Magento\Framework\Registry')->registry('current_product');
$product_id = $product->getId();
$configProduct = $objectManager-
>create('Magento\Catalog\Model\Product')->load($product_id);
$configurable = $configProduct->getTypeId() ==
\Magento\ConfigurableProduct\Model\Product\Type\Configurable::TYPE_CODE;
$_children = $configProduct->getTypeInstance()-
>getUsedProducts($configProduct);
if ($configurable){
foreach ($_children as $child){
$child_badge = $child->getResource()->getAttribute('mycustom_attribute_code')->getFrontend()->getValue($child);
echo $child_badge;
}
}
I have made a custom theme on big cartel, and everything is perfect, except one thing.
I would like to have the cart update without going to the cart page when adding an item to your cart.
I have made my custom template over the "sexy" theme and have no idea how I go about implanting this
I know this can be done, because default themes like "Good Vibes" do this.
You can use the code below. I didn't include the code for the restoreButton function in the addItem callback but I'm sure you get the idea. You'll also need your own means of retrieving the product ID based on however you're displaying your product options. Make sure to also include a reference to Big Cartel's javascript api.
$('#add_to_bag').click(function(evt){
var productId;
if($('.options_select').length != 0)
productId = $( ".options_select option:selected" ).attr('value');
else
productId = $('.price_options input').attr('value');
var quantity = $('.quantity input').attr('value');
Cart.addItem(productId, quantity, function(cart) {
$('#add_to_bag').attr('value', 'Item Added');
setTimeout(restoreButton, 2000);
});
});
You'll want to take advantage of the javascript API: https://help.bigcartel.com/developers/themes/#javascript-api
With this, you can drop in the line of code to load the API into your theme and have access to add, update, and remove items from the cart using javascript.
I am sure there will be articles around this but I really don't know the correct name for it and having little success finding examples like mine.
I have a quote form where you have the ability to select a product and atributes of it. There are three dropdowns and based on the combination of the three, I have a table (with associated model/controller) that has a price. I want to display the price on the page but i must update as the selections are updated.
Setting the price from the get go seemed easy but then updating it based on dropdowns selected had me go in a tail spin of '"onSelectedIndexChanged()', javascript, AJAX, partial views and I simply confused myself.
I need a simple way to display price information on a quote form as they fill out the details (three fields control price). I did look at the music store demo but its slightly different and the shopping cart element which looked handy was grabbing data in a table so again got stuck.
Help always appreciated as ever.
Thanks,
Steve.
When one of the three dropdowns changes, I'd make an AJAX call to the server to get the price as a JSON object and use it to update the price input.
Example using jQuery to add the handlers and perform the AJAX operation.
var $priceControls = $('#control1,#control2,#control2');
$priceControls.change( function() {
$.getJSON( '#Url.Action("price","product")',
$priceControls.serialize(),
function(price) {
$('#price').val(price);
});
});
public class ProductController : Controller
{
public ActionResult Price( string control1, string control2, string control3 )
{
decimal price = ...lookup price based on control values...
return Json( price, JsonRequestBehavior.AllowGet );
}
}
i need to customize function opConfig.reloadPrice(); in magento.
can anyone tell me where is that function locate?
This function is executed on custom attribute drop down on product details page.
As i need to change the Special price calculation , i guess need to customize this function .
This method can be found in following files:
grep 'reloadPrice:' . -rsn
./js/varien/configurable.js:271: reloadPrice: function()
./js/varien/product.js:463: reloadPrice: function()
./skin/frontend/base/default/js/bundle.js:83: reloadPrice: function()
For change custom option value, you should change in to js/varient/product.js
and in that page you found, reload:function()
that function call at the time of on change event.
Good Luck
I also had the issue of having to change the default behaviour of Magento on this one. I included jQuery in my project and I finaly figured it out by first removing the default behavior of Magento and instead on calculatePrice call my calculatePrices()-function:
$j('#select_20, #select_21').removeAttr('onchange').change(function(){
calculatePrices();
});
Now, in this calculatePrices()-function, alongside with some other logic, I included this to change the prices:
function calculatePrices()
{
var price = 0;
// some logic with custom options, not interesting for this question...
// Change the price according to the options:
$j('#select_20, #select_21').each(function(){
var selectId = this.id.replace('select_', '');
var options = opConfig.config[selectId][this.value];
if(options.type == 'fixed') {
price += options.priceValue;
} else {
// percentual change:
price += price * (options.priceValue/100);
}
});
// Use Magento Objects to set these prices:
optionsPrice.changePrice('bundle', price);
optionsPrice.reload();
}