Właściwie nie można mówić o kontrze, bo języki te powinny nie rywalizować, a współpracować.
Javascript to typowy język wykonywany po stronie klienta, PHP wręcz odwrotnie - wykonywany jest po stronie serwera. Dzięki PHP możemy tworzyć kod strony, który może przecież zawierać kod Javascriptu. Dzięki temu do JS możemy przekazywać dane wprost z serwera (np kolejne rekordy bazy MySQL, listę plików itp.).
Zaraz, zaraz. Przecież mówiłeś, że skrypty trzeba trzymać w oddzielnych plikach? Tak. Powinno się to robić. Ale nic się nie stanie, jak czasami złamiemy tą zasadę. Większość dużych portali to robi i jakoś żyje. I to całkiem dobrze żyje. Zawsze zresztą można wykorzystać Ajaxa, który jest połączeniem JS ze skryptami po stronie serwera...
Standardowo PHP nie udostępnia funkcji, która pobiera szerokość i wysokość ekranu. JS posiada obiekt screen, który ma właściwości screen.width i screen.height służące do pobrania wymiarów okna. Poniższy przykład prezentuje jak za pomocą Javascript (wykorzystując query string ustawiony za pomocą location.href) przekazać do PHP te parametry:
<?php
if (isset($_GET['width']) && isset($_GET['height'])) {
echo "Szerokość ekranu: ".$_GET['width']." ";
echo "Wysokość ekranu: ".$_GET['height'];
} else {
echo '<script type="text/javascript">';
echo 'location.href="';
echo $_SERVER['SCRIPT_NAME'].'?'.$_SERVER['QUERY_STRING'];
echo '&width=" + screen.width + "&height=" + screen.height'."\n";
echo "</script>\n";
die();
}
?>
Poniższy przykład pokazuje wykorzystanie PHP do pobrania listy plików graficznych z określonego katalogu na serwerze. Za pomocą PHP tworzymy kod JS z tablicą zawierającą nazwy plików:
<?
$dozwolone_rozszerzenia = Array('jpg','gif');
$folder = opendir('zdjecia');
$nazwy_zdjec = Array();
while (@gettype($plik = readdir($folder)) != boolean)
{
if (!is_dir("$nazwa_katalogu_z_foto/$plik")) {
if (in_array(substr($plik,strrpos($plik,".")+1), $dozwolone_rozszerzenia)) {
$nazwy_zdjec[][nazwa] = $plik;
}
}
}
closedir($folder);
?>
<script type="text/javascript">
var Zdjecia = new Array(
<?php
for ($x=0; $x < count($nazwy_zdjec); $x++) {
echo '\''.$nazwy_zdjec[$x][nazwa].'\'';
if ($x<count($nazwy_zdjec)-1) echo ',';
}
?>
);
</script>
Skrypt php przeglądając dany katalog sprawdza, czy dany plik ma odpowiednie rozszerzenie. Jeżeli wszystko się zgadza, dodaje go do tablicy $nazwy_zdjec. Po zamknięciu katalogu za pomocą PHP tworzymy kod JS, w którym tworzymy tablicę Zdjecia. Wykonujemy pętlę w PHP po elementach tablicy $nazwy_zdjec i wypisujemy odpowiednio każdy z nich. W naszym skrypcie do PHP pobraliśmy tylko nazwę, jednak nic nie stoi na przeszkodzie by pobrać także wymiary grafik (np za pomocą funkcji getimagesize)
Bezpośrednio z Javascriptu nie mamy dostępu do bazy danych MySQL. Wystarczy jednak wykorzystać kilka linijek kodu PHP aby taką możliwość sobie sprawić:
<script type="text/javascript">
var tabRekordy = new Array(
<?php
$baza = @mysql_pconnect("$server", "$uzytkownik", "$haslo");
if (!$baza) die("Połączenie z $server się nie powiodło.");
if (!@mysql_select_db($baza)) die("Wybranie bazy $baza się nie powiodło.");
$rezultat = @mysql_query("SELECT * FROM $tabelaMySQL");
$ileRekordow = mysql_num_rows($rezultat);
for ($y=0; $y<$ileRekordow; $y++) {
$rekord = @mysql_fetch_row($query);
echo 'Array(';
for ($x=0; $x<count($rekord); $x++) {
echo '"'.$rekord[$x].'"';
if ($x<count($rekord)-1) echo ',';
}
echo ')';
if ($i<$ileRekordow-1) echo ',';
}
?>
);
</script>
Zasada działania jest podobna jak w poprzednim skrypcie. Pobieramy rekordy z bazy danych, a następnie wykonując po nich pętlę tworzymy kod JS.
W wyniku powyższego rezultatu możemy dostać taką wielowymiarową tabelę:
<script type="text/javascript">
var tabRekordy = new Array(
Array('Marcin','184','bronzowe','czarne','m'),
Array('Ania','170','bronzowe','blond','k'),
Array('Agnieszka','172','bronzowe','bronzowe','k')
);
</script>
Powiedzmy, że chcemy utworzyć na naszej stronie serię przycisków typu checkbox, które moglibyśmy wykorzystać np. do oznaczania wiadomości do usunięcia.
Aby grupa takich pól była reprezentowana w PHP przez tablicę (co w znaczący sposób ułatwi operacje na takich wartościach), powinnismy do ich nazwy dodać kwadratowe nawiasy np. nazwa[].
<form name="Formularz" method="post" action="skrypt.php"> <fieldset> <input type="checkbox" name="hobby[]" value="komputer">komputer <input type="checkbox" name="hobby[]" value="rower">rower <input type="checkbox" name="hobby[]" value="koszykowka">koszykowka <input type="checkbox" name="hobby[]" value="basen">basen <input type="checkbox" name="hobby[]" value="film">film <input type="submit" value="Wyślij" /> <fieldset> </form>
Kod pliku skrypt.php:
<?php
if (!empty($_POST[hobby])) {
foreach ($_POST[hobby] as $pozycja) {
echo "zaznaczyłeś: $pozycja<br/>";
}
}
?>
Jeżeli powyższy formularz zostanie wyslany do skryptu PHP, wartości zaznaczonych checkboxów będą dostąpne w PHP w postaci tablicy hobby.
Jako, że w nazwie widnieją nawiasy kwadratowe, zwykłe odwołanie się poprzez nazwę nie będzie możliwe. Aby odwołać się do tak nazwanych elementów z poziomu Javascript powinniśmy skorzystać z instrukcji:
var tablicaHobby = document.getElementById('hobby[]');
for (x=0; x<tablicaHobby.length; x++) {
if (tablicaHobby[x].checked) document.write('Zaznaczyłeś: ' + tablicaHobby[x].value + '<br />');
}
Oczywiście powyższa technika dodawania nawiasów kwadratowych do nazw nie tyczy się li tylko elementów typu checkbox.
Każdy element, który nazwiemy z zastosowaniem powyższej metody zosanie zgrupowany w tablicę. I tak częstokroć spotykanym przypadkiem jest zastosowanie powyższej metody dla znacznika typu SELECT, dla którego zastosowano parametr multiple (który powoduje, ze możemy na raz wybrać kilka wartości):
<select names="narzedzia[]" multiple="multiple"> <option value="srubokret"> <option value="mlotek"> <option value="wiertarka"> </select>