Bootstrap行内编辑,这里下载了一个X-Editable的插件,在Nuget里面就可以搜到。

  引用的js和css大致如下:

        @*、Jquery组件引用*@

        <script src="~/Scripts/jquery-3.3.1.js"></script>

        @*、bootstrap组件引用*@

        <script src="~/Scripts/bootstrap.js"></script>

        <link href="~/Content/bootstrap.css" rel="stylesheet" />

        @*、bootstrap table组件以及中文包的引用*@
<script src="~/Scripts/bootstrap-table/bootstrap-table.js"></script>
<link href="~/Content/bootstrap-table.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="~/Scripts/bootstrap-table/extensions/editable/bootstrap-table-editable.min.js"></script> @*、 X-Editable组件引用*@
<link href="~/Content/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap3-editable/js/bootstrap-editable.js"></script>

  这里需要提醒的是,你这些引用一定要对,否则你实现不了也是正常的。

  代码:

    $('#table').bootstrapTable({
url: '/MyCourse/GetCourseTable', //请求后台的URL(*)
method: 'get', //请求方式(*) columns: [{
checkbox: true
},
{
field: 'ClassNumber',
title: '课程编号'
}, {
field: 'ClassName',
title: '课程名称',
editable: {
type: 'text',
title: '课程名称',
validate: function (v) {
if (!v) return '用户名不能为空'; }
}
}, {
field: 'TeacherName',
title: '授课老师',
editable: {
type: 'text',
title: '授课老师',
validate: function (v) {
if (!v) return '用户名不能为空'; }
}
}], onEditableSave: function (field, row, oldValue, $el) {
$.ajax({
type: "post",
url: "/MyCourse/UpdataCourse",
data: row,
dataType: 'JSON',
success: function (data, status) {
if (status == "success") {
alert('提交数据成功');
}
},
error: function () {
alert('编辑失败');
},
complete: function () { } });
}
})

照着抄就行了。

BootStrap行内编辑的更多相关文章

  1. bootstrap editable 行内编辑

    除了那些bootstrap/bootstrap table的js , css之外,要额外添加editable的文件: <link href="../assets/css/bootstr ...

  2. JS组件系列——BootstrapTable 行内编辑解决方案:x-editable

    前言:之前介绍bootstrapTable组件的时候有提到它的行内编辑功能,只不过为了展示功能,将此一笔带过了,罪过罪过!最近项目里面还是打算将行内编辑用起来,于是再次研究了下x-editable组件 ...

  3. datatables表格行内编辑的实现

    Datatables是一款jquery表格插件,它是一个高度灵活的工具,灵活就意味着很多功能需要自己去实现,比如说行内编辑功能. Datatables自己是没有行内编辑功能的,最简单的是通过modal ...

  4. [转]JS组件系列——BootstrapTable 行内编辑解决方案:x-editable

    本文转自:http://www.cnblogs.com/landeanfen/p/5821192.html 阅读目录 一.x-editable组件介绍 二.bootstrapTable行内编辑初始方案 ...

  5. js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable

    js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable 一.总结 一句话总结:bootstrap能够做为最火的框架,绝对不仅仅只有我看到的位置,它应该还有很多位置可 ...

  6. Django项目:CRM(客户关系管理系统)--69--59PerfectCRM实现king_admin行内编辑

    #base_admin.py # ————————24PerfectCRM实现King_admin自定义操作数据———————— from django.shortcuts import render ...

  7. ASP.NET Aries 入门开发教程6:列表数据表格的格式化处理及行内编辑

    前言: 为了赶进度,周末也写文了! 前几篇讲完查询框和工具栏,这节讲表格数据相关的操作. 先看一下列表: 接下来我们有很多事情可以做. 1:格式化 - 键值的翻译 对于“启用”列,已经配置了格式化 # ...

  8. jQuery EasyUI 数据网格 - 启用行内编辑(转自http://www.runoob.com/jeasyui/jeasyui-datagrid-datagrid12.html)

    可编辑的功能是最近添加到数据网格(datagrid)的.它可以使用户添加一个新行到数据网格(datagrid).用户也可以更新一个或多个行.本教程向您展示如何创建一个数据网格(datagrid)和内联 ...

  9. ASP.NET MVC5+EF6+EasyUI 后台管理系统(83)-Easyui Datagrid 行内编辑扩展

    这次我们要从复杂的交互入手来说明一些用法,这才能让系统做出更加复杂的业务,上一节讲述了Datagird的批量编辑和提交本节主要演示扩展Datagrid行内编辑的属性,下面来看一个例子,我开启编辑行的时 ...

随机推荐

  1. 量产救U盘

    同事U盘不能格式化,快速格式化失败,非快速格式化也失败.就问谁有360安全软件,试试能不能格式化. 我说我有火绒,但是不知道火绒并没有格式化U盘的功能(应该没有吧,反正我找了以后没找到) 那怎么办呢? ...

  2. [区块链]POW 与POS

    POW:全称Proof ofWork,工作证明. 这是什么意思呢?就是说,你能获得多少货币,取决于你挖矿贡献的有效工作,也就是说,你电脑性能越好,分给你的矿就会越多,这就是根据你的工作证明来执行货币的 ...

  3. [安全]appscan 使用代理抓取其他客户端的请求

    自己安全测试技能很低, 上级给的安全测试的任务给了自动化组的同事来做, 自己之前使用appscan的时候 只知道使用appscan的内置浏览器测试抓取请求 今天与自动化美女同事沟通发现有一个代理的功能 ...

  4. mangTomany 自关联之个人感悟

    介绍: 应用场景:评论表 manyTomany 原则上就是一个类 自己建立一个关系表 这个关系表的列 由自己定义 例如 图中 from_userinfo_id() 是人为规定的 男生列  to_use ...

  5. MT【35】用复数得到的两组恒等式

    特别的,当$r\rightarrow1^{-}$时有以下两个恒等式: 第二个恒等式有关的自主招生试题参考博文MT[31]傅里叶级数为背景的三角求和 评:利用两种展开形式得到一些恒等式是复数里经常出现的 ...

  6. nagios 配置 check_traffic 流量监控模块(Server 端)

    安装软件包yum -y install net-snmp*chkconfig nrpe onchkconfig snmpd onchkconfig nagios on 修改snmp参数,vi /etc ...

  7. 自学Linux Shell3.5-目录处理命令mkdir rmdir

    点击返回 自学Linux命令行与Shell脚本之路 3.5-目录处理命令mkdir rmdir 1. mkdir命令 创建一个或多个新的目录. mkdir 命令创建由 Directory 参数指定的一 ...

  8. [HNOI2010] 城市建设_动态最小生成树(Dynamic_MST)

    这个题...暴力单次修改\(O(n)\),爆炸... $ $ 不过好在可以离线做 如果可以在 分治询问 的时候把图缩小的话就可以做了 硬着头皮把这个骚东西看完了 $ $ 动态最小生成树 然后,就把它当 ...

  9. python常见面试题(三)

    问题1 到底什么是Python?你可以在回答中与其他技术进行对比(也鼓励这样做). 答案 下面是一些关键点: Python是一种解释型语言.这就是说,与C语言和C的衍生语言不同,Python代码在运行 ...

  10. bzoj4504 K个串 (优先队列+主席树)

    首先如果没有出现次数的限制的话,这题就是超级钢琴 但由于有了这个限制,不能简单地用前缀和 考虑顺着做的时候每个点的贡献,如果a[i]=x,x上次出现位置是lst[x](可以用一个map来记),那它会给 ...