Price Search / jQuery / JavaScript

Question

Price Search / jQuery / JavaScript

Navigation

#1 by (3 votes)

1

I want to compare the product and the city of the table.

Clicking on the price I get the product and the city in my panel, until then ok! only that I wanted it to click on another product to compare it below the first comparison I made?

For those who did not understand the comparison is as follows

I compare the price of each product of the city, only in the panel each product has to have your container to make the comparison.

At first there is no panel just when I click the button, there are 3 rows in my table, each row will have 8 button, each row of these I want a panel, when clicking the button on line 1 or 2, a panel, clicking a button on the same line that opened the panel it replaces the values, now if I click on another line it will open another panel and so on

jsFiddle: link with code I received in the other question .

javascript jquery

asked by anonymous 06.05.2016 / 14:30

1 answer

JSF - Select Item of a Set How to execute a javascript code from the url of the site [closed]

score 3 · Accepted Answer

You have to create a variable that stores the last value you have chosen and you need a function that compares the values.

It may look something like this:

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));
    });
});