easyui datagrid数据网格 单选 点击行和取消勾选问题

这是easyui的datagrid数据网格(单选)

微信截图_20200422190437.png

点击一行后,实现前面的单选框被选中。(如果直接点击单选框的话,会被选中,这没问题,也不能让用户总去点单选框呀)

然后还有一个最恶心的问题,“单选框选中后怎么取消勾选?

上代码:

$('#user-id').datagrid({
           data: [{'userName': 'name1','userCode': '1233','userId':'001'},{'userName': 'name2','userCode': '2412','userId': '002'}],
            idField: 'userId', // 唯一标识
            fitColumns: true,
            singleSelect: true,
            columns:[[
                { field:"user",
                    formatter: function (value, row, index) {
                        if (!_this.Main.config.multi) {
                            var s = '<input name="user" type="radio" checked="checked"/> ';
                        }
                        else {
                            var s = '<input name="user" type="radio" value="'+ index +'" /> ';
                        }
                        return s;
                    }
                },
                { title: "用户名称",field: "userName",align:'center'},
                { title: "员工编码",field: "userCode",align:'center'}
            ]],
            pagination: true,
            onClickRow: function(index,data){
                debugger;
                var row = $('#user-id').datagrid('getSelected');
                if (index == selectIndex) {
                    //第一次单击选中,第二次单击取消选中
                    // $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio']:eq(" + index + ") ").attr("checked", false);
                    $('#pd-selectOrg-user-list').datagrid('clearSelections');
                }

                var isCheck = $('#pd-selectOrg-user-list').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio']:eq(" + index + ") ").attr("checked");

                if (isCheck) {
                    //将所有checkbox修改为未选中
                    // $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio'] ").attr("checked", false);
                    //将这次的checkbox标记为选中
                    $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio']:eq(" + index + ") ").attr("checked", true);
                }else {
                    if (index == selectIndex) {
                        // $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio']:eq(" + index + ") ").attr("checked", false);
                    }else {
                        //将所有checkbox修改为未选中
                        // $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio'] ").attr("checked", false);
                        //将这次的checkbox标记为选中
                        $('#user-id').datagrid("getPanel").find(".datagrid-view2 .datagrid-body table input[type='radio']:eq(" + index + ") ").attr("checked", 'true');
                    }
                }
                selectIndex = index;
            }
        })

求大神指导

阅读 2.7k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题