最近EasyUIを勉強していますが、今日は公式のチュートリアルに従ってeditable datagridの例を作りました.公式のチュートリアルはここです.http://www.jeasyui.com/tutorial/app/crud2.php.私のフロントコードは基本的に公式チュートリアルと同じですが、私が使っているThinkphpでバックグラウンド操作のデータプロセスを書きます.
フロントコード:

    
    
    
    
    
 
    
    
    
    
	    $(function(){
	    	$('#dg').edatagrid({
				url: '/Test/Admin/Easyui/getAll',		//       ，    Thinkphp         

				/*A URL to save data to server and !return the added row.!*/
			    saveUrl: '/Test/Admin/Easyui/insertFromEG',
			    updateUrl: '/Test/Admin/Easyui/updateFromEG',

			    /*   json    !echo json_encode(array('success'=>true));*/
			    destroyUrl: '/Test/Admin/Easyui/deleteFromEG',	//     Thinkphp     
			    destroyMsg:{
					norecord:{	// when no record is selected
						title:'Warning',
						msg:'No record is selected.'
					},
					confirm:{	// when select a row
						title:'Confirm',
						msg:'Are you sure you want to delete?'
					}
				},
			});
	    });
    


	
Test EasyUI，      DataGrid
	

	    


	        

 
First Name
            
Last Name
            
Phone
            
Email
	        
	    
	
	

    New
    Destroy
    Save
    Cancel

	

大体のインタフェースはこうです.

追加と修正機能は正常に使用できますが、jを削除すると、フロントがバックグラウンドから戻ってきたjsonを取得するとjsがエラーを報告します.

明らかに公式サイトとそっくりなコードですが、削除できません・・・後でjqueryを見てみました.edatagrid.jsのソースコード、削除の機能は具体的にdestroyRowという関数によって実行され、関数のソースコードが見つかり、私のエラーがフロントでjsonがデータを返すのを処理する時に現れたので、ajax処理のコードがあるかどうかを直接探して、このような関数があることを発見しました:

function _del(row){
					var index = dg.datagrid('getRowIndex', row);
					if (index == -1){return}
					if (row.isNewRecord){
						dg.datagrid('cancelEdit', index);
					} else {
						if (opts.destroyUrl){
							var idValue = row[opts.idField||'id'];
							$.post(opts.destroyUrl, {id:idValue}, function(data){
								var index = dg.datagrid('getRowIndex', index);
							//	alert(index+"  "+idValue);
								if (data.isError){
									dg.datagrid('selectRow', index);
									opts.onError.call(dg[0], index, data);
									return;
								}
								if (opts.tree){
									dg.datagrid('reload');
									var t = $(opts.tree);
									var node = t.tree('find', idValue);
									if (node){
										t.tree('remove', node.target);
									}
								} else {
									dg.datagrid('cancelEdit', index);
									dg.datagrid('deleteRow', index);
								}
								opts.onDestroy.call(dg[0], index, row);
								var pager = dg.datagrid('getPager');
								if (pager.length && !dg.datagrid('getRows').length){
									dg.datagrid('options').pageNumber = pager.pagination('options').pageNumber;
									dg.datagrid('reload');
								}
							}, 'json');
						} else {
							dg.datagrid('cancelEdit', index);
							dg.datagrid('deleteRow', index);
							opts.onDestroy.call(dg[0], index, row);
						}
					}
				}

中間postがajaxをコミットする部分に重点を置いて、postがajaxをコミットする次の行のコードに問題があることを長い間デバッグしました.

var index = dg.datagrid('getRowIndex', idValue);

この関数の役割は,ユーザが選択した行のデータのプライマリコード(idValueという値)から,インタフェースに表示されるデータテーブルの行番号に変換することである.例えば、私の例では、ユーザーはkevinという行のデータを削除することを選択し、kevinという行のデータは私のデータベースのプライマリコードidが33であり、最初の行に表示されるので、この関数は33を0(データテーブルの行番号が0から始まる)に変換し、戻り値0をindexに割り当て、indexに対して具体的な削除プロセスを実行します.出力をデバッグしてみると、私の例で出力されたindexはいつも-1で、getRowIndexという関数が問題になっているようです.公式チュートリアルによると、この関数には2つのパラメータ形式があります.

ソースコードに使われているのがidの形式なので、idValueパラメータをrow(このパラメータはユーザーが選択した行のオブジェクト)に変えてみましたが、成功しました!jsエラーは発生せず、正常に削除できます.具体的に何が原因なのかはまだ分かりませんが、もし名手が原因を知っているか、あるいは私のどこの操作ミスを指摘してほしいです.