代码篇——EasyUI中DataGrid选中多行提交和删除

     基础代码进行整理，让我们的效率更快的提高。

需求：

     俩个表格，第一个表格为班级，里面有具体的一班二班，另一个表是该班级的学生。实现的功能是：选中第一个表的班级，从数据库中查询该班级的学生，显示在另外的一个表格中。点击移除，就可以将选中学生从考生信息列表中移除。也就是多行数据在俩个datagrid中进行传递。

     对一个表格进行单行选中的代码：

<span style="font-family:FangSong_GB2312;font-size:18px;"><span style="font-size:18px;"><span style="font-size:24px;">var rowInfo = $("#id").datagrid('getSelected');
if(rowInfo){
alert("已经选中的行");
}</span></span></span>

    对一个表格进行多行选中的代码：

<span style="font-family:FangSong_GB2312;font-size:18px;"><span style="font-size:18px;"><span style="font-size:24px;">var ids = [];
var rows = $('#tt').datagrid('getSelections');
for(var i=0; i<rows.length; i++){
ids.push(rows[i].itemid);
}
alert(ids.join('
'));</span></span></span>

 遇到问题：

     看着这些代码，是不是觉得很简单啊，但是在具体的多行传值得过程中，出现了仅仅可以传一行的值得现象，我们的表格在没有用分页的情况下，可以实现多行选中并把值弹出来，但是在分页的情况下，仅仅可以显示一行的值。为什么？

     以下的代码是我考试班绑定的表格代码:

<span style="font-family:FangSong_GB2312;font-size:18px;"><span style="font-size:18px;">   <table id="Chapter1" title="考试班" class="easyui-datagrid" style="width: 600px; height: 300px;" idfield="itemid" pagination="true" data-options="iconCls:'icon-save',rownumbers:true,url:'/AddStudent/QueryClassByCourseID',pageSize:5, pageList:[10,20,30,40],method:'get',toolbar:'#tb',striped:true" fitcolumns="true">

<thead>
<tr>
<th data-options="field:'ck',checkbox:true"></th>
<th data-options="field:'StudentNo',width:80">班号</th>
<th data-options="field:'StudentName',width:100">班级名称</th>
</tr>
</thead>
</table></span></span>

    其中有一个idfield="itemid",这句话是什么意思呢？

    这句话就标示了主键，也就是相当于标示了一个ID值（唯一的），所以在后面的传值过程中仅仅传一行的值。

代码：

   多行选中传值，定义一个数组，让该数组进行传值，然后在后台的时候对该数组进行分割，实现该功能的JS代码：

function AddExamInformation() {

var ids = [];
var rows = $('#ExamClass').datagrid('getSelections');

var strStudentNos = "";
for (var i = 0; i < rows.length; i++) {
if (strStudentNos == '') {
strStudentNos = rows[i].StudentNo;
} else {
strStudentNos += ',' + rows[i].StudentNo;
}
}

$('#StudentInfo').datagrid({

url: '/AddStudent/QueryStudentInfoByClassNo?strStudentNos=' + strStudentNos,
//success: function (data) {
columns: [[
{ field: 'ck', checkbox: true },
{ field: 'StudentNo', title: '学生ID', align: 'center', width: 100 },
{ field: 'StudentName', title: '学生姓名', align: 'center', width: 100 }
]]

});
}

   
 control中的代码：

       用Regex.Split来分割字符串，实现循环。

public ActionResult QueryStudentInfoByClassNo()
{

int pageSize = Request["rows"] == null ? 10 : int.Parse(Request["rows"]);
int pageIndex = Request["page"] == null ? 1 : int.Parse(Request["page"]);
int total = 0;

string[] ArrayStudentNo = Regex.Split(Request["strStudentNos"].ToString(), ",", RegexOptions.IgnoreCase);
List<StudentViewModel> StudentViewModel = new List<StudentViewModel>();
List<StudentViewModel> listStudent = new List<StudentViewModel>();
List<StudentViewModel> student = new List<StudentViewModel>();
foreach (string studentNo in ArrayStudentNo)
{

student = basicQueryStudentInfo.QueryStudentInfoByClassNo(studentNo, pageSize, pageIndex, out total);
if (student.Count == 0)
{
return null;
}
else
{
listStudent.Add(student[0]);
}

}
return Json(listStudent, JsonRequestBehavior.AllowGet);

}

   多行代码进行移除的JS

function ClearExamInformation() {
var rows = $('#StudentInfo').datagrid("getSelections"); //获取你选择的所有行 //循环所选的行
for (var i = 0; i < rows.length; i++) {
var index = $('#StudentInfo').datagrid('getRowIndex', rows[i]);//获取某行的行号
$('#StudentInfo').datagrid('deleteRow', index);

}
}

    基础性的代码，需要的是多多积累。