datagrid直接编辑保存的“设计缺陷”之二

datagrid直接编辑保存的“设计缺陷”只是解决了如何让后台能接收到前台的数据

但是，如何处理前台数据短暂的保存，对我来说还是有点疑惑~

所以本篇文章是接上篇文章的后续处理~重点并不是在讨论“设计缺陷”了~

因为貌&＃20284;js中没有集合类型，所以这里用js中的array来保存数据。

那么这里有几个问题：

1、每次编辑完成（endEdit）的时候将编辑行保存，这里完成编辑包括三种情况（保存、新增和点击另一行）

&＃20540;得注意的是，这里点击datagrid之外的input或者其他元素不会使datagrid正在编辑的行失去焦点~

2、删除的时候要能够对应删除array中的元素（用什么来关联？）

最初的想法是：若本来就存在的记录有主键id来标识，这样删除行的时候就可以关联删除array中的数据了，但是若是新建的呢？还未被分配id该怎么办呢？

遂否定了这个想法。

第二个想法：在页面上人为给它们分配唯一的标识符，这个想法应该是可行的，但是略显麻烦

有没有更简单的方法呢？忽然想到列表中的数据和array中的数据其实是一一对应的！

列表中的数据完全就是array中数据结构的可视化展示嘛！其顺序也是完全一致的，那么其实用下标就可以将两者关联起来了！

根据官网上的demo，提供了endEdit这个方法，用于完成编辑时调用，并且在其中做了校验，下面这个是我的改写

其中，翻译并未用官网的做法，而是用了velocity的Directive来实现的：这样实现的好处是：

不仅可以翻译，且将翻译用的json缓存在页面上，这样都是local数据，combobox可以直接使用这个json，无需remote

    // 1、验证行校验是否通过，若通过则停止编辑并将editIndex置为undefined
    function endEditing(){
        if (editIndex == undefined){return true}
        if ($(&＃39;#dispatches_details&＃39;).datagrid(&＃39;validateRow&＃39;, editIndex)){	// 验证通过
        	// 如下的方法是官网上用来实现翻译的，算是一个小trick吧  
            // var ed = $(&＃39;#dispatches_details&＃39;).datagrid(&＃39;getEditor&＃39;, {index:editIndex,field:&＃39;reason&＃39;});
            // var reason = $(ed.target).combobox(&＃39;getText&＃39;);
            // $(&＃39;#dispatches_details&＃39;).datagrid(&＃39;getRows&＃39;)[editIndex][&＃39;reasonDes&＃39;] = reason;
            
            // endEdit的解释如下：finishing editing but before destroying editors
            // 也就是说完成编辑，但是还并未释放编辑器，也就是说rows里如combobox之类的值还是value，而不是text
            $(&＃39;#dispatches_details&＃39;).datagrid(&＃39;endEdit&＃39;, editIndex);
            // 每次endEditing都需要保存
	        var row = $(&＃39;#dispatches_details&＃39;).datagrid(&＃39;getRows&＃39;)[editIndex];
	        if(row){	// 防止不编辑，直接accept()，可能为null
				// 直接把json传到后台，发个毛form
        		jsonArr.splice(editIndex, 1, $.toStr(row));
	        }
        	
            editIndex = undefined;
            return true;
        } else {
            return false;
        }
    }

这里用到了js中操作array的一个方法——splice，下面是从w3school引用的方法说明，注意，这个方法会改变原始数组，不同于slice

语法

arrayObject.splice(index,howmany,item1,.....,itemX)

参数	描述
index	必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。
howmany	必需。要删除的项目数量。如果设置为 0，则不会删除项目。
item1, ..., itemX	可选。向数组添加的新项目。

返回&＃20540;

类型	描述
Array	包含被删除项目的新数组，如果有的话。

jsonArr.splice(editIndex, 1, $.toStr(row)); 这样一句话也就实现了替换array元素的功能！