[英]Why is my change handler never being fired?
I've got this jQuery, derived from what was posted by Gregor Primar here : 我有这个jQuery,它是从Gregor Primar 在这里发布的内容派生而来的:
/* Whenever boxGrandTotal changes (which it does when any amount is entered in any of the "amount" input text elements), disable the save button if there is a discrepancy between the totals */ / *每当boxGrandTotal发生变化时(在任何“金额”输入文本元素中输入任何金额时都会执行此操作),如果总计之间存在差异,则禁用保存按钮* /
$(document).on("change", '[id$=boxGrandTotal]', function () {
//var savebutton = $("[id$=btnSave]");
alert('entered the change handler for boxGrandTotal');
var savebutton = document.getElementById('[id$=btnSave]');
var payment = parseFloat(document.getElementById('[id$=boxPaymentAmount]').value).toFixed(2);
var total = parseFloat(document.getElementById('[id$=boxGrandTotal]').value).toFixed(2);
if (payment == null) payment = 0;
if (total == null) total = 0;
if (payment == total) {
savebutton.attr("disabled", false);
return true;
} else {
alert('Total and Payment Total do not match. Please enter the same amount for both values and try again!');
savebutton.attr("disabled", true);
return false;
}
});
This should fire any time boxGrandTotal is updated, right? 这应该在boxGrandTotal更新时触发,对吗? It is, indeed, being updated, but I never see "entered the change handler for boxGrandTotal" 实际上,它正在更新,但是我从未见过“为boxGrandTotal输入了更改处理程序”
And there is a TextBox / text input element whose ID ends with "boxGrandTotal"; 且有一个TextBox /文本输入元件,其ID以“boxGrandTotal”结束; here is how it is created in the code-behind: 这是在后面的代码中如何创建的:
boxGrandTotal = new TextBox()
{
CssClass = "dplatypus-webform-field-input",
ID = "boxGrandTotal"
};
So why is the 'change' handler not firing, when the value in boxGrandTotal is changing? 那么,为什么是“变”处理不点火,当boxGrandTotal值被改变? Does it only fire if the value is manually changed? 仅在手动更改值时才会触发吗? If so, what is a workaround? 如果是这样,有什么解决方法?
In response to kalkanbatuhan's suggestion, changing my code-behind to this: 为了响应kalkanbatuhan的建议,将我的代码后面更改为:
boxGrandTotal = new TextBox()
{
CssClass = "dplatypus-webform-field-input",
ID = "boxGrandTotal",
ClientIDMode = System.Web.UI.ClientIDMode.Static
};
...emits two compiler-borne errors, to be specific: ...发出两个编译器错误,具体来说:
'System.Web.UI.WebControls.TextBox' does not contain a definition for 'ClientIDMode' “ System.Web.UI.WebControls.TextBox”不包含“ ClientIDMode”的定义
-and: -和:
The type or namespace name 'ClientIDMode' does not exist in the namespace 'System.Web.UI' (are you missing an assembly reference?) 类型或名称空间名称“ ClientIDMode”在名称空间“ System.Web.UI”中不存在(您是否缺少程序集引用?)
BTW*, this is how the value in boxGrandTotal gets changed: 顺便说一句*,这是boxGrandTotal中的值如何更改的方式:
$(document).on("blur", '.amountbox', function (e) {
var amount1 = $('[id$=boxAmount1]').val() != '' ? parseFloat($('[id$=boxAmount1]').val()) : 0;
var amount2 = $('[id$=boxAmount2]').val() != '' ? parseFloat($('[id$=boxAmount2]').val()) : 0;
var amount3 = $('[id$=boxAmount3]').val() != '' ? parseFloat($('[id$=boxAmount3]').val()) : 0;
var amount4 = $('[id$=boxAmount4]').val() != '' ? parseFloat($('[id$=boxAmount4]').val()) : 0;
var amount5 = $('[id$=boxAmount5]').val() != '' ? parseFloat($('[id$=boxAmount5]').val()) : 0;
var grandtotal = amount1 + amount2 + amount3 + amount4 + amount5;
$('[id$=boxGrandTotal]').val(parseFloat(grandtotal).toFixed(2));
});
try this one 试试这个
boxGrandTotal = new TextBox()
{
CssClass = "dplatypus-webform-field-input",
ID = "boxGrandTotal",
ClientIDMode =System.Web.UI.ClientIDMode.Static
};
The solution is to add a ".trigger("change")" to the code that assigns the value, so that, instead of being this: 解决方案是在分配值的代码中添加“ .trigger(“ change”)“”,这样,而不是这样:
$('[id$=boxGrandTotal]').val(parseFloat(grandtotal).toFixed(2));
...it is this: ...就是这个:
$('[id$=boxGrandTotal]').val(parseFloat(grandtotal).toFixed(2)).trigger("change");
In more detail, the change event has to be explicitly fired when the value is changed (notice the appended ".trigger()" jazz): 更详细地讲,更改值时必须显式触发change事件(请注意附加的“ .trigger()” jazz):
$(document).on("blur", '.amountbox', function (e) {
var amount1 = $('[id$=boxAmount1]').val() != '' ? parseFloat($('[id$=boxAmount1]').val()) : 0;
. . .
var grandtotal = amount1 + amount2 + amount3 + amount4 + amount5;
$('[id$=boxGrandTotal]').val(parseFloat(grandtotal).toFixed(2)).trigger("change");
});
...and then this code works pretty well: ...然后这段代码运行良好:
/* Whenever boxGrandTotal changes (which it does when any amount is entered in any of the "amount" input text elements), disable the save button if there is a discrepancy between the totals */
$(document).on("change", '[id$=boxGrandTotal]', function () {
var savebutton = document.getElementById('[id$=btnSave]');
var payment = $('[id$=boxPaymentAmount]').val() != '' ? parseFloat($('[id$=boxPaymentAmount]').val()) : 0;
var total = $('[id$=boxGrandTotal]').val() != '' ? parseFloat($('[id$=boxGrandTotal]').val()) : 0;
if (payment == null) payment = 0;
if (total == null) total = 0;
if (payment == total) {
savebutton.attr("disabled", false);
return true;
} else {
alert('Total and Payment Total do not match. Please enter the same amount for both values and try again!');
//savebutton.attr("disabled", true);
savebutton.prop("disabled", true);
return false;
}
});
I say " pretty well " rather than " stupendously splendiferous ", because the save button is not being disabled. 我说“ 很好 ”,而不是“ 出色 ”,因为未禁用“保存”按钮。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.