找回密码
 立即注册

QQ登录

只需一步,快速开始

kkij

金牌服务用户

19

主题

72

帖子

211

积分

金牌服务用户

积分
211
kkij
金牌服务用户   /  发表于:2018-11-21 14:38  /   查看:4591  /  回复:9
期望的效果是checkbox放置在行号处,红圈地方显示也有个checkbox,点击可以实现是否全选。
捕获.PNG

9 个回复

倒序浏览
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2018-11-21 15:09:49
沙发
您好,行头和列头可以实现checkbox,表单左上角我这边需要调研一下。

我先把列头实现checkbox的Demo给您参考,左上角这边是否能实现,我这边稍后回复您。

ColumnHeaderCheckBox.html

5.11 KB, 下载次数: 139

回复 使用道具 举报
kkij
金牌服务用户   /  发表于:2018-11-22 11:28:17
板凳
KevinChen 发表于 2018-11-21 15:09
您好,行头和列头可以实现checkbox,表单左上角我这边需要调研一下。

我先把列头实现checkbox的Demo给您 ...

之前您提供的全选功能代码有点复杂,我没有看明白。请问我现在这种形式,想实现全选切换该怎么处理呢?因为在行号上加的checkbox没有名字,没有class,没法赋值
途中代码拷贝如下:
$(document).ready(function () {
    var spread = new GC.Spread.Sheets.Workbook($("#content").get(0), {
        sheetCount: 1
    });
    var sheet = spread.getActiveSheet();

    getdata(sheet);
    //设置第一列不可见
    sheet.setColumnVisible(0, false);
    spread.options.newTabVisible = false;
    var rowcount = sheet.getRowCount();
    var colcount = sheet.getColumnCount();
    for (var i = 0; i < rowcount; i++) {
        sheet.setCellType(i, 0, new GC.Spread.Sheets.CellTypes.CheckBox(), GC.Spread.Sheets.SheetArea.rowHeader);
    }
    for (var j = 0; j < colcount + 1; j++) {
        sheet.setColumnWidth(j, 98);
    }
    $('#all').click(function () {
        if ($(this).attr("checked") == "checked") {

            //实现全选切换

        }
    })
});

捕获.PNG
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2018-11-22 15:29:47
地板
您好,Spread JS 的内部是通过canvas渲染的,它的checkbox与传统页面上的checkbox不一样,

上个Demo实际上是重写了部分CheckBox单元格类型的方法,

我给您完善一下上一个Demo,实现行头部的checkbox,建议您结合API和学习指南来使用。

Demo我给您上传到附件了,相关API地址:

http://help.grapecity.com/spread ... eets.CellTypes.html

学习指南Demo地址:学习指南这个Demo您可以借鉴一下。

https://demo.grapecity.com.cn/Sp ... emos/customCellType

ColumnHeaderCheckBox.html

9.78 KB, 下载次数: 137

回复 使用道具 举报
kkij
金牌服务用户   /  发表于:2018-11-23 09:37:35
5#
本帖最后由 kkij 于 2018-11-23 09:58 编辑
KevinChen 发表于 2018-11-22 15:29
您好,Spread JS 的内部是通过canvas渲染的,它的checkbox与传统页面上的checkbox不一样,

上个Demo实际 ...

第一列是数据的id,隐藏不现实,第一列又存放了checkbox,getvalue时得到的是id值,如何获取checkbox是否被选中呢?
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2018-11-23 10:33:53
6#
您第一列设置的id可以不需要隐藏,可以通过checkbox的textTrue和textFalse来展示,getValue可以获取到true和false。

具体信息可以参考学习指南:

https://demo.grapecity.com.cn/Sp ... os/checkBoxCellType

以及API:

http://help.grapecity.com/spread ... Types.CheckBox.html
回复 使用道具 举报
kkij
金牌服务用户   /  发表于:2018-11-27 13:52:57
7#
KevinChen 发表于 2018-11-23 10:33
您第一列设置的id可以不需要隐藏,可以通过checkbox的textTrue和textFalse来展示,getValue可以获取到true ...

我第一列id不能在界面显示,是不是第一列放checkbox,从第二列开始存放数据,第二列对应的是id,设置id隐藏sheet.setColumnVisible(1, false)
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2018-11-27 14:35:36
8#
对,隐藏列的方法您的调用方式是正确的。

另外,您的id可以放在第一列或第二列,或任何一列,只要id列不设置checkbox,就不会改变值。
回复 使用道具 举报
kkij
金牌服务用户   /  发表于:2018-11-27 14:55:30
9#
本帖最后由 kkij 于 2018-11-27 14:57 编辑
KevinChen 发表于 2018-11-27 14:35
对,隐藏列的方法您的调用方式是正确的。

另外,您的id可以放在第一列或第二列,或任何一列,只要id列不 ...
恩,不管id放在哪一列,checkbox放在第一列是必须的
但是关联数据用setDataSource,默认就是从第一列开始的,怎么设置从第二列开始呢?
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2018-11-27 16:24:07
10#
哦哦,您可以在setDataSource之后再进行addColumns等操作,API如下:

http://help.grapecity.com/spread ... eet~addColumns.html
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部