EasyUI——DataGrid的onClickRow事件

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

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

  通过查看帮助文档,找到了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>
  其实实现起来并不复杂,有很多时候我们多考录一些,就可以给用户带来永久的简单操作,全心全意为人民是每一个程序员都应秉行的宗旨。

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

目录
相关文章
|
2月前
EasyUI datagrid 从左至右递归合并表格
EasyUI datagrid 从左至右递归合并表格
15 2
|
2月前
EasyUI DataGrid 假分页
EasyUI DataGrid 假分页
15 0
|
11天前
|
JavaScript 前端开发
EasyUi js 加载数据表格DataGrid
EasyUi js 加载数据表格DataGrid
|
2月前
|
前端开发
easyui datagrid 的 tip实现
easyui datagrid 的 tip实现
|
2月前
|
JSON 监控 数据格式
Easy UI datagrid的学习
Easy UI datagrid的学习
|
5月前
Easyui datagrid 编辑结束时combobox显示value而不显示text
Easyui datagrid 编辑结束时combobox显示value而不显示text
|
5月前
EasyUI中datagrid的行编辑模式中,找到特定的Editor,并为其添加事件
EasyUI中datagrid的行编辑模式中,找到特定的Editor,并为其添加事件
|
5月前
EasyUI DataGrid 可编辑列级联操作
EasyUI DataGrid 可编辑列级联操作
|
5月前
easyui datagrid reload后自动全选解决
easyui datagrid reload后自动全选解决
|
5月前
EasyUI Datagrid 分页事件
EasyUI Datagrid 分页事件