Gostaria de usar o controle BuyInPage, mas ao invés de mostrar o alert mostrar um popup personalizado. Mas não sei como vou pegar o evento que ativa o alert; não sei de qual script ele faz o alert e quero saber se alguém pode me explicar como fazer uma função igual a dessa loja: http://www.calvinklein.com.br/blusa-calvin-klein-jeans-abertura-manga-preto-355478/p.
P.S.: a loja em que estou tentando implementar é essa: https://www.enlevolar.com.br
Olá @Maira Torresani,
Para isso você precisa utiliza a biblioteca que a Vtex disponibiliza:
https://github.com/vtex/vtex.js/tree/master/docs/checkout
É o metodo addToCart. Mas para isso terá que realizar uma customização JS.
Assim você irá adicionar o item ao carrinho e realizar a chamada do alert quando a função finalizar, segue um exemplo:
buyButtons.on('click', function(e) {
e.preventDefault();
var $produto = $(e.target).parents(".produto");
var $tamanho = $produto.find("input[type=radio]:checked");
if ($tamanho.length) {
vtexjs.checkout.addToCart([{
id: $tamanho.val(),
quantity: 1,
seller: $tamanho.data("sellerid")
}], null, salesChannel).done(function(orderForm) {
// Aqui você pode criar o alert de sucesso
});
} else {
// Aqui você pode criar o alert de erro
}
});
Oi @Mateus Augusto Saggin
Muito obrigada pela resposta!!
mas tenho um problema, inclui a biblioteca vtex.js no meu site (https://io.vtex.com.br/vtex.js/2.0.0/vtex.min.js), mas ainda assim quando clico no botão comprar ele dá o erro "Uncaught TypeError: vtexjs.checkout.addToCart is not a function"
@Maira Torresani como mencionei você precisaria realizar uma customização JS. Não é tão simples, além de incluir a biblioteca é necessário realizar esta customização adequando a sua loja.
Sugiro que entre em contato com a sua agência, pois é preciso conhecimento técnico para configurar está funcionalidade.