0

Всем привет! Делаю таблицу с товаром, в которой будет меняться количество товара и сумма заказа. На кнопку "купить" меняется ссылка подобным образом: берется значение из data-id (здесь будет id товара) и подставляется количество из переменной count. Но так как у меня таблица, то ссылка меняется неправильно, т.е. не в той строке, в которой меняем количество. Как можно сделать так, чтобы ссылка менялась в нужной строке?? Помогите, пожалуйста. (P.s.) во второй строке тег input отображаю в type=text для удобства.

Разметка:

   <table align="center"style="width:70%;">
    <tbody>
        <tr>
            <th>наименование</th>
            <th>количество</th>
            <th>цена</th>
            <th>подробнее</th>
        </tr>
        <tr>
            <td>Товар первый</td>
            <td>
                <span class="minus">-</span>
                <input class="quantity" type="text" size="3" min="0" step="0" max="0" value="1" />
                <span class="plus">+</span>
                <input class="link" type="hidden" data-id="111" value="" style="width:100%;"/>
            </td>
            <td>
                <a href="/site/?action=ADD2BASKET&id=0001" class="url_page">
                    <span class="count_price" data-price="200"> 200 </span><span> руб.</span>
                    Купить
                </a>
            </td>
            <td><a href="/site/section/product-1/" class="url_page_detail">
                Подробнее</a>
            </td>
        </tr>
        <tr>
            <td>Товар второй</td>
            <td>
                <span class="minus">-</span>
                <input class="quantity" type="text" size="3" min="0" step="0" max="0" value="1" />
                <span class="plus">+</span>
                <input class="link" type="text" data-id="111" value="" style="width:100%;"/>
            </td>
            <td>
                <a href="/site/?action=ADD2BASKET&id=0002" class="url_page">
                    <span class="count_price" data-price="100"> 100 </span><span> руб.</span>
                    Купить
                </a>
            </td>
            <td><a href="/site/section/product-2/" class="url_page_detail">
                Подробнее</a>
            </td>
        </tr>
    </tbody>
</table>

Код jQuery:

  $(document).ready(function(){
        function change($tr, val) {
            var $input = $tr.find('.quantity');
            var count = parseInt($input.val()) + val;
            count = count < 1 ? 1 : count;
            $input.val(count);
            var $price = $tr.find('.count_price');
            $price.text(count * $price.data('price'));

            var add_url = $('a.url_page_detail').attr('href'); // берем ссылку из атриб. href class="url_page";
            var $input = $tr.find('.link'); // находим строку, где будут изменения;
            $input.val(add_url + '?action=ADD2BASKET&id=' + $input.data('id') + '&QUANTITY=' + count); // записывает значение в эту строку;

            var $href = $tr.find('.url_page'); // нахоим нужную строку и меняем ссылку;
                $href.attr('href', $('.link').val());
            var BBB = $('.link').val();
            //  console.log(BBB);
        }
        $('.minus').click(function() {
            change($(this).closest('tr'), -1);
        });
        $('.plus').click(function() {
            change($(this).closest('tr'), 1);
        });
        $('.quantity').on("input", function() {
            var $price = $(this).closest('tr').find('.count_price');
            $price.text(this.value * $price.data('price'));
        });
    });
9
  • Вот вы во всех местах поставили $tr.find, а в одном забыли... 30 мая 2018 в 12:27
  • @PavelMayorov потому что во всех местах не его код, а там где забыл - его код... 30 мая 2018 в 12:29
  • @StepanKasyanenko возможно, но какая разница? 30 мая 2018 в 12:30
  • @StepanKasyanenko ну да, совершенно верно. Это мне помогли написать вы, за что я вам благодарен. Но вот разбираясь дальше, опять зашёл в тупик. Изучение занимаюсь, а вот потребности в таком функционале есть, к сожалению...
    – Alexandr
    30 мая 2018 в 12:33
  • add_url - вот здесь, ищите через $tr.find, как например мы .quantity ищем. 30 мая 2018 в 12:36

1 ответ 1

0

Всё, нашёл свои ошибки. Оказывается просто было) Надо было фильтр применить еще раз

$(document).ready(function(){
    function change($tr, val) {
        var $input = $tr.find('.quantity');
        var count = parseInt($input.val()) + val;
        count = count < 1 ? 1 : count;
        $input.val(count);
        var $price = $tr.find('.count_price');
        $price.text(count * $price.data('price'));


        var $add_url = $tr.find('.url_page_detail').attr('href'); 
        var $input = $tr.find('.link'); 
        $input.val($add_url + '?action=ADD2BASKET&id=' + $input.data('id') + '&QUANTITY=' + count); // строим ссылку;

        var $href = $tr.find('.url_page'); 
        var $href_res = $tr.find('.link').val(); 
            $href.attr('href', $href_res);
    }
    $('.minus').click(function() {
        change($(this).closest('tr'), -1);
    });
    $('.plus').click(function() {
        change($(this).closest('tr'), 1);
    }); 
    $('.quantity').on("input", function() {
        var $price = $(this).closest('tr').find('.count_price');
        $price.text(this.value * $price.data('price'));
    });
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.