Change image with a form input binded to a grid

Suite and Optimus Suite 5
#1

I have a tab with a 2E layout. In my top part i have a grid that has an img collumn. In my second part of my layout i have a form that is binded to that grid, so at every row-click, row’s informations are loaded in my form so i can’t modify them. The tricky part for me is to find a way to modify my image? What would be your suggestion?
Here is the code to my grid:

var grdTopArt = tabArt.attachGrid();
	
    grdTopArt.setImagePath("codebase/imgs/");
	grdTopArt.setSkin("dhx_skyblue");
	grdTopArt.setHeader("artist,value,creationdate,artType,remarks,img");
	grdTopArt.setInitWidths("100,100,100,100,200,100");
	grdTopArt.setColumnIds("artist,value,creationdate,artType,remarks,img");
	grdTopArt.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#text_filter,#text_filter");
	grdTopArt.setColAlign("left,left,left,left,left,left");
	grdTopArt.setColTypes("ro,ro,dhxCalendar,ro,ro,img");
	grdTopArt.setColSorting("str,str,str,str,str,str");
	
	grdTopArt.setDateFormat("%Y-%m-%d %H:%i:%s");
	
	grdTopArt.init();
	grdTopArt.enableSmartRendering(true);

And to my form:

var frmArt_config = [
		{ type:"settings" , labelWidth:80, inputWidth:250, position:"absolute"  },
		{type:"button", name:"save", value:"Save", labelAlign:"center",position:"absolute", inputLeft:20, inputTop:5},
		{type:"button", name:"add", value:"Add", labelAlign:"center", position:"absolute", inputLeft:114, inputTop:5},
		{type:"button", name:"delete", value:"Delete", labelAlign:"center", position:"absolute", inputLeft:200, inputTop:5},
		//{ type:"template" , name:"img", label:" ", format: function(name, value){ return "<img src='img/"+value+"'>"}, labelWidth:250, inputHeight:120, labelLeft:0, labelTop:25, inputLeft:20, inputTop:45  },
		{ type:"label" , name:"form_label_1", label:"Artist Name:", width:100, labelWidth:100, labelAlign:"left", labelLeft:200, labelTop:45  },
		{ type:"input" , label:"", name:"artist", labelWidth:400, labelAlign:"left", inputWidth:300, labelLeft:400, labelTop:25, inputLeft:300, inputTop:47  },
		{ type:"label" , name:"form_label_2", label:"Art Type:", width:100, labelWidth:100, labelAlign:"left", labelLeft:200, labelTop:80  },
		{ type:"input" , name:"artType", label:" ", labelWidth:100, labelAlign:"left", inputWidth:120, labelLeft:450, labelTop:75, inputLeft:270, inputTop:82  },
		{ type:"label" , name:"form_label_3", label:"Value", width:50, labelWidth:50, labelAlign:"left", labelLeft:410, labelTop:80  },
		{ type:"input" , name:"value", label:"(in &euro;)", labelWidth:75, labelAlign:"left", inputWidth:105, labelLeft:448, labelTop:82, inputLeft:495, inputTop:82  },
		{ type:"label" , name:"form_label_4", label:"Creation Date:", width:100, labelWidth:100, labelAlign:"left", labelLeft:200, labelTop:113  },
		{ type: "calendar",  dateFormat: "", name:"creationdate", label:"", labelWidth:250, labelAlign:"left", readonly: false,
				enableTime: true, calendarPosition: "under", labelLeft:825, labelTop:75, inputWidth:297, inputLeft:303, inputTop:116  },
		{ type:"input" , name:"remarks", label:"", labelWidth:400, labelAlign:"left", inputWidth:334, labelLeft:450, labelTop:125, inputLeft:267, inputTop:147  },
		{ type:"label" , name:"artist2", label:"Remarks:", width:125, labelWidth:125, labelAlign:"left", labelLeft:200, labelTop:145  },
		
		{ type:"file" , name:"img", label:"", labelWidth:400, labelAlign:"left", inputWidth:334, labelLeft:450, labelTop:125, inputLeft:267, inputTop:177  },
		{ type:"label" , name:"picture", label:"Picture:", width:125, labelWidth:125, labelAlign:"left", labelLeft:200, labelTop:177  },
	];