1

Eu quero comparar o produto e a cidade da tabela.

Ao clicar no preço eu obtenho o produto e a cidade no meu painel, ate ai ok! só que eu queria que ao clicar em outro produto ele fizesse a comparação abaixo da primeira comparação que eu fiz?

Pra quem não entendeu a comparação é o seguinte

Eu comparo o preço de cada produto das cidade, só que no painel cada produto tem que ter o seu container para fazer a comparação.

A principio não há painel só quando clicar nos button, há 3 linhas na minha tabela, cada linha vai ter 8 button, cada linha dessas eu quero um painel, ao clicar nos button da linha 1 ou 2 tanto faz ele vai abrir um painel, ao clicar em um button da mesma linha que abriu o painel ela substitui os valores, agora se eu clicar em outra linha ela ira abrir outro painel e assim sucessivamente

jsFiddle: https://jsfiddle.net/hr7mejnm/1/ com código que recebi na outra pergunta.

4
  • @Sergio percebi no console que, a quantidade de TR que eu colocar na tabela é a quantidade de ARTICLE que aparecerá no html, certo?
    – pedroandre
    Commented 11/05/2016 às 14:50
  • @Sergio Como faço para fazer um calculo direto no html? jsfiddle.net/hr7mejnm/4
    – pedroandre
    Commented 13/05/2016 às 17:16
  • Podes explicar o que queres dizer com "calculo direto no html"?
    – Sergio
    Commented 13/05/2016 às 21:44
  • @Sergio, Eu quero fazer o calculo dos valores que eu escolher direto no html , sem precisar mexer mais no script, exe: o primeiro resultado que aparecer no painel eu quero somar com o que vier depois, e também saber quantos resultado apareceu no painel, Exe: 1, 2, 3.
    – pedroandre
    Commented 16/05/2016 às 11:25

1 Resposta 1

3

Tens de criar uma variável que guarda o ultimo valor escolhido e precisas de uma função que compara os valores.

Pode ser algo assim:

var articles = getElements('article');
var spans = articles.map(function(el) {
    return getElements('p span', el);
});


function getElements(selector, rel) {
    var list = (rel || document).querySelectorAll(selector);
    return [].slice.call(list);
}

function addValues(target, el, iTr, iTd) {
    var cidade = cols[iTd].innerHTML;
    var produto = linhas[iTr].querySelector('th').innerHTML;
    var preco = el.innerHTML;

    [cidade, produto, preco].forEach(function(val, i) {
        target[i].innerHTML = val;
    });
}

function handler(el, indexTr, indexTd) {
    return function(e) {
        articles[indexTr].style.display = 'block';
        addValues(spans[indexTr], el, indexTr, indexTd);

    }
}

var cols = getElements('th').slice(1);
var linhas = getElements('tr').slice(1);
linhas.forEach(function(tr, i) {
    var tds = getElements('td', tr);
    tds.forEach(function(td, j) {
        td.addEventListener('click', handler(td, i, j));
    });
});

jsFiddle: https://jsfiddle.net/hr7mejnm/4/

2
  • meu caro preciso de uma pequena ajuda sua, esse script que vc fez pra mim ai em cima, porque é que ele não mostra nada no codigo-fonte no navegador, agora quando inspeciono ele no console ele mostra o resultado.
    – pedroandre
    Commented 29/11/2016 às 21:35
  • é porque eu preciso manipular os resultado que esse script mim retorna.
    – pedroandre
    Commented 29/11/2016 às 21:40

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .