04 - Hyrje ne programim ne PHP

Ne kete leksion

Struktura e nje faqe PHP

Shembull

hello.php

<html>

<head>

<title>Sample</title>

</head>

<body>

<table>

<thead>

<tr>

<th>Nr</th>

<th>Artikulli</th>

</tr>

</thead>

<tbody>

<?php

for($i=1;$i<7;$i++)

{

?>

<tr>

<td><?php echo $i; ?></td>

<td><h<?php echo $i; ?>>Artikulli <?php echo $i ?><?php echo '</h'.$i ?>></td>

</tr>

<?php

}

?>

</tbody>

</table>

</body>

</html>

Ushtrim - Ndertimi i nje tabele shahu

shahu1.php

<html>

<head>

<title>Tabele Shahu</title>

</head>

<body>

<table border="1" width="400">

<?php

for($i=1;$i<=8;$i++)

{

?>

<tr>

<?php

for($j=1;$j<=8;$j++)

{

?>

<td height="50"

<?php

if((($i+$j)%2)==0)

{

echo 'bgColor="brown" ';

}

else

{

echo 'bgColor="white" ';

}

?>

>

</td>

<?php

}

?>

</tr>

<?php

}

?>

</table>

</body>

</html>

Ushtrim - Te shtohet nje lokalizues ne fushen e shahut

<html>

<head>

<title>Tabele Shahu</title>

<script language="JavaScript">

function tell(x,y)

{

alert('Ju keni klikuar ne kutine '+x+','+y);

}

</script>

</head>

<body>

<table border="1" width="400">

<?php

for($i=1;$i<=8;$i++)

{

?>

<tr>

<?php

for($j=1;$j<=8;$j++)

{

?>

<td height="50" onClick="tell(<?php echo $i; ?>,<?php echo $j; ?>);"

<?php

if((($i+$j)%2)==0)

{

echo 'bgColor="brown" ';

}

else

{

echo 'bgColor="white" ';

}

?>

>

</td>

<?php

}

?>

</tr>

<?php

}

?>

</table>

</body>

</html>

Shembull

test.php

<link rel="stylesheet" type="text/css" href="style.css">

<script language="JavaScript" src="logic.js"></script>

<table>

<?php

$n=100;

for($i=1;$i<=$n;$i++)

{

echo "

<tr onClick='tell($i);' >

<td>

$i

</td>

<td>

Artikulli $i

</td>

</tr>

";

}

?>

</table>

<table>

<tr>

<td>

test table

</td>

</tr>

</table>

logic.js

// JavaScript Document

function tell(rr)

{

alert('Ju klikuat ne rreshtin'+rr);

}

style.css

/* CSS Document */

table

{

width:400px;

margin:25px;

box-shadow:-5px -5px 3px #cccccc;

border-style:solid;

border-width:1px;

border-color:#cccccc;

}

tr:nth-child(odd)

{

background-color:#cccccc;

}

tr:nth-child(6n)

{

background-color:#6699cc;

}