2 ways to get total sum of Interactive Grid Column Oracle Apex

Share on:

How to Calculate total sum of interactive grid column into page item in oracle apex.

Code Preview

Most of the time, this question was asked by my friends and colleagues that “How to Calculate total sum of interactive grid column into page item in oracle apex” then i got solution in two ways.

Solution 1.

  1. Need to create an editable interactive grid report using emp table and Page item Px_ITEM.

Code Preview

  1. Copy and Paste below code in “Function and Global Variable Declaration”.
 1function($) {
 2
 3    function update(model) {
 4        var salKey = model.getFieldKey("SAL"),
 5            total = 0;
 6
 7        console.log(">> starting sum SAL column")
 8        model.forEach(function(record, index, id) {
 9            var sal = parseFloat(record[salKey]), 
10                meta = model.getRecordMetadata(id);
11
12            if (!isNaN(sal) && !meta.deleted && !meta.agg) {
13                total += sal;
14            }
15        });
16        console.log(">> setting sum SAL column to " + total)
17        $s("P23_TOTAL", total);
18    }
19
20    $(function() {
21       
22        $("#emp").on("interactivegridviewmodelcreate", function(event, ui) {
23            var sid,
24                model = ui.model;
25
26            if ( ui.viewId === "grid" ) {
27                sid = model.subscribe( {
28                    onChange: function(type, change) {
29                        console.log(">> model changed ", type, change);
30                        if ( type === "set" ) {
31                             if (change.field === "SAL" ) {
32                                update( model );
33                            }
34                        } else if (type !== "move" && type !== "metaChange") {
35                          update( model );
36                        }
37                    },
38                    progressView: $("#P23_TOTAL") 
39                } );
40                 update( model );           
41                model.fetchAll(function() {});
42            }
43        });
44
45    });
46
47})(apex.jQuery);

Code Preview

Note: Defile region static id- “emp”.

Solution 2:

  1. Now create a dynamic action on the SAL column of IG for change event.

Code Preview

  1. Create a true action as Set Value. Set the type PL/SQL expression as :SAL and submit the SAL.

Preview

  1. Create another true action to execute JavaScript code and add the following code:
 1
 2var model = apex.region("ONTOOR").widget().interactiveGrid("getViews", "grid").model;
 3var n_amt, n_totamt = 0;
 4col_amt = model.getFieldKey("SAL");
 5model.forEach(function(igrow) {
 6    n_amt = parseInt(igrow[col_amt], 10);
 7    if (!isNaN(n_amt)) {
 8        n_totamt += n_amt;
 9    }
10});
11apex.item("P23_TOTAL").setValue(n_totamt);
12

Preview

Demo

You might Like :