计算不适用于Handsontable中使用AJAX的自定义单元格渲染

时间:2016-11-05 15:10:52

标签: javascript php handsontable

在我的表格(Handsontable)中,我有四列汽车 A B C 。 从MySQL数据库加载汽车 A 列的数据。 (例如 PHP Demo )。

B 的数据是通过AJAX从MySQL数据库填充的,具体取决于汽车的值。代码如下:

{type : { renderer : function (instance, TD, row, col, prop, value, cellProperties) {
                    Handsontable.TextCell.renderer.apply(this, arguments);
                    var a,b;
                    a = instance.getDataAtCell(row, 1);
                    b = instance.getDataAtCell(row, 2);                     
                    TD.innerHTML = +a + +b;
                }}}

C列是 A SUM B ,代码为:

{type: numeric}

问题是虽然该值已加载在 B 中,但添加无效。如果我将 B 列的类型设置为除AJAX之外的数字(+----------+------+-------+--------------+ | Cars | A | B | C | +----------+------+-------+--------------+ | Nissan | 20 | 10 | 20 | | Honda | 5 | 6 | 5 | +----------+------+-------+--------------+ ),则添加工作正常。

使用AJAX的结果:

+----------+------+-------+-------------+
| Cars     |   A  |    B  |           C |
+----------+------+-------+-------------+
| Nissan   |   20 |    10 |         30  |  
| Honda    |    5 |     6 |          11 |    -
+----------+------+-------+-------------+

没有AJAX的结果:

$("div.classradio radio").val("Male")

有人可以告诉我,如果我遗失了什么吗?

1 个答案:

答案 0 :(得分:1)

在您的情况下,TD.innerHTML = res.result[0].tax;仅用于显示数据,但不会将数据插入数据图。

您可以尝试为该单元格设置id并通过jquery获取其值并将它们相加。因此代码看起来像这样:

{type: { renderer : function (instance, TD, row, col, prop, value, cellProperties) {

                var cr,prc;
                cr = instance.getDataAtCell(row, 0);
                prc = instance.getDataAtCell(row, 1);
                $.ajax({
                    url: "php/act-go-t.php",
                    data: {cars: cr, price: prc}, 
                    dataType: 'json',
                    type: 'POST',
                    success: function (res) {
                        if (res.result[0].tax === null) {
                            TD.innerHTML = '0.000';                                
                            }
                            else {
                            TD.innerHTML = res.result[0].tax;                                
                            }
                        },
                        error: function () {
                        TD.innerHTML = '0.000';                            
                        }
                    });  
                arguments[5] = TD.innerHTML;
                TD.id = row+'_'+col;
                Handsontable.TextCell.renderer.apply(this, arguments);

                }}}

{type : { renderer : function (instance, TD, row, col, prop, value, cellProperties) {
                    Handsontable.TextCell.renderer.apply(this, arguments);
                    var a,b;
                    a = $('#'+row+'_1').text();
                    b = $('#'+row+'_2').text();                     
                    TD.innerHTML = +a + +b;
                }}}