我的Internet Explorer存在问题(现在是v 10)我有2个单选按钮是/否带有确认框,如果用户单击取消,则该值应该返回原始值
Ex:是默认值。用户点击否,弹出显示 - 用户取消应该回到是。 问题......价值不会改变它停留在否
我的代码在FireFox和GoogleChrome上正常工作
请参阅jsFiddle(您必须在IE10中打开它我认为......)
enter code here
https://jsfiddle.net/grosjambon/nxy0g1cg/
如果jsfiddle不起作用,请评论
EDIT1
在这里发现了一些有用的东西,但有一些问题。当我尝试以Knockout在Click Binding中执行的方式将多个参数绑定到函数时,当" person"确认更改值,单选按钮中的值不会更新(两个收音机里面都没有任何内容)
HTML
<input class="radio-inline" type="radio" data-bind="click: function(data,event){confirmCheck2(lang('Options1'),false, '1Group0', data, event)}, checked: IsSomething,checkedValue: true" />
<input class="radio-inline" type="radio" data-bind="click: function(data,event){confirmCheck2(lang('Options1'),true, '1Group0', data, event)}, checked: IsSomething,checkedValue: false" />
ViewModel(Knockout)Ok确认有问题的方法(两个无线电都是空的)
m.confirmCheck2 = function (propertyName, inputValue, stepName, data, event) {
console.log(event);
if (!confirm("Are you sure?")) {
event.stopImmediatePropagation();
return false;
}
return true;
}
工作但没有额外属性的方法
HTML
<input class="radio-inline" type="radio" data-bind="click: confirmCheck, checked: IsITARAndCGP,checkedValue: true" />
视图模型
m.confirmCheck = function (data, event) {
console.log(data);
console.log(event);
if (!confirm("Are you sure?")) {
event.stopImmediatePropagation();
return false;
}
return true;
}
编辑2 所以在回复之间我找到了一个使用Roy的旧答案的解决方案。 P.S如果我们使问题复杂化:所以我有多个属性m.Property1 m.Property2,m.Property3。当1为True时所有其他都为假,如果True属性为False,则一切都为假。只有1个值是真的。
因此,在您更改值时,使用之前的RoyJ答案,它将触发具有Confirm Popup的每个属性的订阅,因为所有3属性都会触发相同的确认。
var showPopup = true;
m.Property1.subscribe(function () {
var inputValue = m.Property1();
if (showPopup) {
if (confirm(f.lang("Message"))) {
showPopup = false;//Disable showPopup because we set value inside resetValueFunction
resetValueWithCondition("Property1"), inputValue);
} else { // if cancel
showPopup = false;
m.Property1(!inputValue);
return true;//Exit code
}
}
showPopup = false;//Disable showPopup because we set value inside resetValueFunction
resetValueWithCondition("Property2", inputValue);
showPopup = true;
});
m.Property2.subscribe(function () {
var inputValue = m.Property2();
if (showPopup) {
if (confirm(f.lang("Message"))) {
showPopup = false;//Disable showPopup because we set value inside resetValueFunction
resetValueWithCondition("Property2", inputValue);
} else { // if cancel
showPopup = false;
m.Property2(!inputValue);
return true;//Exit code
}
}
showPopup = true;
});
函数resetValueWithCondition
function resetValueWithCondition(propertyName,inputValue) {
if (!m.Property1() && !m.Property2()) {//In this If I hide every field in my form and set Property 1 and Property2.... to false.
//m.Step1Visiblity(false);
resetFormValueAfterStepPosition('1Group0');//Reset all form field
setPropertyValue(false, false);//Here is simply m.Property1(false) etc...
} else {
resetFormValueAfterStepPosition('1Group0');//Reset all form field
if (inputValue == true) {//Only perform this method if Property goes to True, otherwise don't execute (otherwise it trigger the confirm box multiple time when I Set Propertyvalue
m.visibilityLogic(propertyName);//Set PropertyValue to either true,false or false,true if is it property1 or property2
}
}
}
答案 0 :(得分:1)
你过分关注表单并且对你的模型不够。而不是摆弄与单选按钮相关的事件,与您的观察者一起工作。在这种情况下,您需要在数据项和前端之间使用一个图层来检查确认。
var ViewModel = function() {
var self = this,
savedHS01 = ko.observable(true);
self.HS01 = ko.computed({
read: savedHS01,
write: function(newValue) {
if (confirm("Are you sure?")) {
savedHS01(newValue);
}
self.HS01.notifySubscribers();
}
});
self.HS02 = ko.observable();
};
ko.applyBindings(new ViewModel());
body {
font-family: arial;
font-size: 14px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div>
<input class="radio-inline" type="radio" data-bind="checked: HS01, checkedValue:true" />
<span class="form-control-inline">yes</span>
<input class="radio-inline" type="radio" data-bind="checked: HS01, checkedValue:false" />
<span class="form-control-inline">no</span>
<br/>Hs01:
<input data-bind="value: HS01" />
<br/>ShouldBe:
<input data-bind="value: HS02" />
</div>