PHPhulp.nl PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
b

div gebruiken in form

Door ben lubben op 16-04-2013 08:34
2.065 views
hallo mensen

ik ben bezig met een reserverings systeem aan het maken voor een restaurant. dit hoort bij een school opdracht dus moet wel.

nu loop ik tegen een probleem aan.
bepaalde gegevens haal ik uit de sessie zoals userid enz. verder word er gegevens gevraagd bij het reserveren . nadat de gebruiker op de knop klikt "tafel kiezen" komen er op een platte grond divjes over een platte grond op de plek waar geen reservering staat op die tijd, datum en plek.

nu zit ik met het probleem dat ik er niet uitkom dat ik een divje selecteerbaar maak zoals een radio button of een checkbox.
het mooiste is een radio button effect maar ik krijg helemaal niks voor mekaar daarmee.
hier is me code.



		<input type="submit" value="tafel selecteren">
		</p>
		</form>
			
			<div id="reservetablepicture">
			<?php 
			if (isset($_GET['day'])) {
			$resdate = $_GET['year'] . $_GET['month'] . $_GET['day'];
			$restime = $_GET['time'];
			$respers = $_GET['persons'];
			include "inc/dbconnect.php";
			
			
			$qtable1 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '1'");
			$tf1_rows = mysql_num_rows($qtable1);
			if ($tf1_rows < 1 ) {
			echo "<div id='table1' class=' '>1</div>";
			}
			$qtable2 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '2'");
			$tf2_rows = mysql_num_rows($qtable2);
			if ($tf2_rows < 1 ) {
			echo "<div id='table2' class=' '>2</div>";
			}
			$qtable3 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '3'");
			$tf3_rows = mysql_num_rows($qtable3);
			if ($tf3_rows < 1 ) {
			echo "<div id='table3' class=' '>3</div>";
			}
			$qtable4 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '4'");
			$tf4_rows = mysql_num_rows($qtable4);
			if ($tf4_rows < 1 ) {
			echo "<div id='table4' class=' '>4</div>";
			}
			$qtable5 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '5'");
			$tf5_rows = mysql_num_rows($qtable5);
			if ($tf5_rows < 1 ) {
			echo "<div id='table5' class=' '>5</div>";
			}
			$qtable6 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '6'");
			$tf6_rows = mysql_num_rows($qtable6);
			if ($tf6_rows < 1 ) {
			echo "<div id='table6' class=' '>6</div>";
			}
			$qtable7 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '7'");
			$tf7_rows = mysql_num_rows($qtable7);
			if ($tf7_rows < 1 ) {
			echo "<div id='table7' class=' '>7</div>";
			}
			$qtable8 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '8'");
			$tf8_rows = mysql_num_rows($qtable8);
			if ($tf8_rows < 1 ) {
			echo "<div id='table8' class=' '>8</div>";
			}
			$qtable9 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '9'");
			$tf9_rows = mysql_num_rows($qtable9);
			if ($tf9_rows < 1 ) {
			echo "<div id='table9' class=' '>9</div>";
			}
			$qtable10 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '10'");
			$tf10_rows = mysql_num_rows($qtable10);
			if ($tf10_rows < 1 ) {
			echo "<div id='table10' class=' '>10</div>";
			}
			$qtable11 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '11'");
			$tf11_rows = mysql_num_rows($qtable11);
			if ($tf11_rows < 1 ) {
			echo "<div id='table11' class=' '>11</div>";
			}
			$qtable12 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '12'");
			$tf12_rows = mysql_num_rows($qtable12);
			if ($tf12_rows < 1 ) {
			echo "<div id='table12' class=' '>12</div>";
			}
			$qtable13 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '13'");
			$tf13_rows = mysql_num_rows($qtable13);
			if ($tf13_rows < 1 ) {
			echo "<div id='table13' class=' '>13</div>";
			}
			$qtable14 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '14'");
			$tf14_rows = mysql_num_rows($qtable14);
			if ($tf14_rows < 1 ) {
			echo "<div id='table14' class=' '>14</div>";
			}
			$qtable15 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '15'");
			$tf15_rows = mysql_num_rows($qtable15);
			if ($tf15_rows < 1 ) {
			echo "<div id='table15' class=' '>15</div>";
			}
			$qtable16 = mysql_query("SELECT * FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' AND tableid = '16'");
			$tf16_rows = mysql_num_rows($qtable16);
			if ($tf16_rows < 1 ) {
			echo "<div id='table16' class=' '>16</div>";
			}
			}
			?>
			
			
			
			
	       </div>


hier is de css van de divjes waar het om gaat


#table1 {
top: 7px;
left: 8px;
background-color:green;
width: 58px;
height: 40px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table1:hover {
background-color: blue;
}
#table2 {
top: 7px;
left:83px;
background-color:green;
width: 58px;
height: 40px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table3 {
top: 7px;
left:158px;
background-color:green;
width: 58px;
height: 40px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table4 {
top: 7px;
left:232px;
background-color:green;
width: 58px;
height: 40px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table5 {
top: 7px;
left:307px;
background-color:green;
width: 58px;
height: 40px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table6 {
top: 58px;
left:5px;
background-color:green;
width: 44px;
height: 50px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table7 {
top: 116px;
left:5px;
background-color:green;
width: 58px;
height: 50px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table8 {
top: 80px;
left:119px;
background-color:green;
width: 59px;
height: 59px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table9 {
top: 80px;
left:215px;
background-color:green;
width: 59px;
height: 59px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table10 {
top: 59px;
right:146px;
background-color:green;
width: 29px;
height: 53px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table11 {
top: 59px;
right:116px;
background-color:green;
width: 29px;
height: 53px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table12 {
top: 59px;
right:86px;
background-color:green;
width: 29px;
height: 53px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table13 {
top: 156px;
left:162px;
background-color:green;
width: 66px;
height: 66px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table14 {
top: 157px;
left:317px;
background-color:green;
width: 66px;
height: 66px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}

#table15 {
top: 18px;
right:4px;
background-color:green;
width: 44px;
height: 50px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}
#table16 {
top: 88px;
right:4px;
background-color:green;
width: 58px;
height: 50px;
position:absolute;	opacity:0.6;
	filter:alpha(opacity=60);
}


ik weet dat de php/mysql niet optimaal is maar dat kan ik later wel verbeteren.

weet iemand hoe ik dus zo'n div aan klikbaar kan maken voor een form?

mvg,

ben
Willem vp
16-04-2013 09:18 gewijzigd op 16-04-2013 09:19
Om te beginnen moet je de hele div in je form opnemen.

Vervolgens moet je je afvragen of iemand maar 1 tafel mag reserveren of dat meerdere tafels ook mogelijk zijn.

Het bijhouden van een reservering kan in een hidden input. Met een onclick-event in je div en een stukje javascript kun je de reservering in die input opslaan.

Wanneer een gebruiker slechts 1 tafel mag reserveren, kun je in die input het nummer van de aangeklikte tafel opslaan:

<input type="hidden" name="reservedtable" id="reservedtable" value="none"/>
<div id="table9" onclick="document.getElementById('reservedtable').value = '9';"></div>


Wanneer een gebruiker meerdere tafels kan reserveren, zou je voor elke tafel een hidden input kunnen maken die bijhoudt of die tafel wel of niet is gereserveerd. In je jevascript moet je dan de waarde omwisselen tussen 1 en 0 (of ja en nee).

In theorie zou die laatste oplossing ook moeten kunnen in 1 hidden input en een array, maar dat vergt wat ingewikkelder javascripting.

En doe inderdaad iets aan je php/mysql-code, want dit is heel erg inefficiënt. Hoe langer je daarmee wacht, hoe meer werk het wordt om dat netjes te maken.
b
ben lubben
16-04-2013 09:39 gewijzigd op 16-04-2013 12:45
Hallo willem vp,

Ik zit nu in de auto en zal vanmiddag even wat testen ermee.

Dat php/mysql kreeg ik gisteren niet goed voor elkaar met fetchen. Ben daar geen prof in.

Bedankt.

Mvg.
Ben
T
Teun Hesseling
16-04-2013 09:50 gewijzigd op 16-04-2013 09:51
Je zou dat op kunnen lossen door 1 qeury te maken en vervolgens met een <?php while($row = mysql_fetch_assoc)
?> er dooorheen lopen. En dan de id van je mysql gebruiken als tafel nummer.
Dan krijg je zoiets: <?php echo '<div id="table'.$row['id'].'" class=" ">'.$row['id'].'</div>'; ?>
b
ben lubben
16-04-2013 12:55
hallo,

bedankt teun. ik heb hem nu een stuk korter.
het ziet er nu zo uit


			$querytable = mysql_query("SELECT tableid FROM reserverules WHERE resdate = '$resdate' AND restime = '$restime' ");
			while($row = mysql_fetch_assoc($querytable))
			
			
			echo "<div id='table" . $row['tableid'] . "'>" .$row['tableid']. "</div>";


nu heb ik nog het probleem met het aanklikken van de div. ik ben er al vaker tegenaan gelopen en krijg het nooit voor mekaar om een onklick te gebruiken in een echo.

verder heb ik nu het probleem met de query dat hij de tafels toont die gereserveerd zijn ipv de tafels die nog niet gereserveerd zijn.

alvast bedankt voor de moeite.

mvg,

ben
Willem vp
16-04-2013 13:07 gewijzigd op 16-04-2013 13:08
Ben lubben op 16/04/2013 12:55:51

nu heb ik nog het probleem met het aanklikken van de div. ik ben er al vaker tegenaan gelopen en krijg het nooit voor mekaar om een onklick te gebruiken in een echo.

Kun je eens laten zien wat je geprobeerd hebt dan? Ik gok dat het een probleem is met de quotes.

Je zou het eens met een heredoc kunnen proberen; zelf vind ik dat vaak handiger dan een simpele string echo'en, omdat je dan geen rekening hoeft te houden met het escapen van quotes:
<?php
   $tableid = $row['tableid'];
   echo <<<EOT
<div id="table$tableid" onclick="document.getElementById('reservedtable').value = '$tableid';">
   $tableid
</div>
EOT;
?>

b
ben lubben
16-04-2013 16:18
Willem vp op 16/04/2013 13:07:55

Je zou het eens met een heredoc kunnen proberen; zelf vind ik dat vaak handiger dan een simpele string echo'en, omdat je dan geen rekening hoeft te houden met het escapen van quotes:
<?php
   $tableid = $row['tableid'];
   echo <<<EOT
<div id="table$tableid" onclick="document.getElementById('reservedtable').value = '$tableid';">
   $tableid
</div>
EOT;
?>



dit gaat ook niet werken. zover ik er verstand van heb is omdat $row['tableid'] meerdere variables heeft. dit kan je volgens mij niet zomaar naar 1 variable worden geplaatst. dan pakt hij maar 1 mee wat hij ook bij mij deed. hiermee werkt het klikken erop wel.

de regel die ik nu gebruik is:

echo "<div id='table" . $row['tableid'] . "' onclick = 'document.getElementById('reservedtable').value =' " . $row['tableid'] . " '>" .$row['tableid']. "</div>";

hij geeft geen error maar hij werkt ook niet.

mvg,

ben
Willem vp
17-04-2013 00:35
dit gaat ook niet werken. zover ik er verstand van heb is omdat $row['tableid'] meerdere variables heeft. dit kan je volgens mij niet zomaar naar 1 variable worden geplaatst.

Het klopt niet helemaal wat je zegt. Je komt namelijk zo aan $row:

while($row = mysql_fetch_assoc($querytable))

Hier haal je dus steeds 1 rij op uit de database. Per keer dat je het blok while-code uitvoert heeft $row['tableid'] dus 1 waarde (die wel steeds zou moeten wijzigen).

Als ik naar je eerdere code kijk, vermoed ik dat je geen {} hebt gebruikt om het blok code dat bij je while hoort af te bakenen. PHP neemt dan alleen het eerste statement na de while (de $tableid=$row['tableid']), voert dat 16 keer uit en voert daarna nog eens de echo uit; je krijgt dan alleen de laatst opgehaalde tafel te zien.
De code zou dus moeten worden:
<?php
$querytable = mysql_query("SELECT blablabla");
while($row = mysql_fetch_assoc($querytable))
{
   $tableid = $row['tableid'];
   echo <<<EOT
<div id="table$tableid" onclick="document.getElementById('reservedtable').value = '$tableid';">
   $tableid
</div>
EOT;
}
?>

De echo die jij daarna postte is in principe gelijkwaardig aan de echo hierboven, alleen moet je een beetje klieren met de quotes om het werkend te krijgen. Als ik kijk naar het onclick-gedeelte:

onclick = 'document.getElementById('reservedtable').value =' " . $row['tableid'] . " '>"

dan zet je de onclick-code tussen enkele quotes, maar binnen de code gebruik je ook enkele quotes en PHP weet dan niet wat bij wat hoort. Je moet dus gaan escapen. Dat kan op twee manieren:

onclick = 'document.getElementById(\'reservedtable\').value =' " . $row['tableid'] . " '>"
onclick = \"document.getElementById('reservedtable').value =' " . $row['tableid'] . " \">"

Let op de backslashes die ik heb toegevoegd. Die geven aan dat de betreffende quote geen afsluiter van een string is, maar juist tot de string behoort. Overigens kun je beter de tweede manier gebruiken, omdat bij de eerste manier je hetzelfde probleem gaat krijgen in de gegenereerde HTML. Dat is precies de reden dat ik zo gek ben op de heredoc-notatie; je hoeft niet meer te prutsen met je quotes.
b
ben lubben
17-04-2013 11:12
Willem vp op 17/04/2013 00:35:10

Als ik naar je eerdere code kijk, vermoed ik dat je geen {} hebt gebruikt om het blok code dat bij je while hoort af te bakenen. PHP neemt dan alleen het eerste statement na de while (de $tableid=$row['tableid']), voert dat 16 keer uit en voert daarna nog eens de echo uit; je krijgt dan alleen de laatst opgehaalde tafel te zien.
De code zou dus moeten worden:
<?php
$querytable = mysql_query("SELECT blablabla");
while($row = mysql_fetch_assoc($querytable))
{
   $tableid = $row['tableid'];
   echo <<<EOT
<div id="table$tableid" onclick="document.getElementById('reservedtable').value = '$tableid';">
   $tableid
</div>
EOT;
}
?>

De echo die jij daarna postte is in principe gelijkwaardig aan de echo hierboven, alleen moet je een beetje klieren met de quotes om het werkend te krijgen. Als ik kijk naar het onclick-gedeelte:


ik heb deze code gecopierd en het werkte.
ik moet dus blijkbaar echt nog veel leren. iedereen super bedankt.

ik moet nu nog even me query aanpassen zodat ik alleen de lege tafels krijg en niet alleen de gereserveerden en moet ik nog uitzoeken dat de geselecteerde tafel een ander kleurtje krijgt, dit probeer ik zelf uit te zoeken (denk met jquery ofzo).

iedereen bedankt voor het helpen.

mvg,

ben

Reageren

Inloggen om te reageren