EasyUI Forum

function abcdetails(xyzId){
		  var globalid=xyzId;		
			dataTable1=$('#detailsTable');
			$('#detailsTable').datagrid({
				title:'Xyz Details',
				iconCls:'icon-edit',
				pagination:true,
			remoteFilter:true,
			pageSize:10,
			remoteSort:true,
				width:960,
				height:250,
				singleSelect:true,
				idField:'xyzDetailsId',
				url:"xyzDetailsList.htm?id="+xyzId,					
				type: 'post',
				onBeginEdit:function(rowIndex){
			        var editors = $('#detailsTable').datagrid('getEditors', rowIndex);
			        var abcReading = $(editors[0].target);
			        var liters = $(editors[1].target);
			        var gallons = $(editors[2].target);
			        abcReading.numberbox()
			        gallons.numberbox({
			        	precision:2,
			        	disabled: true
			        });
			        liters.numberbox({
			        	precision:2,
			            onChange:function(e){
			            	// 1 Liter = 0.264172052 Gallons
			            	// 1 Gallon = 3.78541 Liters
			            	var cost = parseFloat(liters.numberbox('getValue'))*parseFloat(0.264172052);
			            	gallons.numberbox('setValue',cost);
			            }
			        });
			    },
				onBeforeLoad: function(){
					dataTable1.datagrid('loadData',[]);
				},
				columns:[[
					 {field:'xyzDetailsId',title:'xyzDetailsId',width:180,
                       formatter:function(xyzDetailsId){                    	
							return xyzDetailsId;
						},
						editor:'hidden', hidden:'true'},
					 
	                    {field:'xyzId',title:'xyzId',width:180,editor:'hidden',hidden:'true'},
						{field:'abcStickReading',title:'abc Stick Reading',width:180,editor:{type:'validatebox',options:{required:true}}},
						{field:'volumeinLitres',title:'Volume(in Liters)',width:180,editor:{type:'validatebox',options:{required:true}}},
						{field:'volumeinGallons',title:'Volume(in Gallons)',width:180,editor:{type:'validatebox',options:{required:true}}},
					
					{field:'action',title:'Action',width:100,align:'center',
						formatter:function(value,row,index){
							if (row.editing){
								var s = '<a href="#"  onclick="saverow(this)">Save</a> ';
								var c = '<a href="#" onclick="cancelrow(this)">Cancel</a>';
								return s+c;
							} else {
								var e = '<a href="#" onclick="editrow(this)">Edit</a> ';
								var d = '<a href="#" onclick="deleterow(this)">Delete</a>';
								return e+d;
							}
						}
					}
				]],
				
				onBeforeEdit:function(index,row){					
					row.editing = true;
					updateActions(index);
				},
				onAfterEdit:function(index,row){					
					row.editing = false;					
					if(row.xyzDetailsId==undefined){
						//adding Xyz details
						$.ajax({
							url: 'editXyzDetails.htm',
							type: 'post',
						data: {
								'id' : "add",
							'xyzId' : globalid,
								'abcStickReading' : row.abcStickReading,
								'volumeinGallons' : row.volumeinGallons,
								'volumeinLitres' : row.volumeinLitres,						
							},
							success: function(response) {								
								main.showMsg('Xyz Details Management', "Record created/updated successfully");	
								$('##manageXyz').html(response);								
							}
						});
						
					} else{
						//updating Xyz details
					$.ajax({
						url: 'editXyzDetails.htm',
						type: 'post',
						data: {
						'id' : row.xyzDetailsId,
							'xyzId' : row.xyzId,
							'abcStickReading' : row.abcStickReading,
							'volumeinGallons' : row.volumeinGallons,
							'volumeinLitres' : row.volumeinLitres,						
						},
					success: function(response) {
							main.showMsg('Xyz Details Management', "Record created/updated successfully");	
							$('##manageXyz').html(response);
							
						}
					});
				}
					
					updateActions(index);					
					dataTable1.datagrid('loadData',[]);
						xyzManagement.getXyz(globalid);
					
				},
				onCancelEdit:function(index,row){
					row.editing = false;
					updateActions(index);
				}
			});
		};
		function updateActions(index){			
			$('#detailsTable').datagrid('updateRow',{
				index: index,
				row:{}
			
			});			
			
		}
		function getRowIndex(target){			
			var tr = $(target).closest('tr.datagrid-row');
			return parseInt(tr.attr('datagrid-row-index'));
		}
		function editrow(target){			
			$('#detailsTable').datagrid('beginEdit', getRowIndex(target));
		}
		function deleterow(target){
			$.messager.confirm('Confirm','Are you sure you want to delete?',function(r){
				if (r){
					
					var row = $('#detailsTable').datagrid('getSelected');
					
					$.ajax({
						url: 'delXyzDetails.htm',
						type: 'post',
						data: {
							'id' : row.xyzDetailsId
						},
						success: function(response) {
							main.showMsg('Xyz Details Management', "Record deleted successfully");	
							$('##manageXyz').html(response);
							
						}
					});
					
					$('#detailsTable').datagrid('deleteRow', getRowIndex(target));
				}
			});
			
		}
		function saverow(target){			
			$('#detailsTable').datagrid('endEdit', getRowIndex(target));				

		}
		function cancelrow(target){
			$.messager.confirm('Confirm','Are you sure you want to cancel?',function(r){
				if (r){
					var tr = $(target).closest('tr.datagrid-row');
					var index = parseInt(tr.attr('datagrid-row-index'));
					var dg = tr.closest('div.datagrid-view').children('table');
					var currRow = dg.datagrid('getRows')[index];
					
					console.log(currRow);
					if('undefined' === typeof(currRow.xyzDetailsId)){
						$('#detailsTable').datagrid('deleteRow', getRowIndex(target));
					} else {
						$('#detailsTable').datagrid('cancelEdit', getRowIndex(target));
					}
				}
			});
		}
		function insert(){			
			var row = $('#detailsTable').datagrid('getSelected');
			if (row){
				var index = $('#detailsTable').datagrid('getRowIndex', row);
			} else {
				index = 0;
			}			
			$('#detailsTable').datagrid('insertRow', {
				index: index,
				row:{}
			});			
			$('#detailsTable').datagrid('selectRow',index);
			$('#detailsTable').datagrid('beginEdit',index);			
		}