meu projeito ao invés de me retornar o pedido selecionado, está me retornando um mensagem de UNDEFINED, gostaria de saber porque.Obrigado (:
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
meu projeito ao invés de me retornar o pedido selecionado, está me retornando um mensagem de UNDEFINED, gostaria de saber porque.Obrigado (:
Oi Lucas!
Posta seu código aqui pra gente e diz qual linha ta undefined
Abraço
O problema pelo o que percebi está ocorrendo no blockquote.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<title>Só de Cenoura Garçom</title>
<link rel="stylesheet" href="icons/material.css">
<link rel="stylesheet" href="css/materialize.min.css">
<link rel="stylesheet" href="css/estilos.css">
</head>
<body>
<div class="topo-fixo z-depth-1">
<div class="yellow darken-4 white-text valign-wrapper"><!-- classes do materialize qualquer duvida entrar na documentação do site -->
<h5 class="titulo">Só de Cenoura</h5>
<div>
<i data-activates="submenu" data-gutter="5" data-contrainwidth="false"
class="material-icons waves-effect waves-light waves-circle dropdown-button">more_vert</i> <!-- classes do materialize para icones. -->
</div>
<ul class="dropdown-content" id="submenu">
<li><a class="back-text acao-limpar">Limpar</a></li>
</ul>
</div>
<ul class="tabs yellow darken-4">
<li class="tab"><a href="#bolos" class="white-text waves-effect waves-ligth">Bolos</a></li> <!-- linkamos o ID para poder ficar separado por aba -->
<li class="tab"><a href="#bebidas" class="white-text waves-effect waves-ligth">Bebidas</a></li><!-- -->
</ul>
</div>
<div class="section" id="bolos"><!-- damos esse ID para poder fazer um link entre as abas e ficar o conteudo separado -->
<h6 class="container brown-text">Em pedaços</h6>
<div class="collection">
<a class="collection-item waves-effect black-text">Só cenoura</a> <!-- classes do materialize qualquer duvida entrar na documentação do site -->
<a class="collection-item waves-effect black-text">Com nutella
</a>
<a class="collection-item waves-effect black-text">Brigadeiro</a>
<a class="collection-item waves-effect black-text">Morango</a>
</div>
<h6 class="container brown-text">Ineteiros</h6>
<div class="collection">
<a class="collection-item waves-effect black-text">Só cenoura</a> <!-- classes do materialize qualquer duvida entrar na documentação do site -->
<a class="collection-item waves-effect black-text">Com nutella</a>
<a class="collection-item waves-effect black-text">Brigadeiro</a>
<a class="collection-item waves-effect black-text">Morango</a>
</div>
</div>
<div class="section" id="bebidas">
<h6 class="container brown-text"> Cafés</h6>
<div class="collection">
<a class="collection-item waves-effect black-text">Espresso</a> <!-- classes do materialize qualquer duvida entrar na documentação do site -->
<a class="collection-item waves-effect black-text">Capucchino</a>
<a class="collection-item waves-effect black-text">Chocolate</a>
</div>
<h6 class="container brown-text"> Refrigerantes</h6>
<div class="collection">
<a class="collection-item waves-effect black-text">Coca</a> <!-- classes do materialize qualquer duvida entrar na documentação do site -->
<a class="collection-item waves-effect black-text">Soda</a>
<a class="collection-item waves-effect black-text">Guarana</a>
</div>
</div>
<div class="fixed-action-btn">
<a href="#confirmacao" id="confirmar" class="btn-floating btn-large waves-effect waves-ligth brown modal-trigger">
<i class="material-icons">done</i>
</a>
</div>
<div class="modal modal-fixed-footer" id="confirmacao">
<div class="modal-content">
<h5>Resumo do pedido</h5>
<input type="number" class="validate" placeholder="Número da Mesa" id="numero-mesa">
<blockquote id="resumo"></blockquote>
</div>
<div class="modal-footer">
<button class="btn deep-orange waves-effect waves-light modal-close">
pedir
</button>
<button class="acao-limpar btn-flat waves-effect waves-red modal-close">
Cancelar
</button>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/materialize.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>
vou deixar tambem a parte do JS
$('.collection-item').on('click',function(){
var $badge = $('.badge',this);
if ($badge.length == 0) {
$badge = $('<span class="badge brown-text">0</span>')
.appendTo(this);
}
$badge.text(parseInt($badge.text())+1);
});
$('#confirmar').on('click', function(){
var texto = "";
$('.badge').parent().each(function(){
texto += this.firstChild.textContet + ': ';
texto += this.lastChild.textContet + ', ';
});
$('#resumo').empty().text(texto);
});
$('.modal-trigger').leanModal();
$('.collection').on('click', '.badge', function(){
$(this).remove();
return false;
});
$('.acao-limpar').on('click', function(){
$('#numero-mesa').val('');
$('.badge').remove();
});
Acho que ta la no each: ta chamando textContet ao invés de textContent :)
fiz a mudança no codigo mais nao resolveu. isso é o que gera blockquote quando eu adiciono um pedido e envio esse pedido para o RESUMO. Esse codigo abaixo peguei no inspetor de elementos do navegador, ele esta adicionando esse UNDEFINED>>
undefined: 1,
Mas acho que é esse erro mesmo. Repare que no seu código aí de cima tem duas ocorrências de textContet:
texto += this.firstChild.textContet + ': ';
texto += this.lastChild.textContet + ', ';
É esse código que gera o formato que vc falou XXX: 1,
Precisa arrumar os 2 pra textContent.