easyui扩展数据表格点击加号拓展

$(function(){
           $("#RepaymentInfoTab").datagrid({
                view: detailview,
             detailFormatter:function(index,row){
                     return ‘<div style="padding:2px"><table id="ddv-‘ + index + ‘"></table></div>‘;
                 },
            onExpandRow:function(index,row){
                var repaymentNum = row.repaymentNum;
                $(‘#ddv-‘+index).datagrid({
                    url:‘getSaleInfoData?repaymentNum=‘ + repaymentNum,
                    fitColumns:true,
                    singleSelect:true,
                    height:‘auto‘,
                    columns:[[ 

                        {field:‘salesNum1‘,title:‘计划消费流水‘,width:20},
                        {field:‘salesMoney1‘,title:‘计划消费金额‘,width:20},
                        {field:‘difference1‘,title:‘差额(消费-还款)‘,width:20},
                        {field:‘status1‘,title:‘计划消费状态‘,width:20,formatter:function(value){
                            if (value == 1) {return ‘<span style=\"color:red\">初始化</span>‘; }
                            if (value == 2) {return ‘<span style=\"color:blue\">消费完成</span>‘; }
                            if (value == 3) {return ‘<span style=\"color:blue\">遗弃</span>‘; }
                        }},
                        {field:‘transNo1‘,title:‘交易流水号‘,width:20},
                        {field:‘sendDate1‘,title:‘交易时间‘,width:20},
                        {field:‘creaetetime1‘,title:‘添加时间‘,width:20},
                    ]],
                    onResize:function(){
                        $(‘#RepaymentInfoTab‘).datagrid(‘fixDetailRowHeight‘,index);
                    },
                    onLoadSuccess:function(){
                        setTimeout(function(){
                            $(‘#RepaymentInfoTab‘).datagrid(‘fixDetailRowHeight‘,index);
                        },0);
                    }
                });
                $(‘#RepaymentInfoTab‘).datagrid(‘fixDetailRowHeight‘,index);
            }
           })
     })

原文地址:https://www.cnblogs.com/bchange/p/9494857.html

时间: 2024-10-13 21:05:37

easyui扩展数据表格点击加号拓展的相关文章

jQuery Easyui datagrid 数据表格的使用

jQuery Easyui datagrid 数据表格的使用1. 在页面显示表格的位置 提供<table>标签,指定 id 元素2. 在 JS 代码 $("#grid").datagrid({-}); 完成对表格设置表格列定义远程数据加载分页 顶部工具栏 代码效果 原文地址:https://blog.51cto.com/13587708/2420696

JQuery EasyUI 学习——Struts2与EasyUI DataGrid数据表格结合使用显示数据库数据

因为EasyUI DataGrid只要取出后台传过来的一定格式的JSON数据,就可以在前台页面数据表格中,以一定形式显示数据库中的数据.此处,我们使用Struts2框架整合DataGrid,实现数据的显示. 一.页面内容 为了在页面中显示数据库中字段内容,需要定义一个table,通过EasyUI内部设计,自动显示数据,如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF

[转载]EasyUI中数据表格DataGrid添加排序功能

我们这里演示的是EasyUI数据表格DataGrid从服务器端排序功能,因为觉的本地数据排序没有多大的作用,一般我们DataGrid不会读取全部数据,只会读取当前页的数据,所以本地数据排序也只是对当前页的数据进行排序,不是我们想要用效果. 下面开始演示从服务器端排序功能. 第一步,启用EasyUI DataGrid的排序功能: 具体就是为列设置sortable属性,如下: { field: "SOID", title: "订单单号", width: "80

[转] easyui 获取数据表格中选中行的数据 Get selected row data from...

原文地址:http://my.oschina.net/meSpace/blog/41463 http://www.easyui.net/2010/06/easyui-tutorial-get-selected-row-data-from-datagrid/ http://easyui.btboys.com/api/      easyui api http://www.iteye.com/problems/47234 jquery easyUI datagrid 的宽度能不能设置成百分比. 数据

jquery easyui DataGrid 数据表格 属性

中文帮助请点这里:中文属性详解 以下为未完结版 <!DOCTYPE html> <!-- To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. --> <html> <head>

easyui 删除数据表格

1 最直接的方法: 返回的数据格式 Object rows:Array[3] 0:Object 1:Object 2:Object length:3 __proto__:Array[0] total:3 return {total:0,rows:[]}; 2 第二种方法:需要注意的,删除时从下面往上面删除,删除了一条数据后,index是会发生改变的! var rows = $('#hos_main_table').datagrid('getRows'),len=rows.length; for(

EasyUI 34-ComboGrid(数据表格下拉框)组件

jQuery EasyUI - 数据表格(DataGrid)

由于工作需要,项目使用前端 jQuery EasyUI - DataGrid 来控制数据表格. 1.加载相关js和css,因为easyui依赖jquery,所有加载easyui前要先加载jquery,否则为提示找不到datagrid <!-- 加载jquery --> <script type="text/javascript" src="plugins/jquery/jquery-1.4.2.min.js"></script>

easyui框架--基础篇(一)--&gt;数据表格datagrid(php与mysql交互)

  前  言  php  easyui框架--本篇学习主要是 easyui中的datagrid(数据表格)框架. 本篇学习主要通过讲解一段代码加GIF图片学习datagrid(数据表格)中的一些常用属性,还有与之相关的dialog(对话窗)和texbobox(文本框)的一些常用属性,希望对读者有帮助. 本篇主要分为两个部分讲解: ① 前端PHP代码编写--框架搭建与数据调用 ② 数据库的数据内容与后台数据连接,后台数据传输到前台 以下所有代码HBuider中建立PHP文件实施.(前提php文件可