jquery easyui如何实现格式化列

 更新时间:2017年07月30日 09:01:49   作者:huiy_小溪  
本篇文章主要介绍了jquery easyui如何实现格式化列 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

本文主要介绍了jquery easyui如何实现格式化列 ,正好最近需要用到,分享给大家,也给自己留个笔记

主框架页面: 在主界面区会加载西区菜单点击的URL内容.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8"/>
  <title>主界面</title>
  <div th:include="/public/util::public"/>
  <div th:include="/public/util::jquery-easyui"/>
  <script type="text/javascript" th:src="(${@configApp.getStaticWeb()})+'/cms/script/main/index.js'"></script>
  <script type="text/javascript" th:src="(${@configApp.getStaticWeb()})+'/cms/script/site/site-index.js'"></script>  
</head>
<body class="easyui-layout">
  <div data-options="region:'north',title:''" style="height:80px;" id="north"></div>
  <div data-options="region:'west',title:'系统功能区',split:true" style="width:200px;">
    <ul class="easyui-tree" id="menu"></ul>
  </div>
  <div data-options="region:'center',title:'主界面区'" style="padding:5px;" id="center"></div>
</body>
</html>

此时在主页面已经加载了easy-ui的脚本和CSS ,在各区页面就不必加载了,即使加载了也会被去掉.

我一开始在datagrid页面添加格式化函数,但是没有效果,始终报找不到formatIsvalid这个函数.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8"/>
  <title>站点列表页面</title>
  <script type="text/javascript">
  function formatIsvalid(val,row){
    return val=='1'?'是':'否';
  }
  </script>
</head>
<body>
  <table id="site" title="站点列表" class="easyui-datagrid" th:url="@{/site/list}"
      toolbar="#siteToolbar" rownumbers="true" fitColumns="true" singleSelect="true">
    <thead>
      <tr>
        <th field="siteid" width="50">ID</th>
        <th field="sitename" width="50">名称</th>
        <th field="siteurl" width="50">网址</th>
        <th field="isvalid" width="50" formatter="formatIsvalid">是否有效</th>
        <th field="isdelete" width="50">是否可以删除</th>
        <th field="remark" width="50">备注</th>
        <th field="createtime" width="50">创建时间</th>
      </tr>
    </thead>
  </table>
  <div id="siteToolbar">
    <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newSite()">新增</a>
    <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editSite()">编辑</a>
    <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="removeSite()">删除</a>
  </div>
</body>
</html>

解决办法:把这个格式化函数放到主页面中就没有问题了.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • jquery实现ajax提交表单信息的简单方法(推荐)

    jquery实现ajax提交表单信息的简单方法(推荐)

    下面小编就为大家带来一篇jquery实现ajax提交表单信息的简单方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • jQuery异步验证用户名是否存在示例代码

    jQuery异步验证用户名是否存在示例代码

    有个需求就是异步验证用户名是否存在。用的技术是jQuery异步验证和struts2,大家可以参考下
    2014-05-05
  • Jquery写一个鼠标拖动效果实现原理与代码

    Jquery写一个鼠标拖动效果实现原理与代码

    近日项目中要做一个鼠标拖拽层的效果,于是手动使用Jquery做了一个,发出来跟大伙儿分享一下,并希望能得到高手的指点,如何有高手改进的话,在下不胜感激
    2012-12-12
  • jQuery中ready事件用法实例

    jQuery中ready事件用法实例

    这篇文章主要介绍了jQuery中ready事件用法,实例分析了ready事件的功能、定义及文档加载就绪以后触发的具体使用技巧,需要的朋友可以参考下
    2015-01-01
  • jquery分析文本里url或邮件地址为真实链接的方法

    jquery分析文本里url或邮件地址为真实链接的方法

    这篇文章主要介绍了jquery分析文本里url或邮件地址为真实链接的方法,涉及jQuery正则匹配与替换的相关技巧,需要的朋友可以参考下
    2015-06-06
  • jQuery实现影院选座订座效果

    jQuery实现影院选座订座效果

    这篇文章主要为大家详细介绍了jQuery实现影院选座订座效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04
  • 20款非常优秀的 jQuery 工具提示插件 推荐

    20款非常优秀的 jQuery 工具提示插件 推荐

    工具提示(Tooltip)在网站中的一个小功能,但却有很重要的作用,常用于显示一些温馨的提示信息。如果网站中的工具提示功能做得非常有创意的话能够加深用户对网站印象
    2012-07-07
  • jQuery实现tab栏切换效果

    jQuery实现tab栏切换效果

    这篇文章主要为大家详细介绍了jQuery实现tab栏切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • 使用jquery实现放大镜效果

    使用jquery实现放大镜效果

    相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果。那么接下来,我们将向大家介绍通过jQuery实现放大镜效果。
    2014-09-09
  • jQuery Chosen通用初始化

    jQuery Chosen通用初始化

    这篇文章主要介绍了jQuery Chosen通用初始化,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-03-03

最新评论