在用datagrid的时候我们可能要用到点击表头来触发一个function,这里有个简单的例子。

首先你得有个能用的datagrid。

<div>
    <table id="toolbar"></table>
</div>

然后是js里的东西。

function toolbar(){
    alert("dd");
    $("#toolbar").datagrid({
        striped: true,
        url:"toolbar",
        columns:[[
           {field:"name",title:click()},
           {field:"sex", title:"性别"},
           {field:"age", title:"年龄"},
           ]],
           toolbar:[{  
           text:'增加',iconCls:'icon-add',handler:function(){  
           alert(document.getElementById("text").value);}  
           },  
           {text:'导入',iconCls:'icon-add',handler:function(){  
               window.location.href='StuImport.aspx';  
               }  
           },  
           {text:'<input id=\"text\" type=\"text\">',handler:function(){
               return "<input type=\"text\">";
           }}  
           ],
            });
}

function click(){
    alert("name");
    return "<p id='na' onclick='naclick("+1+")'>name</p>";
}

这里利用的是datagrid的title可以用一个function生成。

我们可以自由 的在返回值里定义我们想要的东西,用起来相当方便。

如果不想用函数生成的话直接在column里写<p id='na' onclick='naclick()'>name</p>也一样可以生成.这个可能是easyui吧传过去的值先进性了处理之后又显示出来的

所以我们看到的不是整个的字符串,而是经过html处理过的东西。

easyui datagrid 点击表头的事件的更多相关文章

  1. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

  2. easyui 中datagrid 点击行的事件

    $('#datagrid 的ID').datagrid({                onClickRow:function(index,data)                {        ...

  3. easyui datagrid 点击列表头排序出现错乱的原因

    之前我的导师,也就是带我的同事,使用datagrid,发现点击列表头排序出现乱序,按理说只有顺序和逆序两种排序结果.因为他比较忙,当时没解决,把排序禁掉了,后来又要求一定要排序,所以他交给我. 一开始 ...

  4. easyui datagrid 单元格 编辑时 事件 修改另一单元格

    //datagrid 列数据 $('#acc').datagrid({ columns : [ [ { field : 'fee_lend', title : '收费A', width : 100, ...

  5. easyui datagrid 去除单击行选中事件

    转:http://www.xue163.com/588880/39049/390490560.html 解决方案: onClickRow: function (rowIndex, rowData) { ...

  6. easyui datagrid实现拖动表头

    $.extend($.fn.datagrid.methods, { columnMoving: function (jq) { return jq.each(function () { var tar ...

  7. EasyUi datagrid 单选框选中事件

    Easyui datagrid中的单选框默认是这样定义的 columns: [[ { field: 'CK', title: '', checkbox: true, width: 30 }]]. 平常 ...

  8. easyui datagrid 表头固定(垂直滚动条)、列固定(水平滚动条)

    easyui datagrid 表头固定(垂直滚动条).列固定(水平滚动条),每页显示1000行 最近用多了easyui 之后还是觉得它的功能还是很强大的.它原有的功能就已经能够满足90%以上的界面需 ...

  9. EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他

    原创 : EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他 转载,请注明出处哦!谢谢! 原创 : EasyUI datagrid 明细表格中编辑框 事件绑 ...

随机推荐

  1. mysql创建数据库指定编码uft8

    mysql创建数据库指定编码uft8 CREATE DATABASE IF NOT EXISTS my_db default character set utf8 COLLATE utf8_gener ...

  2. SQL优化快速入门

    最近遇到一个专门进行SQL技术优化的项目,对很多既有的老存储过程进行调优(现在已经不再新增任何存储过程),因此系统的对SQL语句编写进行一次科学的学习变得很有必要.这儿将基于黄德承大神的Oracle ...

  3. CSS全屏布局的5种方式

    × 目录 [1]float [2]inline-block [3]table[4]absolute[5]flex[6]总结 前面的话 全屏布局在实际工作中是很常用的,比如管理系统.监控平台等.本文将介 ...

  4. 实现CSS等分布局的4种方式

    × 目录 [1]float [2]inline-block [3]table[4]flex 前面的话 等分布局是指子元素平均分配父元素宽度的布局方式,本文将介绍实现等分布局的4种方式 思路一: flo ...

  5. Android属性动画之第一重修炼总结

    经过这两天对ObjectAnimator属性动画的学习,基本对Android提供的属性动画有了一定的认识,现在就为大家以一个类似扇形打开的效果做总结. 效果图: 下面就让我们用刚刚学到的属性动画效果, ...

  6. MYSQL线程池总结(一)

    线程池是Mysql5.6的一个核心功能,对于服务器应用而言,无论是web应用服务还是DB服务,高并发请求始终是一个绕不开的话题.当有大量请求并发访问时,一定伴随着资源的不断创建和释放,导致资源利用率低 ...

  7. Example of ApplicationContextAware in Spring--转

    原文地址:http://www.concretepage.com/spring/example_applicationcontextaware_spring In spring we can get ...

  8. Android基于mAppWidget实现手绘地图(十四)–在一个应用中使用多个地图

    使用切图工具创建不同名称的地图资源.然后将这些资源放置到assert文件夹内. 像下面这样: 在代码中,根据不同的地图名称,查找地图. map = new MapWidget(this, " ...

  9. DRA(Data Recovery Advisor)的使用

    关于DRA的官方描述: The simplest way to diagnose and repair database problems is to use the Data Recovery Ad ...

  10. nodejs 回调地狱解决 promise async

    nodejs毁掉地狱是一直被人诟病的,以下总结一下解决毁掉地狱的一些方法.(暂时研究的比较浅) 1.promise promise模式在任何时刻都处于以下三种状态之一:未完成(unfulfilled) ...