Knockout 重新绑定注意要点
function ReImport(id) { //点击按钮时调用函数名称,
var node = document.getElementById('bindingNode'); //bindingNode 为内部绑定订单子项的div或是table id,每次html(data)后会重新建立
if (node) {
$(node).unbind();
$(node).find("*").each(function () {
$(this).unbind();
});
ko.removeNode(node);//解绑
}
//http://localhost:7486/Order/EditByIndex?id=61521
$("#orderdetalis").html('');
$.get('@Url.Action("EditByIndex")', { id: id, r: Math.random() }, function (data) { //此处action中包含了<div id="bindingNode">
$("#orderdetalis").html(data); //此处orderdetails为本页面的一个div id 注意,如有错误 jquery html()方法不执行
$("#myModal").modal();
var node_new = document.getElementById('bindingNode'); //此处bindingNode因为被remove掉,必须再次查找后 绑定到对像
ko.applyBindings(obj1, node_new);
})
}
function AppViewModel() {
var self = this;
self.OrderItems = ko.observableArray([]);
self.removeOrderItem = function () {
if (confirm('确认删除吗?')) {
self.OrderItems.remove(this);
}
}
self.addOrderItem = function () {
push({ 'ProductName': '', 'ProductCode': '', 'Price': 0, 'Quality': 1 });
}
self.TotalAmount = ko.computed(function () {
var amount = 0;
var array = self.OrderItems();
for (var i = 0 ; i < array.length; i++) {
var price = getFloat(array[i].Price());
var quality = getFloat(array[i].Quality());
amount += Math.formatFloat(quality * price, 2);
}
return "总金额:" + Math.formatFloat(amount, 2).toString();
}, this);
}
var obj1 = new AppViewModel();
function push(obj) {
var itemModel = function (item) {
var self = this;
self.ProductName = ko.observable(item.ProductName);
self.ProductCode = ko.observable(item.ProductCode);
self.ImportStore = ko.observable(item.ImportStore);
self.Price = ko.observable(item.Price);
self.Quality = ko.observable(item.Quality);
};
obj1.OrderItems.push(new itemModel(obj));
}
function buildArray(array) {
obj1.OrderItems([]);
for (var i = 0 ; i < array.length ; i++) {
push(array[i]);
}
}
Knockout 重新绑定注意要点的更多相关文章
- Knockout双向绑定
knockout双工绑定基于 observe 模式,性能高.核心就是observable对象的定义.这个函数最后返回了一个也叫做 observable 的函数,也就是用户定义值的读写器(accesso ...
- knockout同时绑定多个实体demo
1.我们会遇到一种情景:一个页面实现复杂的功能时,我们往往会使用部分页(.netmvc中的@renderaction,java中ajax请求jsp页面). 如果子页面也使用knockout绑定数据会不 ...
- knockout为绑定元素生成id
knockout 提供生成了uniqueName的方法,但没有提供生成Id的方法. 感谢stackoverflow提供的思路与方法. 下面是uniqueName的实现方法. ko.bindingHan ...
- knockout更新列表中的某条数据,knockout.js绑定数组时更新其中一条数据
knockout是一款前端实现MVVM的JS框架,仅knockout.js一个47kb的文件,相当实用,做前端无刷新页面,快速实现JS与HTML数据交互. knockout目前最新版:knockout ...
- Knockout 双向绑定的理解
今天做了个需求就是上传图片,然后在代码中通过jQuery给一个标签赋值,经过前台的debug,发现这个值赋值成功了,但是提交到后台的请求里就没了,然后经历了一顿度娘,结果中发现了问题. 既然knock ...
- knockout事件绑定
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- Knockout js 绑定 radio 时,当绑定整形的时候,绑定不生效
解决方案: 使用checkedValue和checked 组合,如下代码. <div><input type="radio" name="flavorG ...
- Knockout自定义绑定my97datepicker
/* my97datepicker 时间格式'yyyy-MM-dd HH-mm-ss' */ ko.bindingHandlers.datetimes = { init: function (elem ...
- knockout.js绑定(enable,disable,visable)
<input type="text" data-bind="disable:IsNew" /> enable :是否可用,为true时,可编辑 di ...
随机推荐
- softwares我的软件列表(转载)
[TOC] 个人在archlinux下的日常使用经验列出,故而在archlinux及其衍生发行版中,以下所列软件几乎可以从archlinux官方源或者aur中搜索下载安装,所列出名字一般即是其包名,使 ...
- javascript--记忆函数
function memory(val) { if(!memory.cached) {//判断是否创建了缓存 memory.cached = {}; } if(memory.cached[val] ! ...
- 高并发MYSQL如何优化处理?
1)代码中sql语句优化 2)数据库字段优化,索引优化 3)加缓存,redis/memcache等 4)主从,读写分离 5)分区表 6)垂直拆分,解耦模块 7)水平切分
- 洛谷2474 [SCOI2008] 天平 差分约束->枚举
题目描述 你有n个砝码,均为1克,2克或者3克.你并不清楚每个砝码的重量,但你知道其中一些砝码重量的大小关系.你把其中两个砝码A 和B 放在天平的左边,需要另外选出两个砝码放在天平的右边.问:有多少种 ...
- caioj 1078 动态规划入门(非常规DP2:不重叠线段)(状态定义问题)
我一开始想的是前i个区间的最大值 显然对于当前的区间,有不选和选两种情况 如果不选的话,就继承f[i-1] 如果选的话,找离当前区间最近的区间取最优 f[i] = max(f[i-1, f[j] + ...
- java回调方法、钩子方法以及模板方法模式
在面向对象的语言中,回调则是通过接口或抽象类来实现的,我们把实现这种接口的类称为回调类,回调类的对象称为回调对象,其处理事件的方法叫做回调方法.(摘自百度百科) 那么通过上面那句话将百度百科中的&qu ...
- 仿分词统计的MapReduce 程序。
HDFS 数据格式 : 举例单条数据:02-26 08:01:56 [qtp512249001-42] INFO async-statistics - class com.spring.aop.S ...
- 使用commons-email发邮件
这里我用到了两个包: commons-email-1.3.2.jar mail-1.4.1.jar 如果不加mail.jar,就可能会抛出NoClassDefFoundError异常 之后代码引用ht ...
- Spring可扩展Schema标签
基于Spring可扩展Schema提供自己定义配置支持 http://blog.csdn.net/cutesource/article/details/5864562 WARN : org.sprin ...
- EBS TimeZone问题
记录问题 : http://blog.csdn.net/cymm_liu/article/details/29234919 -- Oracle 数据库中的 时间 时区 http:// ...