Нужна помощь по jquery

Тема в разделе "JavaScript", создана пользователем Davahkiin, 13 авг 2014.

Модераторы: ZiX
  1. Davahkiin

    Davahkiin Постоялец

    Регистр.:
    20 мар 2014
    Сообщения:
    86
    Симпатии:
    3
    Есть таблица с товаром, в ней поле с radio кнопками, в зависимости от выбранной отображает нужную стоимость доставки и считает общую сумму. Но если товаров несколько то скрипт не работает, поскольку совпадают названия radio button и переменной куда выводиться сумма. Можно как то в jquery сделать что бы скрипт отдельно работал к примеру для каждой новой строки таблицы?
    Код:
    $('input[name="quantity"],input[name="delivery"]').change(function() {
            var col_price_delivery = $('.col-price-delivery');
            $(document).find('.col-total').each(function() {
                var q1 = $(this).prev().prev().prev().prev().prev().prev().find('input[name="q1"]').val();
                q1 = q1.replace(/[^0-9\.]/g, '');
                var q10 = $(this).prev().prev().prev().prev().prev().prev().find('input[name="q10"]').val();
                var q100 = $(this).prev().prev().prev().prev().prev().prev().find('input[name="q100"]').val();
                var quantity = $(this).prev().prev().prev().prev().prev().find('input[name="quantity"]').val();
                var checked_option_radio = $('input:radio[name=delivery]:checked').val();
                            if (checked_option_radio==1)
                        {
                            delivery_price = 0;               
                        } else if(checked_option_radio==2) {
                            delivery_price = 0;
                        }
                        else if(checked_option_radio==3) {
                            if (quantity >= 100){
                                delivery_price = $('input:[name=d100]').val();
                                    } else if (quantity >= 10) {
                                delivery_price = $('input:[name=d10]').val();
                                    } else if (quantity >= 1) {
                                delivery_price = $('input:[name=d1]').val();
                                    }  
                           delivery_price = parseInt(delivery_price.replace(/[^0-9\.]/g, ''), 10);
                        } else if(checked_option_radio==4) {
                            if (quantity >= 100){
                                delivery_price = $('input:[name=d100-low]').val();
                                    } else if (quantity >= 10) {
                                delivery_price = $('input:[name=d10-low]').val();
                                    } else if (quantity >= 1) {
                                delivery_price = $('input:[name=d1-low]').val();
                                    }
                            delivery_price = parseInt(delivery_price.replace(/[^0-9\.]/g, ''), 10);
                         
                        }
                var sum = '';
                var currency_l = '<?php echo $symbol_left; ?>';
                var currency_r = '<?php echo $symbol_right; ?>';
                if (q10 && q100) {
                    q10 = q10.replace(/[^0-9\.]/g, '');
    
                    q100 = q100.replace(/[^0-9\.]/g, '');
                    if (quantity < 10) {
                        sum = q1 * quantity + delivery_price;
                    } else if (quantity >= 100) {
                        sum = q100 * quantity + delivery_price;
                    } else if (quantity >= 10) {
                        sum = q10 * quantity + delivery_price;
                    }
            } else {
                sum = q1 * quantity;
            }
            if (currency_l) {
                    $(this).text(currency_l + sum);
                } else {
                    $(this).text(sum + currency_r);
                }
             });
    $(document).find('.col-total-delivery-row').each(function() {
                var currency_l = '<?php echo $symbol_left; ?>';
                var currency_r = '<?php echo $symbol_right; ?>';
                if (currency_l) {
                                $(this).text(currency_l + delivery_price);
                            } else {
                                $(this).text(delivery_price + currency_r);
                            }
    });
    $(document).find('input[name=delivery_price]').each(function() {
        $(this).val(delivery_price);
    });
    
        });
     
  2. Шумадан

    Шумадан Хабарра!!11

    Регистр.:
    6 фев 2008
    Сообщения:
    1.728
    Симпатии:
    2.105
    а есть возможность влиять на html? а то сооружать такие горы на jquery, луше уже ближайший контейнер нагенерить с именем + индекс
     
    Джуга и Ctrogan нравится это.
  3. Davahkiin

    Davahkiin Постоялец

    Регистр.:
    20 мар 2014
    Сообщения:
    86
    Симпатии:
    3
    да возможность менять html есть, как понять ближайший контейнер нагенерить с именем + индекс?
     
  4. Шумадан

    Шумадан Хабарра!!11

    Регистр.:
    6 фев 2008
    Сообщения:
    1.728
    Симпатии:
    2.105
    подход такой, самое правильное и быстрое это генерация необходимых id для элементов которые участвуют в калькуляции по алгоритму:
    <input type='radio' name='shipping_name_1' id='shipping_id_1' class='shipping_radio shipping_radio_1'>
    <input type='radio' name='shipping_name_2' id='shipping_id_2' class='shipping_radio shipping_radio_2'>
    ....
    <input type='radio' name='shipping_name_n' id='shipping_id_n' class='shipping_radio shipping_radio_n'>

    обвернуть в <div id='shipping_container' class='shipping_container shipping_container_1'>
    тогда очень быстро и с минимум кода jquery можна найти и выбрать либо элемент лиюо масив элементов непосредственно для калькуляции
     
    Джуга, fmedia и SilverGhost нравится это.
  5. mdigital.md

    mdigital.md Писатель

    Регистр.:
    11 авг 2014
    Сообщения:
    4
    Симпатии:
    0
    Может нужно давать новый ID или 'name' каждому радио кнопке по этому принципу?
    Перейти по ссылке
     
  6. Шумадан

    Шумадан Хабарра!!11

    Регистр.:
    6 фев 2008
    Сообщения:
    1.728
    Симпатии:
    2.105
    name нельзя (он при запросе на сервер имеет важную роль), а id вполне, даже можно использовать аттрибут типа так
    <input type='radio' name='xxx' id='yyy' shipping='какото там знаковый признак'>
    и по тому аттрибуту можно выбрать, а вообще способ с аттрибутом вообще супер универсальный - можно запихнуть что угодно и кому угодно. оно будет иметь значение на клиенте, и абсолютно никакого для сервера.
     
    Джуга, Ctrogan, antiterror и ещё 1-му нравится это.
  7. Davahkiin

    Davahkiin Постоялец

    Регистр.:
    20 мар 2014
    Сообщения:
    86
    Симпатии:
    3
    спасибо немного помогло, изменил немного выборку по radio button
    Код:
    var checked_option_radio = $(this).prev().prev().find(".col-price-delivery input[type='radio']:checked").val();
    , теперь находит выбранный radio в каждом td таблицы, но все равно при нескольких товарах сбивается калькулятор( переменные sum и delivery_price берет общие, их нельзя сделать как то уникальными для каждой строки таблицы?.
     
    Шумадан нравится это.
  8. Шумадан

    Шумадан Хабарра!!11

    Регистр.:
    6 фев 2008
    Сообщения:
    1.728
    Симпатии:
    2.105
    вам лучше вынести калькуляцию по продукту в отдельную функцию, а в итерации пробегать по продуктах и вызывать калькуляцию по продукту, потом всё сохранять в переменную, так вы код немного упростите
     
    Последнее редактирование: 14 авг 2014
    Джуга, Ctrogan, SilverGhost и ещё 1-му нравится это.
  9. Шумадан

    Шумадан Хабарра!!11

    Регистр.:
    6 фев 2008
    Сообщения:
    1.728
    Симпатии:
    2.105
    покажите, что у вас получилось. заработало правильно? или есть ещё вопросы?
     
    Джуга, Ctrogan и SilverGhost нравится это.