DataTable Javascript Link not working on 2nd page
$(document).ready(function () {
var otable = $('#tbl-resources').dataTable(
{
bJQueryUI: false, bFilter: true, bPaginate: true, bSort: false, bInfo: true,
"oLanguage": { "sSearch": "Click on column to sort / Search all columns for:" }
, "sPaginationType": "simple_numbers", "bAutoWidth": false,
"sDom": '<"row view-filter" <"col-sm-6"<"#ddl-category">><"col-sm-6"<"pull-right"f>>>t<"row view-pager"<"col-sm-7"<"pull-left"l><"pull-right"i>><"col-sm-5"<"pull-right"p>>>',
"aoColumns": [
null,
null,
null,
{ "width": "40%" }
],
"buttons": [
{
extend: 'collection',
text: 'Select Resource Category',
"fnClick": function (nButton, oConfig, oFlash) {
alert('Mouse click');
} } ]
}); $label = $('<label/>').text('Resource Category:').appendTo('#ddl-category')
$label.append(" ");
//insert the select and some options
$select = $('<select/>', { 'class': 'form-control' }).appendTo('#ddl-category')
@foreach (var item in Model.ResourceCategories)
{
<Text> $('<option/>').val('@item.Value').text('@item.Text').appendTo($select); </Text> }
otable.$(".editResource").on('click', function () {
var category = $('#ddl-category :selected').val();
alert(category);
var overridden = $(this).data('overridden');
var resourceId = $(this).attr('data-resourceId');
$.ajax({
url: '@Url.Action("EditResource", "Correspondent")',
type: "POST",
data: { selectedId: resourceId, selectedCategory: category, IsOverriddenResource: overridden },
}).success(function (result) {
$('#div-edit-modal').html(result);
$('#edit-modal').modal('show');
});
}); });
My last column in Datatable is link, but only work on the first page, whenever I changed the page number or number shown on page the links were not working.
Solution: Delegated events have the advantage that they can process events from
descendant elements that are added to the document at a later time. By
picking an element that is guaranteed to be present at the time the
delegated event handler is attached, you can use delegated events to
avoid the need to frequently attach and remove event handlers.
So, instead of using
$(".editResource").click(function () {
need to use dataTables.$() which is
otable.$('.editResource').on('click', function () {
DataTable Javascript Link not working on 2nd page的更多相关文章
- SharePoint 2013 中使用 JavaScript Like 和Unlike list item/page/document
SharePoint 2013中新增了很多社交功能,比如用户可以like/unlike 任何一个 list item/page/document,这是一个非常不错的功能. 但有时觉得like/unli ...
- [Javascript] Link to Other Objects through the JavaScript Prototype Chain
Objects have the ability to use data and methods that other objects contain, as long as it lives on ...
- Print a PeopleSoft Page with JavaScript
1. You will need a Long character field to hold the HTML string. You can use the delivered field HT ...
- 自己动手用Javascript写一个无刷新分页控件
.NET技术交流群:337901356 ,欢迎您的加入! 对 于一个用户体验好的网站来说,无刷新技术是很重要的,无刷新,顾名思义,就是局部刷新数据,有用过Asp.net Web Form技术开发网页的 ...
- javascript,HTML,PHP,ASP做301跳转代码 SEO优化设置
URL HTTP Redirection URL http redirection is an automatic URL change operation from one URL to anoth ...
- Fancytree Javascript Tree TreeTable 树介绍和使用
Fancytree是一个非常棒的Javascript控件,功能强大,文档健全.在做Javascript Tree控件选型时,主要基于以下几点选择了Fancytree 在Javascript Tree控 ...
- javascript项目实战---ajax实现无刷新分页
分页: limit 偏移量,长度; limit 0,7; 第一页 limit 7,7; 第二页 limit 14,7; 第三页 每页信息条数:7 信息总条数:select count(*) from ...
- Javascript Madness: Mouse Events
http://unixpapa.com/js/mouse.html Javascript Madness: Mouse Events Jan WolterAug 12, 2011 Note: I ha ...
- 【网页开发学习】Coursera课程《面向 Web 开发者的 HTML、CSS 与 Javascript》Week1课堂笔记
Coursera课程<面向 Web 开发者的 HTML.CSS 与 Javascript> Johns Hopkins University Yaakov Chaikin Week1 In ...
随机推荐
- LoadRunner错误处理函数
节选自<LoadRunner虚拟用户开发指南> 在脚本的Run-time Settings中,可以设置在脚本运行过程中发生错误的处理方式.进入到Run-time Settings中,切换到 ...
- Linux Curl常用命令使用【转】
Curl是Linux下一个很强大的http命令行工具,其功能十分强大. 1)读取网页 $ curl linuxidc.com">http://www.linuxidc.com 2)保存 ...
- nodejs 包引用的终极结论
通常我们用exports 或module.exports 来导出一个文件中的接口和字段,用require来引用导出的对象.那么这个exports 和 module.exports到底有啥关联呢? 1. ...
- 【转载】__name__ == "__main__": 你认识我么?
<笨方法学Python>的习题50中,脚本ex50.py最后一行代码就是 if __name__ == "__main__": 那么,这句代码到底有什么用呢? 莫急莫急 ...
- url地址数据转换成json数据格式
var urlToJson = function(){ var ret = {}; window.location.search.substr(1).replace(/(\w+)=(\w+)/ig, ...
- Masonry的一些等间距布局
控件之间的间距相等,但是控件的宽度是不定的. 下列的代码:定义间距为10,yellowview的宽度是由redView的宽度计算出来的. UIView *redView = [[UIView allo ...
- pychon - selenium2Libray源码简介
I. Introduction Selenium2Library是robot framework中主流的测试网页功能的库, 它的本质是对webdriver的二次封装, 以适应robot框架. 百度上一 ...
- 关于java web开发需要哪些技术要求(简单的web界面管理系统)
目前, 国内外信息化建设已经进入基于Web应用为核心的阶段, Java作为应用于网络的最好语言,前景无限看好.然而,就算用Java建造一个不是很烦琐的web应用,也不是件轻松的事情.概括一下,实施Ja ...
- java回调机制(写的很好)
本文出自xiaanming的博客(http://blog.csdn.net/xiaanming/article/details/17483273) 以前不理解什么叫回调,天天听人家说加一个回调方法啥的 ...
- webStorm(一)
1.打开webStorm选择activation code输入注册码 43B4A73YYJ-eyJsaWNlbnNlSWQiOiI0M0I0QTczWVlKIiwibGljZW5zZWVOYW1lIj ...