Inizializzazione dell' oggetto Grid


Quando si dichiara un oggetto Grid, il componente principale di ErgoDataGrid, vengono passati nella procedura di inizializzazione tutti i parametri non in sola lettura elencati nella pagina di riferimento che determinano l' aspetto, il comportamento e l' interfaccia con i dati di ErgoDataGrid.

L' esempio seguente riporta la procedura di inizializzazione dell' oggetto Cars:

- i file utilizzati sono due:

il primo è il file Javascript chiamato "Cars.js" che contiene la funzione Cars_init(), all' interno della quale deve essere dichiararata un' istanza di ErgoDataGrid;

il secondo file è "demo.htm", in cui sono riportati attraverso tags <SCRIPT> e <LINK> i file necessari a far comparire all' utente finale la griglia; bisogna prestare attenzione a dove viene dichiarato il tag <SCRIPT> con src uguale a "Cars.js": ErgoDataGrid compare proprio in corrispondenza di questo tag.


file Cars.js
var itArrayGridCars=[["Foto","img_url","IL","100px","#FF6600","White",null,"CENTER",null,null,null,null,null,"100","75"],
					   ["ID","id","N","30px","#FF6600","White","Ordina per l\\\' ID","RIGHT"],
		    		   ["Modello","description","S","180px","#FF6600","White","Ordina per il modello"],
					   ["Cilindrata cc","displacement","S","70px","#FF6600","White","Ordina per la cilindrata","CENTER"],
					   ["Immatricolazione","registration_string","S","140px","#FF6600","White","Ordina per la data di immatricolazione","RIGHT"],
					   ["Km","km_string","S","90px","#FF6600","White","Ordina per i km percorsi","CENTER"],
					   ["Potenza KW","power","N","80px","#FF6600","White","Ordina per la potenza in cavalli","CENTER"],
					   ["Alimentazione","fuel","S","120px","#FF6600","White",null,"CENTER"],
					   ["Prezzo","price_string","S","70px","#FF6600","White","Ordina per il prezzo","RIGHT"]];
var enArrayGridCars=CopyArray(itArrayGridCars);
enArrayGridCars[0][0]="Photo";
enArrayGridCars[1][6]="Order by ID";
enArrayGridCars[2][0]="Model";
enArrayGridCars[2][6]="Order by model";
enArrayGridCars[3][0]="Displacement cc";
enArrayGridCars[3][6]="Order by displacement";
enArrayGridCars[4][0]="Registration";
enArrayGridCars[4][6]="Order by registration date";
enArrayGridCars[5][0]="Miles";
enArrayGridCars[5][6]="Order by covered km";
enArrayGridCars[6][0]="Power KW";
enArrayGridCars[6][6]="Order by cc. power";
enArrayGridCars[7][0]="Fuel";
enArrayGridCars[8][0]="Price";
enArrayGridCars[8][6]="Order by price";

function Cars_init() {
	params=new Object();
	params.name="Cars";
	params.width="980px";
	params.ArrayGrid=eval(GetLang("Cars")+"ArrayGridCars");
	params.ArrayFilter=[null,["id","N",1],["description","S",2],["displacement","N",3],["registration","D",5],
						["km","N",7],["power","N",8],null,["price","N",11]];
	params.ArraySort=[null,["id","id"],["description","description"],["displacement","displacement"],
					  ["registration","registration"],["km","km"],["power","power"],null,["price","price"]];
	params.ArrayVisualizationData=[0,1,2,3,4,6,8,9,10];
	params.ArrayRawData=[0,1,2,3,5,7,8,9,11];
	params.recPageSize=5;
	params.OnClickSpan=OnClickSpan;
	params.OnMouseOverSpan=OnMouseOverSpan;
	params.canHelp=true;
	params.canChangeRecPageSize=true;
	params.canChangeLanguage=true;
	params.OnHelp=OnHelp;
	params.firstSort="A1";
	params.charInclusive="_";
	Cars=new Grid(params);
}

var win;
var conversion_value=1.26;

function OnClickSpan(ele,dataField,value,rowIndex,colIndex) {
	if (dataField=="img_url" && !Cars.filterVisible) {
		var h=400;
		var w=700;
		win=window.open("large/"+value,null,"width="+w+", height="+h+", copyhistory=no, toolbar=no, location=no, menubar=no, status=no, scrollbars=no, resizable=no, top="+(screen.height-h)/2+", left="+(screen.width-w)/2);
		win.focus();
	}
}

function OnMouseOverSpan(ele,dataField,value,rowIndex,colIndex) {
	if (dataField=="img_url") 
		ele.title=value;
	else if (dataField=="km_string")
		if (this.language=="it")
			ele.title=Group(Math.round(value/1.609))+" miles";
		else
			ele.title=Group(Math.round(value*1.609))+" km";
	else if (dataField=="price_string")
		if (this.language=="it")
			ele.title=Group(Math.round(value*conversion_value))+" $";
		else
			ele.title=Group(Math.round(value/conversion_value))+" €";

}

function OnHelp() {
	var height=300;
	var width=400;
	var language;
	if (this.language=="it") 
		language="Italiano";
	else
		language="English";
	window.open('','',"height="+height+",width="+width+
		",top="+(screen.height-height)/2+",left="+(screen.width-width)/2+
		",toolbar=no,directories=no,status=no,location=no,menubar=no,resizable=no,scrollbars=no").location.href="helpCars"+language+".htm";
}

Cars_init();


demo.htm file
<HTML>
<HEAD>
<TITLE>ErgoDataGrid basic - demo</TITLE>
<!-- this script and the "<LINK REL=...>" tag have to be included with grid.js to make it work-->
<SCRIPT LANGUAGE=Javascript SRC=grid/lang.js></SCRIPT>
<LINK REL=stylesheet TYPE="text/css" HREF=grid/grid.css>
<SCRIPT LANGUAGE=Javascript SRC=grid/grid.js></SCRIPT>
</HEAD>
<BODY TOPMARGIN=5>
<SCRIPT LANGUAGE=Javascript SRC=cars.js></SCRIPT>
</BODY>
</HTML>