Filtro e ordinamento automatici


Per far eseguire queste due operazioni a ErgoDataGrid c'è un lavoro preparativo a livello di stesura di codice da fare:

- nell' inizializzazione dell' oggetto Grid, bisogna mettere il parametro canHelp uguale a true e inserire una funzione OnHelp richiamata alla pressione del tasto che fa apparire una finestra del browser senza menubar,toolbar, ecc;

- nella pagina html richiamata dal browser possono essere elencate le possibili scelte predefinite per filtro e ordinamento, il codice per ognuna delle quali deve essere fatto eseguire da uno script separato incluso nella pagina;

- lo script con le operazioni da eseguire fa sicuramente riferimento alla funzione SetFilterSort.

L' esempio seguente mostra i tre passi di sopra applicati alla tabella "Cars", che prevede la possibilità di far apparire all' utente finale alcune scelte predefinite per il filtro e l' ordinamento.

file Cars.js
...

function Cars_init() {
	params=new Object();
	...
	params.canHelp=true;
	params.OnHelp=OnHelp;
	...
	Cars=new Grid(params);
}

function OnHelp() {
	var height=300;
	var width=400;
	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="helpCartridgesEnglish.htm";
}
...

Cars_init();


file helpCarsEnglish.htm
<HEAD>
<TITLE>HELP</TITLE>
<STYLE>
A { text-decoration:none } 
A:visited { color: blue }
</STYLE>
<SCRIPT SRC=helpCars.js></SCRIPT>
</HEAD>
<BODY BGCOLOR=#ffffcc>
<FONT FACE=Arial STYLE="font-size:9pt">
<CENTER>Show only the cars:</CENTER><BR>
<FORM ACTION=javascript:DoHelpCars() ID=form1>
 <INPUT TYPE=RADIO ID=menuCars NAME=menuCars VALUE=0 CHECKED>of
 <SELECT ID=carsModel STYLE="font-face:Arial;font-size:9pt">
 <OPTION VALUE=0>Audi</OPTION>
 <OPTION VALUE=1>BMW</OPTION>
 <OPTION VALUE=2>Volkswagen</OPTION></SELECT><BR><BR>
 <INPUT TYPE=RADIO ID=menuCars NAME=menuCars VALUE=1>with a power 
 <SELECT ID=carsPower STYLE="font-face:Arial;font-size:9pt">
 <OPTION VALUE=0>< 80 cc</OPTION>
 <OPTION VALUE=1>between 80 cc and 100cc</OPTION>
 <OPTION VALUE=2>> 100 cc</OPTION></SELECT><BR><BR>
 <INPUT TYPE=RADIO ID=menuCars NAME=menuCars VALUE=2>of price
 <SELECT ID=carsPrice STYLE="font-face:Arial;font-size:9pt">
 <OPTION VALUE=0>< 10.000 $</OPTION>
 <OPTION VALUE=1>between 10.000 $ and 20.000 $</OPTION>
 <OPTION VALUE=2>> 20.000 $</OPTION></SELECT><BR><BR>
 <INPUT TYPE=RADIO ID=menuCars NAME=menuCars VALUE=3>with a percorrence
 <SELECT ID=carsKm STYLE="font-face:Arial;font-size:9pt">
 <OPTION VALUE=0>< 4.000 miles</OPTION>
 <OPTION VALUE=1>between 4.000 and 60.000 miles</OPTION>
 <OPTION VALUE=2>> 60.000 miles</OPTION></SELECT><BR><BR>
  <INPUT TYPE=RADIO ID=menuCars NAME=menuCars VALUE=4>older  </A>
 <SELECT ID=carsRegistration STYLE="font-face:Arial;font-size:9pt">
 <OPTION VALUE=0>than 3 years</OPTION>
 <OPTION VALUE=1>between 3 and 5 years</OPTION>
 <OPTION VALUE=2>more than 5 years</OPTION>
 </SELECT>
 <BR><BR><BR>
<CENTER>Sort by  <SELECT ID=sortCars STYLE="font-face:Arial;font-size:9pt">
<OPTION VALUE=2>model</OPTION>
<OPTION VALUE=3>displacement</OPTION>
<OPTION VALUE=4>registration date</OPTION>
<OPTION VALUE=5>covered miles</OPTION>
<OPTION VALUE=6>power</OPTION>
<OPTION VALUE=7>kind of fuel</OPTION>
<OPTION VALUE=8 SELECTED>price</OPTION>
</SELECT>
  in mode<SELECT ID=sortCarsMode STYLE="font-face:Arial;font-size:9pt">
<OPTION VALUE=A>ascending</OPTION>
<OPTION VALUE=D>descending</OPTION>
</SELECT><BR><BR>
<INPUT TYPE=SUBMIT STYLE="font-face:Arial;font-size:9pt" VALUE=Filter>
</CENTER>
</FONT>
</BODY>


file helpCars.js
function DoHelpCars() {
	var sort=document.getElementById("sortCarsMode").value+document.getElementById("sortCars").value;
	if (document.getElementById("form1").menuCars[0].checked) {
		if (document.getElementById("carsModel").value==0)
			opener.Cars.SetFilterSort([[2,14,"audi"]],sort);
		if (document.getElementById("carsModel").value==1)
			opener.Cars.SetFilterSort([[2,14,"bmw"]],sort);
		if (document.getElementById("carsModel").value==2)
			opener.Cars.SetFilterSort([[2,14,"volkswagen"]],sort);
	} else if (document.getElementById("form1").menuCars[1].checked) {
		if (document.getElementById("carsPower").value==0)
			opener.Cars.SetFilterSort([[6,4,80]],sort);
		if (document.getElementById("carsPower").value==1)
			opener.Cars.SetFilterSort([[6,6,"80_100"]],sort);
		if (document.getElementById("carsPower").value==2)
			opener.Cars.SetFilterSort([[6,2,100]],sort);
	} else if (document.getElementById("form1").menuCars[2].checked) {
		if (document.getElementById("carsPrice").value==0)
			opener.Cars.SetFilterSort([[8,4,10000]],sort);
		if (document.getElementById("carsPrice").value==1)
			opener.Cars.SetFilterSort([[8,6,"10000_20000"]],sort);
		if (document.getElementById("carsPrice").value==2)
			opener.Cars.SetFilterSort([[8,2,20000]],sort);	
	} else if (document.getElementById("form1").menuCars[3].checked) {
		if (document.getElementById("carsKm").value==0)
			opener.Cars.SetFilterSort([[5,4,4000]],sort);
		if (document.getElementById("carsKm").value==1)
			opener.Cars.SetFilterSort([[5,6,"4000_60000"]],sort);
		if (document.getElementById("carsKm").value==2)
			opener.Cars.SetFilterSort([[5,2,60000]],sort);	
	} else if (document.getElementById("form1").menuCars[4].checked) {
		var d=new Date();
		if (document.getElementById("carsRegistration").value==0)
			opener.Cars.SetFilterSort([[4,2,d.getDate()+"/"+(d.getMonth()+1)+"/"+(Number(d.getFullYear())-3)]],sort);
		if (document.getElementById("carsRegistration").value==1)
			opener.Cars.SetFilterSort([[4,6,d.getDate()+"/"+(d.getMonth()+1)+"/"+(Number(d.getFullYear())-5)+"_"+d.getDate()+"/"+(d.getMonth()+1)+"/"+(Number(d.getFullYear())-3)]],sort);
		if (document.getElementById("carsRegistration").value==2)
			opener.Cars.SetFilterSort([[4,4,d.getDate()+"/"+(d.getMonth()+1)+"/"+(Number(d.getFullYear())-5)]],sort);	
	}
	window.close();
}