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 ...
随机推荐
- 利用Photos 框架搭建美图秀秀相册选择器
简介:Photos框架是iOS8.0后推出的一个新的用于对系统相册进行相关操作的,在iOS8.0之前,开发中只能使用AssetsLibrary框架来访问移动设备的图片库.本文中不再对AssetsLib ...
- java中集合的使用
集合使用: 先说数组:array :用来存同一种数组类型的容器 eg:现在想把班上所有人的信息存起来 1.每一个人的信息可以用一个对象存起来 2.可以用一个数组来接受(现在数组中要接受的是对象) ob ...
- ios build时，Undefined symbols for architecture xxx问题的总结
简单来说,Undefined symbols基本上等于JAVA的ClassNotFoundException,最常见的原因有这几种: build的时候没有加framework 比如说,有一段代码我用了 ...
- Oracle行转列、列转行的Sql语句总结(转)
多行转字符串 这个比较简单,用||或concat函数可以实现 select concat(id,username) str from app_userselect id||username str f ...
- 没有为扩展名“.html”注册的生成提供程序
asp.net提示“ 没有为扩展名“.html”注册的生成提供程序... ” 解决办法,修改web.config文件: <compilation debug="true"&g ...
- Angular2表格/可排序/table
Angular2表格 1. 官网下载Angular2开发环境,以及给出的quickstart代码示例demo(地址如下),具体步骤不在详述. https://github.com/angular/qu ...
- Python学习笔记（五）——list和tuple
一.list 1.定义: list是一种有序的集合,可以随时添加和删除其中的元素 2.声明方法: subjects=['Math','English', 'Chinese'] 3.一些api (1)获 ...
- 【Junit 报错】No appenders could be found for logger (org.springframework.core.env.StandardEnvironment).
Junit报错 log4j:WARN No appenders could be found for logger (org.springframework.core.env.StandardEnvi ...
- Unity4.0的使用
最近公司用到了Unity,自己就研究了一下. 新建一个ASP.NET MVC基本项目,在NuGet上引入Unity4.0.1最新版. 因为我使用的项目为ASP.NET MVC,所以又添加一个Unity ...
- jquery ui dialog autofocus 去掉默认第一个元素获取焦点
经常在dialog窗口中第一个元素为日期控件时,打开窗口则会自动显示日期下拉框. 解决办法:在dialog的open事件中,设置父对象获得焦点. p1_dialog_seniorSearch.dial ...