[置顶] Ext.Net 1.x_Ext.Net.GridPanel字体格式化、颜色配置

财务报表通常有这样的需求:数值千分位,靠右显示,字体颜色

解决办法:

方法一:<ext:NumberColumn Format="0,000"

                    <ext:NumberColumn  ColumnID="Aug" Header="Aug" DataIndex="Jun"   Align="Right"  Width="80">
                         <Renderer Fn="change"/>
                    </ext:NumberColumn>


方法二:javaScript处理

                var template = '<span style="color:{0};">{1}</span>';

                var change = function (value) {
                    return Qfw(String.format(template, (value > 0) ? "green" : "red", value).toString());
                };
        function FormatStatus(value) {
            var temp = "";
                switch(value){
                    case '待业务员撰写':
                        temp = String.format(template2, "Crimson", value).toString();
                        break;
                    case '待业务经理审核':
                        temp = String.format(template2, "DarkMagenta", value).toString();
                        break;
                    case '待项目经理分配':
                        temp = String.format(template2, "Blue", value).toString();
                        break;
                    case '待工程师建BOM':
                        temp = String.format(template2, "YellowGreen", value).toString();
                        break;
                    case '待开发采购询价':
                        temp = String.format(template2, "Purple", value).toString();
                        break;
                    case '待工程师复核':
                        temp = String.format(template2, "FireBrick", value).toString();
                        break;
                    case '项目已终止':
                        temp = String.format(template2, "gray", value).toString();
                        break;
                    default:
                        temp = String.format(template2, "gray", value).toString();
                        break;  
                }
                return String.format(temp, value);
        };

效果:

[置顶] Ext.Net 1.x_Ext.Net.GridPanel字体格式化、颜色配置_第1张图片

方法四:
function Qfw(num) {
                    num = num + "";
                    if (num.indexOf(',') > 0) {
                        num = num.replace(/,/gi, '') + "";
                    }
                    var re = /(-?\d+)(\d{3})/
                    while (re.test(num)) {
                        num = num.replace(re, "$1,$2")
                    }

                    return num;
                }   

属性:靠右:Align="Right"

方法五:自定义 超连接与日期显示函数

        function Details(v) {
            var temp = '<a href="Edit.aspx?AutoId={0}" target="_blank">详细…</a>';
            return String.format(temp, v);
        };
        function CSRQ(v) {
                return String.format("{0}年{1}月{2}日",
                                    v.substr(0, 4),
                                    v.substr(4, 2),
                                    v.substr(6, 2));
        };

 方法六:

Grid中显示格式:

                             <ext:Column Header="报价日期" DataIndex="报价日期"  Width="80" > 
                              <Renderer Fn="Ext.util.Format.dateRenderer('Y-m-d ')" />    
                             </ext:Column>

效果:

date控件的默认值

 this.dfenddate.SetValue(DateTime.Now .ToShortDateString());

Class Date

Package: Global
Class: Date
Extends: Object
Defined In: Date.js

日期的处理和格式化是 PHP's date() function的一个子集,提供的格式和转换后的结果将和 PHP 版本的一模一样。下面列出的就是目前所有支持的格式:
Sample date:
'Wed Jan 10 2007 15:05:01 GMT-0600 (Central Standard Time)'

 格式符    输出         说明
------  ----------  --------------------------------------------------------------
  d      10         月份中的天数,两位数字,不足位补“0”
  D      Wed        当前星期的缩写,三个字母
  j      10         月份中的天数,不补“0”
  l      Wednesday  当前星期的完整拼写
  S      th         英语中月份天数的序数词的后缀,2个字符(与格式符“j”连用)
  w      3          一周之中的天数(1~7)
  z      9          一年之中的天数(0~365)
  W      01         一年之中的周数,两位数字(00~52)
  F      January    当前月份的完整拼写
  m      01         当前的月份,两位数字,不足位补“0”
  M      Jan        当前月份的完整拼写,三个字母
  n      1          当前的月份,不补“0”
  t      31         当前月份的总天数
  L      0          是否闰年(“1”为闰年,“0”为平年)
  Y      2007       4位数字表示的当前年数
  y      07         2位数字表示的当前年数
  a      pm         小写的“am”和“pm”
  A      PM         大写的“am”和“pm”
  g      3          12小时制表示的当前小时数,不补“0”
  G      15         24小时制表示的当前小时数,不补“0”
  h      03         12小时制表示的当前小时数,不足位补“0”
  H      15         24小时制表示的当前小时数,不足位补“0”
  i      05         不足位补“0”的分钟数
  s      01         不足位补“0”的秒数
  O      -0600      用小时数表示的与 GMT 差异数
  T      CST        当前系统设定的时区
  Z      -21600     用秒数表示的时区偏移量(西方为负数,东方为正数)
用法举例:(注意你必须在字母前使用转意字符“\\”才能将其作为字母本身而不是格式符输出)
var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
document.write(dt.format('Y-m-d'));                         //2007-01-10
document.write(dt.format('F j, Y, g:i a'));                 //January 10, 2007, 3:05 pm
document.write(dt.format('l, \\t\\he dS of F Y h:i:s A'));  //Wednesday, the 10th of January 2007 03:05:01 PM
下面有一些标准的日期/时间模板可能会对你有用。它们不是 Date.js 的一部分,但是你可以将下列代码拷出,并放在 Date.js 之后所引用的任何脚本内,都将成为一个全局变量,并对所有的 Date 对象起作用。你可以按照你的需要随意增加、删除此段代码。
Date.patterns = {
    ISO8601Long:"Y-m-d H:i:s",
    ISO8601Short:"Y-m-d",
    ShortDate: "n/j/Y",
    LongDate: "l, F d, Y",
    FullDateTime: "l, F d, Y g:i:s A",
    MonthDay: "F d",
    ShortTime: "g:i A",
    LongTime: "g:i:s A",
    SortableDateTime: "Y-m-d\\TH:i:s",
    UniversalSortableDateTime: "Y-m-d H:i:sO",
    YearMonth: "F, Y"
};
用法举例:
var dt = new Date();
document.write(dt.format(Date.patterns.ShortDate));


 

 


 

你可能感兴趣的:(JavaScript,function,header,ext,报表)