[webgrid] – header - (How to Add custom html to Header in WebGrid)
How to Add custom html to Header in WebGrid
Posted on March 30, 2013by mtryambake
How to make a MVC 3 Webgrid with checkbox column?
This article will show you a How to Add custom html to Header in WebGrid e.g. add a check box in webgrid header.
Some time you come across a situation where you have to add html element (checkbox) in webgrid header, consider a column with checkbox and you want to add checkbox in the header of same column.
Approach: In document.ready event find out webgrid header and replace it with html string.
$(document).ready(function () {
$('#gridContent table th').each(function () {
if (this.innerHTML == "") {
this.innerHTML = "<input type='checkbox' id='chkHeader' />";
}
});
});
Application: If you have a checkbox column in webgrid and on clicking of header checkbox all checkbox in column will be checked.
<script type="text/javascript">
$(document).ready(function () {
$('#gridContent table th').each(function () {
if (this.innerHTML == "") {
this.innerHTML = "<input type='checkbox' id='chkHeader' />";
}
});
$('#gridContent table th input:checkbox').click(function (e) {
var table = $(e.target).closest('table');
$('td input:checkbox', table).attr('checked', e.target.checked);
});
}); </script>
========================================================================================================
for reference
========================================================================================================
$(function () {
$('.gridTable thead tr th:first').html(
$('<input/>', {
type: 'checkbox',
click: function () {
var checkboxes = $(this).closest('table').find('tbody tr td input[type="checkbox"]');
checkboxes.prop('checked', $(this).is(':checked'));
}
})
);
});
[webgrid] – header - (How to Add custom html to Header in WebGrid)的更多相关文章
- Add custom and listview web part to a page in wiki page using powershell
As we know, Adding list view web part is different from custom web part using powershell, what's mor ...
- How To Add Custom Build Steps and Commands To setup.py
转自:https://jichu4n.com/posts/how-to-add-custom-build-steps-and-commands-to-setuppy/ A setup.py scrip ...
- Add custom daemon on Linux System
Ubuntu add custom service(daemon) Task 需要在系统启动的时候自动启动一个服务(后台程序),在系统关闭的时候关闭服务. 比如在部署某个应用之前,需要将某个任务设置成 ...
- RestTemplate发送请求并携带header信息 RestTemplate post json格式带header信息
原文地址: http://www.cnblogs.com/hujunzheng/p/6018505.html RestTemplate发送请求并携带header信息 v1.使用restTempl ...
- Add custom field in Material Master
1.Add fields in the Append Structure of table MARA. 2.Configure SPRO IMG -> Logistics General -&g ...
- grafana add custom dashboard
grafana-dashboard-json prometheus-operator helm 中的grafana dashboard 扩展的时候,需要转换下载(https://grafana.com ...
- [webgrid] – selecterow - (Get Selected Row from ASP.NET MVC 3 WebGrid)
Get Selected Row from ASP.NET MVC 3 WebGrid Abstract: The following article demonstrates how to get ...
- Umbrella Header for Module Bolts does not include header 'XXXXXX.h'?
在我们引入第三方Framwork时.有时会出现如标题的警告提示? 怎样解决? Framework 将在下面文件夹下创建一个Module/,并创建一个module.modulemap文件 waterma ...
- 开发Angular库的简单指导(译)
1. 最近工作上用到Angular,需要查阅一些英文资料,虽然英文非常烂,但是种种原因又不得不硬着头皮上,只是每次看英文都很费力,因此决定将一些比较重要的特别是需要反复阅读的资料翻译一下,以节约再次阅 ...
随机推荐
- jsoup-提示java.net.SocketTimeoutException:Read timed out
使用Jsoup.connect(url).get()连接某网站时偶尔会出现 java.net.SocketTimeoutException:Read timed out异常. 原因是默认的Socket ...
- 理解 Java 的三大特性之多态
面向对象编程有三大特性:封装.继承.多态. 封装隐藏了类的内部实现机制,可以在不影响使用的情况下改变类的内部结构,同时也保护了数据.对外界而已它的内部细节是隐藏的,暴露给外界的只是它的访问方法. 继承 ...
- struts2 action 页面跳转
struts2 action 页面跳转 标签: actionstruts2redirect 2013-11-06 16:22 20148人阅读 评论(0) 收藏 举报 (1)type="di ...
- Python 从零学起(纯基础) 笔记(一)
作者身份:初学Python,菜鸟 ================================================= 1. 主提示符和次提示符 >>> 主提示符 ...
- pycharm使用错误排查
1.pip安装扩展包报错 creating build/temp.linux-x86_64-3.4 x86_64-linux-gnu- -Wformat -Werror=format-security ...
- 关于当一个C#工程移植到另一台机子上(win7)上时,程序报错。dll没有被指定在Windows上运行,或者它包含错误。请尝试使用原始安装媒体重新安装程序。。。。。。
, 解决方法:通过从网上重新下载dll文件 拷贝到报错的目录下,替换掉原有的dll,可以正确运行.
- linux安装Mac的默认Monaco字体
Monaco字体是我最喜欢的编程字体,如果你想在linux上面安装,只需要在terminal中执行: curl -kL https://raw.github.com/cstrap/monaco-fon ...
- 同样有缓冲区,为什么bufferedReader输入流不需要清空缓冲区?而bufferedWriter需要清空缓冲区呢?
当BufferedReader在读取文本文件时,会先尽量从文件中读入字符数据并置入缓冲区,而之后若使用read()方法,会先从缓冲区中进行读取, 如果缓冲区数据不足,才会再从文件中读取.清不清空Buf ...
- 第三次作业——个人作业,k米案例分析
第一部分 调研,评测 评测 1.下载并使用 第一次打开,没什么很深的印象,看见"扫一扫",随手就点了,然后就出现了严重的卡顿,大概是刚启动并且第一次启动的原因,后面就还好了.而且第 ...
- Python基本数据类型之int
一.int的范围 2.7: 32位:-2^31~2^31-1 64位:-2^63~2^63-1 3.5: 在3.5中init长度理论上是无限的 二.python内存机制 在一般情况下当变量被赋值后,内 ...