Extjs4 在网格中添加记录的单元格值,并在extjs中记录的最后一个单元格中获得结果
这里我的网格名称是“rightpanel”。我正在尝试添加输入的值 在记录的每个单元格中,显示最后一个单元格中的总数 记录的单元格/列。但我面临着一个计算 总的努力与登录如下所示。他们有任何其他方式来登录吗 实现这一点?Extjs4 在网格中添加记录的单元格值,并在extjs中记录的最后一个单元格中获得结果,extjs4,sum,extjs-mvc,Extjs4,Sum,Extjs Mvc,这里我的网格名称是“rightpanel”。我正在尝试添加输入的值 在记录的每个单元格中,显示最后一个单元格中的总数 记录的单元格/列。但我面临着一个计算 总的努力与登录如下所示。他们有任何其他方式来登录吗 实现这一点? 在这里,我在单元格中插入时间(例如-->2.03)。谢谢& 问候 var selectionModel = new Ext.selection.CheckboxModel(); var fm=Ext.form; var currentRecord;
在这里,我在单元格中插入时间(例如-->2.03)。谢谢& 问候
var selectionModel = new Ext.selection.CheckboxModel();
var fm=Ext.form;
var currentRecord;
var oldValue;//used to store old effort while re-editing the already entered cell
Ext.define('AM.view.rightpanel' ,{
extend:'Ext.grid.Panel',
alias : 'widget.rightpanel',
selModel : selectionModel,
store : 'addtaskstore',
id : 'rightpanel',
columnLines : true,
width:724,
selType: 'cellmodel',
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1,
pluginId:'rightPanelEditor'
})
],
此侦听器用于侦听单击每个单元格并捕获该单元格中的旧值,以支持我的逻辑
listeners:{
cellclick:function(thisObj, td, cellIndex, record, tr, rowIndex, e, eOpts)
{
var dataIndex = thisObj.getHeaderCt().getHeaderAtIndex(cellIndex).dataIndex;
if(eval(record.get(dataIndex))< 12) //changes made after main logic
{
oldValue = record.get(dataIndex);
}
currentRecord = record;
}
},
title:'TIMESHEET',
columns: [
{
header: 'Tasks',
dataIndex: 'task_name',
width: 160
},
{
header: 'Project Name',
dataIndex: 'project_name',
width: 160
},
{
dataIndex: 'monday',
width: 95,
id:'monday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'tuesday',
width: 95,
id:'tuesday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'wednesday',
width: 95,
id:'wednesday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'thursday',
width: 95,
id:'thursday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'friday',
width: 95,
id:'friday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'saturday',
width: 95,
id:'saturday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
dataIndex: 'sunday',
width: 95,
id:'sunday',
editor:{
xtype:'textfield',
listeners:{
'blur':function(o, t, h){
if(validateEffort(o)){
calculateTotal(o.value);
}
}
}
}
},
{
header: 'Total Efforts',
dataIndex: 'total_efforts',
width: 95,
editor:{
xtype:'textfield',
disabled:true
}
}
],
initComponent: function() {
this.callParent(arguments);
}
});
此函数用于计算在我的列中显示的总工作量(时间),数据索引为“总工作量”
function calculateTotal(newValue){
//alert("old = "+oldValue + " new = " +newValue);
oldValue = oldValue?oldValue:0.00;
if(currentRecord && oldValue !=newValue){
var currTotal = currentRecord.get('total_efforts');
//alert("currTotal=="+currTotal);
if(!currTotal || currTotal == 'NaN'){
currTotal = 0.00;
}
currentRecord.set('total_efforts',((eval(currTotal)+eval(newValue)-eval(oldValue))).toFixed(2));
var newcurrTotal = currentRecord.get('total_efforts');
var arr = [];
arr=newcurrTotal.split(".");
//alert("arr[1]--> " +arr[1]);
//alert(newcurrTotal);
if(eval(arr[1])>=60)
{
var q =parseInt(eval(arr[1])/60);
//alert("q --> "+parseInt(q));
var r = (eval(arr[1])%60)/100;
//alert("r --> "+r);
var newtotal = eval(newcurrTotal)+eval(q)-(eval(arr[1])/100)+r;
alert("new---> "+newtotal.toFixed(2));
//currentRecord.set('total_efforts',newtotal.toFixed(2));
}
//alert("new total=="+currentRecord.get('total_efforts'));
}
}
利用网格的
edit
事件,该事件在单元格(或行)编辑完成时触发
var grid = Ext.create('Ext.grid.Panel', {
plugins [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
columns: title:'TIMESHEET',
columns: [{
dataIndex: 'monday',
width: 95,
id:'monday',
editor: {
xtype: 'numberfield',
regex: /(^([0-9]|[0-1][0-9]|[2][0-3]).([0-5][0-9])$)|(^([0-9]|[1][0-2])$)/
}
}, // ... other days of week
{
header: 'Total Efforts',
dataIndex: 'total_efforts',
width: 95
}]
});
grid.on('edit', function(editor, e) {
var record = e.record,
total = 0;
// this isn't the most efficient with recalculating the total every time but it
// really shouldn't matter.
total += record.get('monday') || 0;
total += record.get('tuesday') || 0;
total += record.get('wednesday') || 0;
total += record.get('thursday') || 0;
total += record.get('friday') || 0;
total += record.get('saturday') || 0;
total += record.get('sunday') || 0;
record.set('total_efforts', total);
});
这也是我在这种情况下所做的一般概念。
var grid = Ext.create('Ext.grid.Panel', {
plugins [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
columns: title:'TIMESHEET',
columns: [{
dataIndex: 'monday',
width: 95,
id:'monday',
editor: {
xtype: 'numberfield',
regex: /(^([0-9]|[0-1][0-9]|[2][0-3]).([0-5][0-9])$)|(^([0-9]|[1][0-2])$)/
}
}, // ... other days of week
{
header: 'Total Efforts',
dataIndex: 'total_efforts',
width: 95
}]
});
grid.on('edit', function(editor, e) {
var record = e.record,
total = 0;
// this isn't the most efficient with recalculating the total every time but it
// really shouldn't matter.
total += record.get('monday') || 0;
total += record.get('tuesday') || 0;
total += record.get('wednesday') || 0;
total += record.get('thursday') || 0;
total += record.get('friday') || 0;
total += record.get('saturday') || 0;
total += record.get('sunday') || 0;
record.set('total_efforts', total);
});