KnocKout 绑定数据
Controller 里面的方法：
public ActionResult Index()
{ return View();
}
[HttpPost]
public JsonResult Reader()
{
var list = from a in db.employee
select new
{
Id=a.e_id,
No=a.e_no,
Name=a.e_name,
Dname=a.department.d_name,
Desc=a.e_desc,
Question=a.e_question,
Anawser=a.e_answer,
Qx=a.e_qx,
Up=a.e_up };
return Json(list, JsonRequestBehavior.AllowGet);
} //删除
[HttpPost]
public JsonResult Del(int id)
{
var emp= db.employee.ToList().Find(a => a.e_id == id);
db.employee.Remove(emp);
db.SaveChanges();
return Json(new {type = "success"});
}
html页面：
@using Knockout.Models
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/knockout-2.2.0.debug.js"></script>
<title>Index</title>
<script type="text/javascript">
var data;
$(function() {
$.ajax({
url: "/Kn/Reader",
type: "post",
async: false,
success: function (msg) {
$.each(msg, function(x, y) {
if (y.Qx == 3) {
y.Qx = "最高权限";
}else if (y.Qx == 1) {
y.Qx = "一般权限";
} else {
y.Qx = "没有权限";
}
if (y.Up == 1) {
y.Up = "已修改";
} else {
y.Up = "未修改";
}
});
data = msg;
}
});
}); function ViewModel() {
var self = this;
self.employees = ko.observableArray(data);
//删除
self.remove= function(emp) {
$.ajax({
url: "/Kn/Del/" + emp.Id,
type: "post",
dataType: "json",
success:function(json) {
self.employees.remove(emp);
}
});
}
//编辑
self.edit = function (emp) {
window.location.href = '/Kn/edit/' + emp.Id;
};
} $(function () { var vm = new ViewModel();
ko.applyBindings(vm);
$("a:contains('删除')").click(function() {
if (confirm("是否确定要删除？")) {
return true;
} else {
return false;
}
});
}); </script>
</head>
<body>
<table width="760px" border="1px" cellpadding="0" cellspacing="0">
<tr>
<th>编号</th>
<th>姓名</th>
<th>部门名称</th>
<th>职称</th>
<th>问题</th>
<th>答案</th>
<th>权限</th>
<th>是否修改过密码</th>
<th>操作</th>
</tr>
<tbody data-bind="foreach: employees">
<tr>
<td data-bind="text:No"></td>
<td data-bind="text:Name"></td>
<td data-bind="text:Dname"></td>
<td data-bind="text:Desc"></td>
<td data-bind="text:Question"></td>
<td data-bind="text:Anawser"></td>
<td data-bind="text:Qx"></td>
<td data-bind="text:Up"></td>
<td><a href="javascript:" data-bind="click:$root.remove">删除</a>
<a href="javascript:" data-bind="click:$root.edit">修改</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
KnocKout 绑定数据的更多相关文章
- knockoutjs中使用mapping插件绑定数据列表
使用KO绑定数据列表示例: 1.先申请V,T,T2三个辅助方法,方便调试.声明viewModel和加载数据时的映射条件mapping 2.先使用ko.mapping.fromJS()将原来的 ...
- Knockout.js 数据验证之插件版和无插件版
本文我们将介绍使用 Knockout.js 实现一些基本的数据验证.就如我们在标题里提到的,我们会使用两种方法来创建数据验证方法. 使用自定义方法,不需要任何插件 最简单的方法是使用已有的插件 如果你 ...
- Android之ListView性能优化——一行代码绑定数据——万能适配器
如下图,加入现在有一个这样的需求图,你会怎么做?作为一个初学者,之前我都是直接用SimpleAdapter结合一个Item的布局来实现的,感觉这样实现起来很方便(基本上一行代码就可以实现),而且也没有 ...
- angularJS绑定数据时自动转义html标签
angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签中的注入攻击,但有些时候还是需要的,特别是从数据库读取 ...
- 【WPF】绑定数据
WPF绑定数据 模型类(继承 INotifyPropertyChanged,实现属性的变更通知)
- 关于angularJS绑定数据时自动转义html标签
关于angularJS绑定数据时自动转义html标签 angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签 ...
- csharp: 用Enterprise Library对象实体绑定数据
Enterprise Library: https://msdn.microsoft.com/en-us/library/ff648951.aspx /// <summary> /// 是 ...
- D3.js 选择元素和绑定数据/使用数据
选择元素和绑定数据是 D3 最基础的内容,本文将对其进行一个简单的介绍. 一.如何选择元素 在 D3 中,用于选择元素的函数有两个: d3.select():是选择所有指定元素的第一个 d3.sele ...
- WebDataTree 使用XML做数据源绑定数据
英文版原文链接:http://www.infragistics.com/help/topic/e5f07b51-ee2d-4a33-aaac-2f43cffff327 所使用的控件版本为:Infrag ...
随机推荐
- md5 (c语言)
/** * \file md5.h * * \brief MD5 message digest algorithm (hash function) * * Copyright (C) 2006-201 ...
- ASP.NET MVC 插件化机制
概述 nopCommerce的插件机制的核心是使用BuildManager.AddReferencedAssembly将使用Assembly.Load加载的插件程序集添加到应用程序域的引用中.具 体实 ...
- python学习笔记(2)
1.for循环 用户按照顺序循环可迭代对象中的内容. li = [11,22,33,44] for i in li: print i for循环的else 此功能目前只有for循环里面有发现. 具体条 ...
- 【Java EE 学习 17 上】【dbutils和回调函数】
一.dbutils的核心就是回调函数,可以说如果没有回调函数的思想,dbutils是不可能被开发出来的. 对于dbutils中的QuryRunner类,向该类的query方法提供不同的参数,可以得到不 ...
- PIL中分离通道发生“AttributeError: 'NoneType' object has no attribute 'bands'”
解决方法: 这个貌似是属于一个bug 把Image.py中的1500行左右的split函数改成如下即可: def split(self): "Split image into bands&q ...
- 第二十六篇：两个SOUI新控件 ---- SListView和SComboView（借用Andorid的设计）
SOUI原来实现的SListBoxEx的效率一直是我对SOUI不太满意的地方.包括后来网友实现的SListCtrlEx. 这类控件为每一个列表项创建一个SWindow来容纳数据,当数据量比较大(100 ...
- 关于APP接口设计（转）
最近一段时间一直在做APP接口,总结一下APP接口开发过程中的注意事项: 1.效率:接口访问速度 APP有别于WEB服务,对服务器端要求是比较严格的,在移动端有限的带宽条件下,要求接口响应速度要快,所 ...
- java中的final的使用
1.final类不能被继承,因此final类的成员方法没有机会被覆盖,默认都是final的.在设计类时候,如果这个类不需要有子类,类的实现细节不允许改变,并且确信这个类不会再被扩展,那么就设计为fin ...
- MyBabis 用法详解
MyBatis 一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架(消除了几乎所以得JDBC代码和参数的手工设置及结果集的检索) MyBatis可以使用简单的XML或注解用于配置和原始映射,将 ...
- 修改nignx报错Nginx [emerg]: bind() to 0.0.0.0:80 failed (98: Address already in use)
Nginx [emerg]: bind() to 0.0.0.0:80 failed (98: Address already in use) 这个错误是修改了nginx的配置时出现,表名80端口被程 ...