Többször felmerül a kérdés, hogy tudnánk feldolgozni a több opció kiválasztására lehetőséget adó jelölőnégyzeteket.
Évának köszönhetően ma ezt a problémát oldjuk meg egy izgalmas cikk keretében!
Feltételezzük, hogy a kedves Olvasónak már van némi ismerete HTML űrlapok terén, és tudja azt is, hogy tudjuk az egyszerű elemeket (melyeknél csak egy adat jön át) feldolgozni.
Most egy egyszerű példában megnézzük, hogy lehet az olyan elemeket megjeleníteni, ahol adott űrlapelemhez csatoltan több adatot kell tárolnunk.
Valószínüleg mindannyian találkoztunk már jelölőnégyzettel különböző weboldalak oldalain.
Nézzünk előbb egy jelölőnégyzetet:
<label for="kenu">Kenutúrák</label>
<input id="utazas" value="kenu"/>
Gyors ismétlésként nézzük meg ennek az elemnek a tulajdonságait:
- for=””-a label cimkén belül, mindig egy egyező id-jű űrlapelemre utal. Ebben az esetben az id=”kenu” -ra
- name=”” -az itt megadott érték kerül a globális $_POST tömbünk kulcsába, tehát az adott elem értékét a $_POST['opcio'] változóval érhetjük el.
- value=”” -a kiválasztott elem értéke.
Ha egyszerre több elemet szeretnénk átadni, a következő trükköt alkalmazzuk:
<input name="opcio[]" id="utazas" value="kenu"/>
Az űrlapelem name mezőjét egy tömbbé alakítjuk.
Az egész űrlap forráskódját itt láthatjuk:
<form method="post" action="<?php print $_SERVER['PHP_SELF'];?>">
<fieldset>
<legend>Szolgáltatások</legend>
<table >
<tr><th colspan="2">Válasszon, mely szolgáltatásunkat veszi leggyakrabban igénybe.</th></tr>
<tr>
<td><label for="kenu">Kenutúrák</label></td>
<td><input name="opcio[]" value="kenu"/></td>
</tr>
<tr>
<td><label for="szabadteri">Szabadtéri programok</label></td>
<td><input name="opcio[]" value="szabadteri" /></td>
</tr>
<tr>
<td><label for="uszoda">Uszoda</label></td>
<td><input name="opcio[]" value="uszoda"/></td>
</tr>
<tr>
<td><label for="kondi">Konditerem</label></td>
<td><input name="opcio[]" value="kondi"/></td>
</tr>
<tr>
<td><label for="szauna">Szauna</label></td>
<td><input name="opcio[]" value="szauna"/></td>
</tr>
<tr>
<td><label for="masszazs">Masszázs</label></td>
<td><input name="opcio[]" value="masszazs"/></td>
</tr>
</table>
<input value="Mehet" class="submit"/>
</fieldset>
</form>
Ezek után már csak fel kell dolgoznunk a küldött adatokat.
Lássuk a kódot, azután a magyarázatot!
if(isset($_POST['mehet']))
{
//opciók átvltele, ne felejtsük, itt egy tömböt kapunk
$opciok=array();
$opciok=$_POST['opcio'];
//válasz eleje
$ret="Ön az alábbi szolgáltatásainkat jeölte meg:<br />";
//az átvett értékeket nem tudjuk közvetlenül kiíratni, mert azokban nem szerepel ékezet, ezért ezt egy asszociatív tömbből olvassuk ki
$tomb=array('kondi'=>'Konditerem','szabadteri'=>'Szabadtéri programok','uszoda'=>'Uszoda','kenu'=>'Kenutúra','masszazs'=>"Masszázs",'szauna'=>"Szauna");
//a válaszhoz szükséges tömbünk összeállítása
foreach($opciok as $opcio)
{
$valasz[]=$tomb[$opcio];
}
$ret.=implode(", ",$valasz);
//kiválasztott opciók kiíratása
print "<p>".$ret."</p>";
}
Amint láthattuk, ebben az esetben ugyanaz a fájl dolgozza fel az űrlapot, amelyik tartalmazza is, tehát először vizsgálom, el lettek-e küldve az adatok.
(if(isset($_POST['mehet'])))
Ezek után átvesszük az elküldött adatokat egy $opciok tömbbe.
Ez a tömb, ékezet nélkül tartalmazza a kiválasztott szolgáltatások neveit, hisz ez az az érték lesz, amit a value=”” tulajdonságként adtunk meg.
Ezt orvosolandó, létrehoztunk egy tömböt, mely tartalmazza a szolgáltatások neveit ékezetesen, és ebből kiolvasva a megfelelő értékekkel állítjuk össze a választ.
Ahelyett, hogy foreach-et használnánk a tömbelemek kiírásához, most az implode függvényt használjuk, mely az első paraméterében megadott vessző+szóközzel fogja összefűzni a tömb elemeit. Így biztosak lehetünk abban, hogy a felsorolás végén nem lesz vessző, csak az elemek között.
Küldés után az alábbi választ láthatjuk:
A fenti fájl megtekinthető az iskola gyakorló oldalán, az alábbi címen.
illetve letölthető itt.
A PHP-webprogramozás ma már külön, a webdesignhoz szorosan kapcsolódó informatika terület.
Ha kedvet érez ahhoz, hogy profin megtanulja, vagy szívesen dolgozna webprogramozóként, akkor jelentkezzen a november első hetében induló PHP-Webprogramozó Mester képzésünkre!
Jelentkezés itt!
További szép napot és jó tanulást kíván,
a Netlogi C School csapata!
Gyakorlat orientált informatika oktatás rugalmas időbeosztással!
www.netlogi-c.net
