Easyui NumberBox格式化展示

格式化效果:

源代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Format NumberBox - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../demo.css">
    <script type="text/javascript" src="../../jquery.min.js"></script>
    <script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
    <h2>Format NumberBox</h2>
    <p>Number formatting is the ability to control how a number is displayed.</p>
    <div style="margin:20px 0;"></div>
    <table>
        <tr>
            <td>Number in the United States</td>
            <td><input class="easyui-numberbox" value="1234567.89" data-options="precision:2,groupSeparator:‘,‘"></input></td>
        </tr>
        <tr>
            <td>Number in France</td>
            <td><input class="easyui-numberbox" value="1234567.89" data-options="precision:2,groupSeparator:‘ ‘,decimalSeparator:‘,‘"></input></td>
        </tr>
        <tr>
            <td>Currency:USD</td>
            <td><input class="easyui-numberbox" value="1234567.89" data-options="precision:2,groupSeparator:‘,‘,decimalSeparator:‘.‘,prefix:‘$‘"></input></td>
        </tr>
        <tr>
            <td>Currency:EUR</td>
            <td><input class="easyui-numberbox" value="1234567.89" data-options="precision:2,groupSeparator:‘,‘,decimalSeparator:‘ ‘,prefix:‘€‘"></input></td>
        </tr>
        <tr>
            <td></td>
            <td><input class="easyui-numberbox" value="1234567.89" data-options="precision:2,groupSeparator:‘ ‘,decimalSeparator:‘,‘,suffix:‘€‘"></input></td>
        </tr>
    </table>

</body>
</html>
时间: 2024-10-05 05:41:41

Easyui NumberBox格式化展示的相关文章

Spring mvc+easyui做列表展示及分页

Spring mvc有一个注解@ResponseBody可以自己将返回数据解析成json,不用在response.getWriter(),设置response的编码之类的. 1.首先在spring-mvc.xml中配置如下 <bean id="mappingJacksonHttpMessageConverter"         class="org.springframework.http.converter.json.MappingJacksonHttpMessag

easyui numberbox输入框 编辑不可编辑的切换

背景:申请单里需要选费用类型,费用类型有的有子明细项,有个合计项    当有子明细项的时候,合计项的值是通过弹出的子明细项价格的总和(设置为可编辑没问题,因为点击出来弹框,编辑不了)    没有子明细项的时候,合计项直接手填   当费用类型没有选择的时候,合计项设置为不可编辑状态 首先: 找到需要编辑的numberbox $aplgrid:easyui 的grid 容器 iExpenseClaimItemIndex:行索引 AmountWithTax: 指定列 var edNumberbox =

EasyUI - NumberBox组件

效果: html代码: <input type ="text" id ="box"/> JS代码: $(function () { $('#box').numberbox({ //value: 10,//设置默认值 //min:20,//设置最小最,在页面中显示 //max:50,//设置最大值,在页面中显示 precision: 2,//显示在数字后面的精度值. //decimalSeparator: ':',//使用那种字符进行分割精度,默认是点,如

EasyUI datagrid 格式化显示数据

http://blog.163.com/[email protected]/blog/static/103242241201512502532379/ 设置formatter属性,是一个函数,格式化函数有3个参数: The cell formatter function, take three parameters:value: the field value.rowData: the row record data.rowIndex: the row index. 一.格式化显示性别 后台传过

easyui numberbox一些常用属性,方法

1.value="1234567.89"//数字框中的值 2.precision:2//精度(小数点后两位) 3.groupSeparator:','//(组分隔符) 4.decimalSeparator:' '//(替代小数点的分隔符) 5.prefix:'€'"//(前缀符) 6.suffix:'$'//(后缀符) 7.min,max(最小值,最大值) *.getvalue, setvalue,clear,reset $('#nn').numberbox('setValu

jQuery EasyUI NumberBox(数字框)的用法

这里的options是选项,可以参考下表: 选项名 类型 描述 默认值 min 数字 文本框中可允许的最小值 null max 数字 文本框中可允许的最大值 null precision 数字 最高可精确到小数点后几位 0 例如:金额输入框 最大值为“99999.99” 精确到两位小数. <input name="money" id="money" type="text" class="easyui-numberbox"

EasyUI时间格式化

changeDateFormatNodate: function (cellval) { var date = new Date(parseInt(cellval.replace("/Date(", "").replace(")/", ""), 10)); var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours()

easyui datagrid 格式化列显示两位小数、千分位

{ field: "contractmoney", title: "合同总价", width: 72, formatter: function (value, row, index) { if (row != null) { return parseFloat(value).toFixed(2); } } }, //二位小数.千分位 { field: "price", title: "单价", width: 60, align

MVC模式下的数据展示:EasyUI的datagrid

我的数据库设计是一张老师表teacher,一张学生表student,一个教师对应多个学生,在学生一方建立外键; 还有一点想清楚,需要展示的数据是根据什么来的,是成功登陆的用户的id?还是直接展示所有的学生? student表 教师表: 我是习惯性的从后写到前,这里展示的是登录成功的老师下的学生信息 1 建立项目,建立好对应的包以及工具包 2建立好与数据库对应的实体类 package com.zr.model; public class Student { private int sid; pri