EasyUI——DataGrid的onClickRow事件


在做高校雲平台系統的評教子系統時,學生端有點擊超鏈接實現跳轉並傳值到指定界面的功能。超鏈接實現起來並不復雜,但是考慮到學生操作起來的人性化設計,於是把超鏈接改為單機該行任意地方都可以達到單擊超鏈接的效果,也就是能跳轉到指定界面並傳值。

  通過查看幫助文檔,找到了onClickRow事件,在用戶點擊一行的時候觸發,參數包括:

  rowIndex:點擊的行的索引值,該索引值從0開始。

  rowData:對應於點擊行的記錄。

  我們可以通過rowData取到想要傳遞的值,然后將頁面跳轉到指定鏈接,js代碼如下:

  

[csharp] view plain copy print ? 在CODE上查看代碼片 派生到我的代碼片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">        <script type="text/javascript" >       
  2.             $("#dg").datagrid({    
  3.                 onClickRow: function (index, row) {  //easyui封裝好的時間(被單機行的索引,被單擊行的值)  
  4.   
  5.                     //需要傳遞的值  
  6.                     var CourseName = row["CourseName"];  
  7.                     var TeacherCourseID = row["TeacherCourseID"];  
  8.                     var AssessStatus = row["AssessStatus"];  
  9.                     if (AssessStatus=="尚未評估") //如果該項尚未評估,則支持跳轉到評估頁面  
  10.                     {  
  11.                         var url = "../EvaluationStudentAssess/StudentAssess?CourseName=" + CourseName + "&TeacherCourseID=" + TeacherCourseID  
  12.                     }  
  13.                     else {  //如果該項以經評估則不需要跳轉  
  14.                         var url = "../EvaluationStudentAssess/AssessStatus"  
  15.                     }  
  16.                      
  17.                     //通過Ajax傳值  
  18.                     $.ajax({  
  19.                         url: url,  
  20.                         type: 'POST',  
  21.                         timeout: 100,  
  22.   
  23.                         Error: function () {  
  24.                             alert(Error);  
  25.                         },  
  26.                         success: function () {  
  27.                             window.location.href = url  
  28.                         }  
  29.                     });      
  30.                 }  
  31.             });  
  32.         </script></span>  
<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>

  其實實現起來並不復雜,有很多時候我們多考錄一些,就可以給用戶帶來永久的簡單操作,全心全意為人民是每一個程序員都應秉行的宗旨。

  當然實現方法不止一種,以上是我個人想到的方法,有不足之處請大家批評指正,有其他方法歡迎隨時交流。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM