24-06-2011, 02:35
Jakoś udało mi się to złożyć w całość, więc zamieszczam cały działający kod formularza, który zlicza wartości podane w "value", może się komuś to przyda.
Proszę tylko o sprawdzenie poprawności kodu, ale powinno być wszystko ok.
Dziękuję za pomoc.
Proszę tylko o sprawdzenie poprawności kodu, ale powinno być wszystko ok.
Dziękuję za pomoc.
Kod PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="generator" content="WebSite PRO 4.3" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="Reply-to" content="" />
<meta http-equiv="content-Language" content="pl" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="Author" content="" />
<meta name="robots" content="all" />
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function toggleChecked(status) {
$(".checkbox").each( function() {
$(this).attr("checked",status);
});
}
function toggleChecked(status) {
$(".checkboxes input").each( function() {
$(this).attr("checked",status);
});
}
</script>
<script language="JavaScript" type="text/javascript">
function clearDefault(EL) {
if (EL.defaultValue == EL.value) EL.value = '';
}
</script>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
body {
font: 12px/*85%/1.3*/ Verdana, Arial, sans-serif;
color: #345032;
background-color: white;
}
p,h1,h2,h3,h4,h5,h6,li,ul,ol,img, br {
margin: 0;
padding: 0;
}
div.content {
margin: 0 auto;
width:700px;
height:auto;
padding-top:20px;
padding-left: 90px;
padding-bottom: 10px;
background-color: #fff;
border-top: 35px solid #18668b;
border-bottom: 5px solid #18668b;
border-left: 5px solid #18668b;
border-right: 5px solid #18668b;
}
td.left1 {
width:85%;
height:20px;
font-weight : bold;
padding: 0px 40px;
}
td.left2 {
width:100px;
height:20px;
padding: 0px 10px;
}
td.wyczysc, td.wyslij, td.reset, td.wynik {
width: 22%;
}
</style>
</head>
<body>
<div id="center">
<form action="" method="POST" onreset="if (!confirm('Czy na pewno mam wyczyścić Twoje zaznaczenia oraz wynik ?')) return false; else window.location=self.location">
<div class="content">
<table bgcolor="transparent" border="0" width="88%" cellspacing="0" cellpadding="0">
<ul>
<tr>
<!-- brak opcji wyboru -->
<td class="left1">1.</td>
</tr>
<tr>
<td class="left2"><li>+40<span class="rmove"><input type="radio" id="01" name="radio1" value="40" checked="checked" /></span></li></td>
</tr>
<tr>
<!-- Dwie opcje wyboru, 2 x radio, wybor tylko jednej -->
<td class="left1">2.</td>
</tr>
<tr>
<td class="left2"><li><label>+10<span class="rmove"><input type="radio" id="03" name="radio2" value="10" checked="checked" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+50<span class="rmove"><input type="radio" id="02" name="radio2" value="50" /></span></label></li></td>
</tr>
<tr>
<!-- Cztery opcje wyboru, 4 x radio, wybor tylko jednej -->
<td class="left1">3.</td>
</tr>
<tr>
<td class="left2"><li><label>+10<span class="rmove"><input type="radio" id="04" name="radio3" value="10" checked="checked" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+40<span class="rmove"><input type="radio" id="05" name="radio3" value="40" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+70<span class="rmove"><input type="radio" id="06" name="radio3" value="70" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+120<span class="rmove"><input type="radio" id="07" name="radio3" value="120" /></span></label></li></td>
</tr>
<tr>
<!-- Cztery opcje wyboru, 4 x radio, wybor tylko jednej -->
<td class="left1">4.</td>
</tr>
<tr>
<td class="left2"><li><label>+20<span class="rmove"><input type="radio" id="08" name="radio4" value="20" checked="checked" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+20<span class="rmove"><input type="radio" id="09" name="radio4" value="20" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+30<span class="rmove"><input type="radio" id="10" name="radio4" value="30" /></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>+50<span class="rmove"><input type="radio" id="11" name="radio4" value="50" /></span></label></li></td>
</tr>
<tr>
<!-- Dwa pola wyboru, 2 x checkbox, mozna wybrac dwa -->
<td class="left1"><label>5.<span style="padding-left:155px;font-size:10px;color:#888;font-style:italic;">[<span style="color:#000">zaznacz</span>]\[<span style="color:#000">odznacz</span>] wszystkie </span><input type="checkbox" onclick="toggleChecked(this.checked)"></label></td>
</tr>
<tr>
<td class="left2"><li><label>+50<span class="rmove"><span class="checkboxes"><input type="checkbox" id="12" name="checkbox1" value="50" /></span></span></label></li></td>
</tr>
<tr>
<td class="left2"><li><label>50<span class="rmove"><span class="checkboxes"><input type="checkbox" id="13" name="checkbox2" value="50" /></span></span></label></li></td>
</tr>
</ul>
</table>
<br />
<div id="footer">
<table cellspacing="0" cellpadding="0">
<tr>
<!-- Button WYCZYSC, czysci zaznaczenia i wynik -->
<td class="wyczysc"><input type="reset" value="Wyczyść zaznaczenia" style="color: #18668B; background-color: #AACBBB; font-weight: bold; width: 180px; border-style: groove; border-color: #18668B; border-width: 1px" /></td>
<!-- Button WYSLIJ -->
<td class="wyslij"><input name="submit" type="submit" value="OBLICZ" style="color: #18668B; background-color: #AACBBB; font-weight: bold; width: 100px; border-style: groove; border-color: #18668B; border-width: 1px" /></td>
<!-- Wynik Obliczen -->
<td class="wynik"><span style="font-weight: bold; font-size:12px; color:#cdd1d1; ">Wynik:</span> <?php
if (isset($_POST['submit'])) {
$zlicz = $_POST['radio1'] + $_POST['radio2'] + $_POST['radio3'] + $_POST['radio4'] + $_POST['checkbox1'] + $_POST['checkbox2'];
echo('<input type="text" onFocus="clearDefault(this);" name="nazwa" value="' . $zlicz . ' Punktów" style="color: #FF0000; background-color: #AACBBB; font-weight: bold; width: 105px; height: 18px; border-style: groove; border-color: #cdd1d1; border-width: 1px; padding-left:10px" readonly="readonly" /><br />');
}
?></td>
</tr>
</table>
</div>
</div>
</form>
</div>
</body>
</html>
