如何设置从editform动态计算的jqgrid值

时间:2013-01-22 20:06:30

标签: jquery jqgrid

我有jqgrid列事务ID,借记,贷方和余额。 借方和贷方是从数据库中填充的,余额是通过信用差额 - 借方的差额计算得出的。 编辑以editform完成。一旦用户更改了借方或贷方的其中一个值,我需要在网格的选定行中更新余额列。

非常感谢任何帮助。

$myGrid.jqGrid({                
url: myURL + '?method=GetTranactions', 
postData: { 
    prID: function() { return getProv(); },
    mn: function() { return $("#month option:selected").val(); },
    yr: function() { return $("#year option:selected").val(); }
},
datatype: 'json', 
mtype: 'POST',
colNames:['Trx ID','Debit','Credit','Balance',],
colModel :[
    {name:'accttrx_id',index:'accttrx_id', width:75, sorttype:"int", editable:true},
    {name:'debit',index:'debit', 
        width:70, 
        align:"right",
        formatter:'number',
        sorttype:"number",
        editable:true,
        edittype:"text",
        editoptions:{
            size:20,
            defaultValue:'0',                                       
            dataEvents: [   
                {
                    type: 'change',
                    fn: function(e) {
                        var db = $(e.target).val();
                        var cr = $('#credit').val();
                        bal = cr - db;  // got the balance 
                        alert(bal); // how to update balance column for current row?
                        }
                    }
                ]

            },
        editrules:{required:true},
        formoptions:{elmprefix:"(*)"}
        },
    {name:'balance',index:'balance',
        width:70, 
        align:"right",
        formatter:'number',
        sorttype:"number",
        editable:false},....

............................................... .....................

$myGrid.navGrid('#pager', {
search:false,
edit:true,edittitle:"Edit Transation",
add:true,addtitle:"Add Transaction",
refresh:true,
del:true,deltitle:"Delete Transaction"
},
{
beforeShowForm: 
    function(form) { 
        $('#tr_accttrx_id', form).hide();                           
    },
    afterSubmit:
    ..... update balance after submit?

1 个答案:

答案 0 :(得分:1)

对于editForm中的自定义计算,就像您在此处所描述的那样,我通常会将代码放在beforeShowForm函数中,如您在此处所述。请使用类似的内容:

beforeShowForm: function() {
    $('#debit,#credit').change(function(){
        $('#balance').val( parseFloat($('#credit').val()) - parseFloat($('#debit').val()) );
    });
},
reloadAfterSubmit: true,
...

jQuery选择器(例如$('#balance'))使用jqGrid列的名称作为ID选择器。我这样做是因为我知道jqGrid将列名称作为编辑表单中的输入元素ID。

提交后重新加载(在网格中显示更新的信息)

要在网格中显示新的余额值,请使用编辑表单的reloadAfterSubmit属性,我在上面的示例中包含该属性。请验证,您正在使用表单编辑或内联编辑?如果您正在使用表单编辑,那么我的答案中的代码应该有效,如果应该与editGridRow方法一起使用。见这里:http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing

parseFloat和钱的问题很少

虽然上面的代码应该在大多数情况下都有效,但请注意,不应该使用parseFloat命令来进行金钱计算。我以前遇到过这个问题。相反,您可以使用BigDeciaml package