jsGrid编辑付款金额 [英] jsGrid edit payment amount

问题描述

我使用jsGrid JQuery插件来显示和编辑付款。虽然这是一个很好的选择，但我无法使用内置字段来编辑付款金额。如果我使用数字类型，则无法在小数点后输入数字。如果我使用文本类型，我可以输入非数字值。

这是我的代码到目前为止

  $（＃jsGrid ）.jsGrid（{
 width：100％，
 height：auto，
 
编辑：true，
分页：true，
 autoload：true，
 
 loadIndication：true，
 loadIndicationDelay：500，
 loadMessage：Please，wait ...，
 loadShading：true，
 
控制器：{
 loadData：function（）{
 return $ .ajax（{
类型：GET，
 url：AJAX_URL_GET_CALCULATED_AFFECTED_PAYMENTS，
 data：{'startDate'：startDate，'endDate'：endDate}，
 dataType：json，
 cache：false，
}）; 
}，
 
 $ b {name：PaymentDate，标题：付款日期，类型：text，宽度：150，编辑：false，}，
 {名称：PaymentEndDate，标题：付款结束日期，类型：text，宽度：150，编辑：false，}，
 {名称：PaymentStatusDisplay，标题：付款状态 text，width：150，align：center，editing：false，}，
 {
 name：PaymentAmount，标题：Payment Amount，类型：number 100，align：center，edit：true，
 itemTemplate：function（value）{
 return$+ value; 
}，
}，
 {type：control，deleteButton：false，editButton：true，editButtonTooltip：Edit Amount，} 
] 
}） ; 
  

有没有人使用这个插件获得了一个例子或者设法创建一个自定义字段类型或者使用字段模板在jsGrid中编辑一个字段只允许货币值（数字，逗号，小数点）

预先感谢您。

pre $函数MoneyField（） config）{
jsGrid.NumberField.call（this，config）;


MoneyField.prototype = new jsGrid.NumberField（{

itemTemplate：function（value）{
return$+ value.toFixed （2）;
}

filterValue：function（）{
return parseFloat（this.filterControl.val（）|| 0）;
}，

insertValue：function（）{
return parseFloat（this.insertControl.val（）|| 0）;
}，

editValue：function（） {
return parseFloat（this.editControl.val（）|| 0）;
}

}）;

jsGrid.fields.money = MoneyField;

现在您可以在 type =money

I am using jsGrid JQuery plugin to display and edit payments. Although it is an excellent option I am unable to use the build-in fields to edit a 'Payment Amount'. If I use the 'number' type, I am not able to enter digits after the decimal place. If I use the 'text' type I can enter non-numeric values.

Here is my code so far

    $("#jsGrid").jsGrid({
        width: "100%",
        height: "auto",

        editing: true,
        paging: true,
        autoload: true,

        loadIndication: true,
        loadIndicationDelay: 500,
        loadMessage: "Please, wait...",
        loadShading: true,

        controller: {
            loadData: function () {
                return $.ajax({
                    type: "GET",
                    url: AJAX_URL_GET_CALCULATED_AFFECTED_PAYMENTS,
                    data: { 'startDate': startDate, 'endDate': endDate },
                    dataType: "json",
                    cache: false,
                });
            },
        },
        fields: [
            { name: "PaymentDate", title: "Payment Date", type: "text", width: 150, editing: false, },
            { name: "PaymentEndDate", title: "Payment End Date", type: "text", width: 150, editing: false, },
            { name: "PaymentStatusDisplay", title: "Payment Status", type: "text", width: 150, align: "center", editing: false, },
            {
                name: "PaymentAmount", title: "Payment Amount", type: "number", width: 100, align: "center", editing: true,
                itemTemplate: function(value) {
                    return "$" + value;
                },
            },
            { type: "control", deleteButton: false, editButton: true, editButtonTooltip: "Edit Amount", }
        ]
    });

Has anyone used this plugin got an example or managed to create a custom field type or use the field templates to edit a field in jsGrid to only allow currency values (number, comma, decimals)

Thank you in advance.

解决方案

You can define your custom field like the following:

function MoneyField(config) {
    jsGrid.NumberField.call(this, config);
}

MoneyField.prototype = new jsGrid.NumberField({

    itemTemplate: function(value) {
        return "$" + value.toFixed(2);
    }

    filterValue: function() {
        return parseFloat(this.filterControl.val() || 0);
    },

    insertValue: function() {
        return parseFloat(this.insertControl.val() || 0);
    },

    editValue: function() {
        return parseFloat(this.editControl.val() || 0);
    }

});

jsGrid.fields.money = MoneyField;

Now you can use it in field specifing type="money"

这篇关于jsGrid编辑付款金额的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！