Как создать автосумму в jquery с помощью onchange

Question

Как создать автосумму в jquery с помощью onchange

0

У меня проблема с моим кодом. Я создал простой файл jquery, который автоматически загружает каждую строку в моей таблице. Моя проблема в том, что я не могу получить правильную сумму моих строк. Вот что я сделал.

В моем jquery

$('[id^=total]').on('change',function() {

        var index = this.id.match(/\d+/)[0];
        var total_input = parseInt($('#total'+index).val());

        var total = 0;

        $('[id^=total]').each(function(index){
            total += parseFloat($(this).val()?$(this).val():0);
        });

        var totalAll = $('#total_amt_due').val(total.toFixed(2));           
});

В моем HTML

<table border="1">
        <tr>
            <td>
                <input type='text' name='total[]' id='total1' value='' />
            </td>
        </tr>
        <tr>
            <td>
                <input type='text' name='total[]' id='total2' value='' />
            </td>
        </tr>
        <tr>
            <td>
                <input type='text' name='total[]' id='total3' value='' />
            </td>
        </tr>
        <tr>
            <td>
                <input type='text' name='total[]' id='total4' value='' />
            </td>
        </tr>
        <tr>
            <td>
                <input type='text' name='total[]' id='total5' value='' />
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" class="k-textbox" value="0.00" style="color: red; text-align: right;
                    font-family: courier" name="total_amt_due" id="total_amt_due" readonly="readonly" />
            </td>
        </tr>
</table>

Я создал эту таблицу в PHP динамически. Но для простоты я удаляю циклы. Я плохо разбираюсь в jquery. Итак, можете ли вы дать мне простой ответ на создание автозапуска?

Здесь скрипка: http://jsfiddle.net/rochellecanale/K8UNQ/3/

Jerielle 04 окт. 2013, в 08:22

Источник

Теги:

javascript

jquery

2 ответа

0

var total = 0;
$('[id^=total]').on('change', function () {
    if ($.trim($(this).val()) != '') {
        total += parseFloat($(this).val() ? $(this).val() : 0);
    }
    var totalAll = $('#total_amt_due').val(total.toFixed(2));
});

РАБОЧАЯ ДЕМО

RAVI MONE 04 окт. 2013, в 03:41

0

Не рассчитывает это правильно !!!
Alex Art. 04 окт. 2013, в 05:49
0

Да, не правильно рассчитать. Но спасибо за идею.
Jerielle 04 окт. 2013, в 05:50
0

@ AlexArt.Хей Алекс, спасибо за выявление ошибки, если она есть. Подскажите пожалуйста, где я не прав.
RONE 04 окт. 2013, в 05:54
0

Проблема не в логике или реализации вашего ответа. Вы можете проверить мой ответ, чтобы увидеть, в чем была проблема
Alex Art. 04 окт. 2013, в 05:55

Показать ещё 2 комментария

Ещё вопросы

Да, не правильно рассчитать. Но спасибо за идею.
@ AlexArt.Хей Алекс, спасибо за выявление ошибки, если она есть. Подскажите пожалуйста, где я не прав.
Проблема не в логике или реализации вашего ответа. Вы можете проверить мой ответ, чтобы увидеть, в чем была проблема

Alex Art. · Accepted Answer · 2013-10-04T04-35-00.000Z

у вас есть проблема с строкой, которая отображает сумму итогов, потому что id также начинается с "total". Просто измените его id (скажем, amt_due вместо total_amt_due):

<td>
         <input type="text" class="k-textbox" value="0.00" style="color: red; text-align: right; font-family: courier" name="total_amt_due" id="amt_due" readonly="readonly" />
     </td>

Проверьте это: FIDDLE