Editable-table version ulongx

Résolu/Fermé
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 - 25 juil. 2020 à 18:40
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 - 26 juil. 2020 à 09:13
Bonjour,

J'utilise cette version de table :
https://github.com/ulongx/editable-table

Il me va bien, seulement, il fait les calculs (additions) des colonnes et affiche le résultat en ligne en bas du tableau.

Je cherche à modifier ce code pour qu'il multiplie les nombres d'une ligne et affiche les résultats à droite en colonne.

Quelqu'un peut m'aider svp ?

C'est le code du fichier numeric-input-1.2.js :

/* ulongx ->https://github.com/ulongx/editable-table
numeric-input-1.2.js
这是一个对 editableTableWidget 的一个小扩展,可以定义表格哪几列需要修改,
哪一列是汇总列,还有汇总的计算方式  type * 相乘 + 相加 - 相减
*/
(function (){
    "use strict";

    $.fn.numericInput = function (options) {
        //type * 相乘 + 相加 - 相减
        var defaults = {
            columns: [],   //需要更改的列,默认全部
            totalColIndex: -1, //汇总列,默认没有
            type: '*'
        };

        options = $.extend(defaults, options);

        var element = $(this),
            footer = element.find('tfoot tr'),
            dataRows = element.find('tbody tr'),
            initialTotal = function (){
                var column,total,totalSum;
                if(!options.columns.length) {
                    for (column = 1; column < footer.children().size(); column++) {
                        total = 0;
                        dataRows.each(function (){
                            var row = $(this);
                            total += parseFloat(row.children().eq(column).text());
                        });
                        footer.children().eq(column).text(total);
                    }
                } else {
                    for (var x in options.columns) {
                        total = 0, totalSum = 0;
                        dataRows.each(function (){
                            var row = $(this);
                            total += parseFloat(row.children().eq(options.columns[x]).text());
                            if (options.totalColIndex !== -1){
                                totalSum += parseFloat(row.children().eq(options.totalColIndex).text());
                            }
                        });
                        footer.children().eq(options.columns[x]).text(total);
                        if (options.totalColIndex !== -1){
                            footer.children().eq(options.totalColIndex).text(totalSum);
                        }
                    }
                }

            };

        element.find('td').on('change', function (evt) {
            var cell = $(this),
                column = cell.index(),
                total = 0,
                totalSum = 0,
                totalSumEnd = 0;
            if (options.columns.length && $.inArray(column,options.columns) === -1) {
                //$.Message.info('本单元不可编辑');
								alert('本单元不可编辑');
                return false;
            }
            if (options.columns.length && options.totalColIndex !== -1){
                var parentTr = cell.parent().children();
                options.columns.map(function (item, i) {
                    switch(options.type){
                        case '*':
                            if (totalSum === 0){
                                totalSum = parseFloat(parentTr.eq(item).text());
                            } else {
                                totalSum *= parseFloat(parentTr.eq(item).text());
                            }
                            break;
                        case '+':
                            totalSum += parseFloat(parentTr.eq(item).text());
                            break;
                        case '-':
                            totalSum -= parseFloat(parentTr.eq(item).text());
                            break;
                        default:
                            break;
                    }

                });
                parentTr.eq(options.totalColIndex).text(totalSum);
            }

            element.find('tbody tr').each(function (){
                var row = $(this);
                total += parseFloat(row.children().eq(column).text());
                if (options.totalColIndex !== -1) {
                    totalSumEnd += parseFloat(row.children().eq(options.totalColIndex).text());
                }
            });
            // footer.children().eq(column).text(total);
            if (options.totalColIndex !== -1) {
                footer.children().eq(options.totalColIndex).text(totalSumEnd);
            }else{
                footer.children().eq(column).text(total);
            }

        }).on('validate', function (evt, value) {
            var cell = $(this),
                column = cell.index();
            if (column === 0) {
                return !!value && value.trim().length > 0;
            } else {
                return !isNaN(parseFloat(value)) && isFinite(value);
            }
        });
        initialTotal();
        return this;
    };
})(window.jQuery);



Merci !
A voir également:

2 réponses

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
25 juil. 2020 à 21:27
Bonjour

Pour multiplier au lieu d'additionner, il faut remplacer les +
total += 

Par des *
total *= 


1
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 672
25 juil. 2020 à 21:39
jordane45, merci, je doute bien, mais le plus important pour moi est qu'il affiche les résultats à droite et pas en bas. C'est à dire qu'il calcule les lignes et pas les colonnes.
0
jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
25 juil. 2020 à 23:04
Et bien, je pense que tu dois boucler sur chaque ligne puis sur chaque colonne

un truc du genre
dataRows.each(function (){
   var row = $(this);
   total = 0;
  for (column = 1; column < footer.children().size(); column++) {
      total *= parseFloat(row.children().eq(column).text());
  });
  // ici, il faudra ajouter le code qui, ajoute une colonne supplémentaire à la ligne et y inscrit le total
}
0
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 672 > jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024
26 juil. 2020 à 09:13
Bonjour,

En fait, c'est tout bête, mais ulongx a prévu des options dans son édition du script et il suffisait de les exploiter de cette façon dans la page affichant le tableau:

$('#mainTable').editableTableWidget().numericInput({columns: [2,3],totalColIndex: 5, type: '*'}).find('td:first').focus();
// en lui indiquant l'index des colonnes (2 et 3) et l'index de la colonne du total (5) ainsi qu'en disant qu'il multiplie
// le résultat attendu est au rendez-vous
// me reste plus qu'à "supprimer" les colonnes 2 et 3 dans le tfoot (car il les additionne au lancement, pas après)
0