extjs 两个文本框输入值 另一个文本框的值自动计算
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了extjs 两个文本框输入值 另一个文本框的值自动计算相关的知识,希望对你有一定的参考价值。
自动计算这两个文本框的积(就是乘法)
var txtAmount = new Ext.form.TextField(
fieldLabel : '数量',
name : 'purchaseVo.amount',
allowBlank : false
);
var txtUnitPrice = new Ext.form.TextField(
fieldLabel : '单价',
name : 'purchaseVo.unitPrice',
allowBlank : false
);
var txtTotalMoney = new Ext.form.TextField(
fieldLabel : '总金额',
name : 'purchaseVo.totalMoney',
allowBlank : false
);
//自动计算总金额的方法是不是放在总金额那里
input自带方法oninput & onpropertychange 监听事件
<html><head>
<title></title>
<script type="text/javascript">
function OnInput(event) //兼容其他浏览器及IE9以上版本
alert("当前值: " + event.target.value);
// Internet Explorer
function OnPropChanged(event) //兼容IE9以下版本
if (event.propertyName.toLowerCase() == "value")
alert("当前值: " + event.srcElement.value)
</script>
</head>
<body>
<input type="text" oninput="OnInput (event)" onpropertychange="OnPropChanged (event)">
</body>
</html>
提示到这里,怎么实现还是自己想办法较好!
如有问题请继续追问,望采纳!
追问我补充了代码,就是那个方法怎么写
追答方法不是已经给你了吗,在两个需要计算的文本框加上oninput和onpropertychange属性,然后调用你的算法,算了代码给你粘出来!
<html><head>
<title></title>
<script type="text/javascript">
function OnInput() //兼容其他浏览器及IE9以上版本
var a = eval(document.getElementById('a')).value;//Jquery:var a=$("#a").val();
var b = eval(document.getElementById('b')).value;
var d = a * b;
document.getElementById("c").value = d;
// Internet Explorer
function OnPropChanged(event) //兼容IE9以下版本
var a = eval(document.getElementById('a')).value;//Jquery:var a=$("#a").val();
var b = eval(document.getElementById('b')).value;
var d = a * b;
document.getElementById("c").value = d;
</script>
</head>
<body>
<input type="text" id="a" oninput="OnInput()" onpropertychange="OnPropChanged()">
*<input type="text" id="b" oninput="OnInput()" onpropertychange="OnPropChanged()">
=<input type="text" id="c"value="">
</body>
</html> 参考技术A
参考下,校验什么的需要自己完善下
title: 'Contact Info',
width: 300,
bodyPadding: 10,
renderTo: Ext.getBody(),
items: [
xtype: 'textfield',
itemId: 'num1',
fieldLabel: '数值1',
vtype: 'alphanum',
listeners:
blur:function(obj)
debugger;
var num3 = obj.ownerCt.getComponent('num3');
var num2 = obj.ownerCt.getComponent('num2').value;
if(num2!=null)
num3.setValue(obj.value*num2);
,
xtype: 'textfield',
itemId: 'num2',
fieldLabel: '数值2',
vtype: 'alphanum',
listeners:
blur:function(obj)
var num3 = obj.ownerCt.getComponent('num3');
var num1 = obj.ownerCt.getComponent('num1').value;
if(num1!=null)
num3.setValue(obj.value*num1);
,
xtype: 'textfield',
itemId: 'num3',
fieldLabel: '乘积'
]
);追问
我补充了代码,就是那个方法怎么写
追答是数量和单价输入完成后就完成计算
如果有先后顺序的话,哪个后输入完,就放在哪里做计算
哈喽你写的这 debugger;是用来干嘛的,调试?
追答是的,需要多熟悉下api
有疑问可以到群里问下
好像没有反应。。
追答用ff或者chrome, 打开后按f12
再操作
没有火狐和谷歌。。用了其他浏览器按了f12没有提示错误,一定要用这两个浏览器吗- -,这个f12我最近也在用的,两个listeners都要写吗,我都放进去了。
追答要确认下数量和单价有没有要求输入的顺序
如果没有的话,两个都要加了,如果有,就加在后面输入的那个控件
debugger 不会提示错误额
你可以在debugger前加alert
能具体点吗,我初学
追答在定义第2个文本框的时候添加listners:blur:function()事件 该事件里面填写获取第1 2 两个文本框的值 然后相乘 给第3个赋值就可以了
以上是关于extjs 两个文本框输入值 另一个文本框的值自动计算的主要内容,如果未能解决你的问题,请参考以下文章