EasyUI——DataGrid的onClickRow事件

迈不过友情╰ 2022-08-06 11:30 214阅读 0赞

在做高校云平台系统的评教子系统时，学生端有点击超链接实现跳转并传值到指定界面的功能。超链接实现起来并不复杂，但是考虑到学生操作起来的人性化设计，于是把超链接改为单机该行任意地方都可以达到单击超链接的效果，也就是能跳转到指定界面并传值。

通过查看帮助文档，找到了onClickRow事件，在用户点击一行的时候触发，参数包括：

rowIndex：点击的行的索引值，该索引值从0开始。

rowData：对应于点击行的记录。

我们可以通过rowData取到想要传递的值，然后将页面跳转到指定链接，js代码如下：

<span style="font-family:KaiTi_GB2312;font-size:18px;">        <script type="text/javascript" >     
                $("#dg").datagrid({  
                    onClickRow: function (index, row) {  //easyui封装好的时间（被单机行的索引，被单击行的值）
    
                        //需要传递的值
                        var CourseName = row["CourseName"];
                        var TeacherCourseID = row["TeacherCourseID"];
                        var AssessStatus = row["AssessStatus"];
                        if (AssessStatus=="尚未评估") //如果该项尚未评估，则支持跳转到评估页面
                        {
                            var url = "../EvaluationStudentAssess/StudentAssess?CourseName=" + CourseName + "&TeacherCourseID=" + TeacherCourseID
                        }
                        else {  //如果该项以经评估则不需要跳转
                            var url = "../EvaluationStudentAssess/AssessStatus"
                        }
                       
                        //通过Ajax传值
                        $.ajax({
                            url: url,
                            type: 'POST',
                            timeout: 100,
    
                            Error: function () {
                                alert(Error);
                            },
                            success: function () {
                                window.location.href = url
                            }
                        });    
                    }
                });
            </script></span>

其实实现起来并不复杂，有很多时候我们多考录一些，就可以给用户带来永久的简单操作，全心全意为人民是每一个程序员都应秉行的宗旨。

当然实现方法不止一种，以上是我个人想到的方法，有不足之处请大家批评指正，有其他方法欢迎随时交流。