"quickorder" pagina maken.
Ik wil graag een snelbestel pagina maken.
Hiermee bedoel ik dat je een pagina hebt met meerdere velden, in elk veld kan je een serienummer invoeren, als je deze hebt ingevoerd verschijnt automatisch de naam en de prijs van het product (vanuit de database) en kan je deze in een winkelwagentje plaatsen.
Alleen het probleem is dat ik geen idee heb hoe ik dat moet gaan aanpakken.
Ik ben al vanaf maandag bezig met het zoeken van een goed voorbeeld, maar ik heb er nog geen een kunnen vinden.
Heeft iemand tips hoe ik dit moet gaan aanpakken?
Bedankt alvast!
Gewijzigd op 20/04/2011 12:24:26 door Bouke Seel
Je haalt met een simpele select query de prijs op. Indien de query geen resultaat geeft, dan bestaat het product niet. Zowel, dan heb je de prijs. Via een simpel stukje javascript zorg je dat dat live wordt weergegeven.
Verder zet je al die serienummers in een formulier. Als de bezoeker het post, verwerk je die zaken.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
$select = "SELECT sn, prijs, gerecht FROM tbl_gerechten WHERE sn = '".mysql_real_escape_string($_POST['sn'])."'";
$query = mysql_query($select);
$rows = mysql_num_rows($query);
If($rows == 0) {
echo 'geen resultaten';
} else {
$fetch = mysql_fetch_assoc($query);
echo 'uw gerecht'.$fetch['gerecht'];
echo 'prijs : '.$fetch['prijs'];
}
?>
$select = "SELECT sn, prijs, gerecht FROM tbl_gerechten WHERE sn = '".mysql_real_escape_string($_POST['sn'])."'";
$query = mysql_query($select);
$rows = mysql_num_rows($query);
If($rows == 0) {
echo 'geen resultaten';
} else {
$fetch = mysql_fetch_assoc($query);
echo 'uw gerecht'.$fetch['gerecht'];
echo 'prijs : '.$fetch['prijs'];
}
?>
Het begin is er eindelijk ga nu kijken hoe en wat met het javascript.
Ik zal het resultaat posten als het lukt.
EDIT:
Write Down op 20/04/2011 12:56:43:
Via een simpel stukje javascript zorg je dat dat live wordt weergegeven.
Vind het javascript toch lastig eerste keer dat ik het gebruik.
Gewijzigd op 21/04/2011 14:32:51 door Bouke Seel
Gewijzigd op 22/04/2011 09:37:08 door Bouke Seel
Gebruik jQuery en zoek dan op 'ajax'.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
<form id="snel_bestellen" name="snel_bestellen" method="POST" action="">
<table class="snel_bestellen" width="100%">
<thead>
<tr class="info_header">
<th class="artikelnummer" width="156px">Artikelnummer</th>
<th class="aantal" width="64px;">Aantal</th>
<th class="naam">Productnaam</th>
<th class="stuk">Prijs per stuk</th>
<th class="totaal">Totaal prijs</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[1]"></td>
<td><input type="text" class="aantal" name="aantal[1]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[2]"></td>
<td><input type="text" class="aantal" name="aantal[2]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[3]"></td>
<td><input type="text" class="aantal" name="aantal[3]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
</tbody>
</table>
<input type="submit" class="winkelwagentje" name="winkelwagentje" value="">
</form>
</div>
</div>
?>
<form id="snel_bestellen" name="snel_bestellen" method="POST" action="">
<table class="snel_bestellen" width="100%">
<thead>
<tr class="info_header">
<th class="artikelnummer" width="156px">Artikelnummer</th>
<th class="aantal" width="64px;">Aantal</th>
<th class="naam">Productnaam</th>
<th class="stuk">Prijs per stuk</th>
<th class="totaal">Totaal prijs</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[1]"></td>
<td><input type="text" class="aantal" name="aantal[1]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[2]"></td>
<td><input type="text" class="aantal" name="aantal[2]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
<tr>
<td><input type="text" onChange="showProduct(this.value)" class="Artikelnummer" name="Artikelnummer[3]"></td>
<td><input type="text" class="aantal" name="aantal[3]"></td>
<td class="productnaam" id="txtHint"></td>
<td class="prijs" id="txtHint"></td>
<td class="totaal"> 0,00</td>
</tr>
</tbody>
</table>
<input type="submit" class="winkelwagentje" name="winkelwagentje" value="">
</form>
</div>
</div>
?>
Javascript
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<?php
<script type="text/javascript">
function showProduct(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getproduct.php?q="+str,true);
xmlhttp.send();
}
</script>
?>
<script type="text/javascript">
function showProduct(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getproduct.php?q="+str,true);
xmlhttp.send();
}
</script>
?>
Php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?php
$q=$_GET["q"];
include '';
$sql="SELECT Artikelnummer, Naam, Prijs FROM Producten WHERE Artikelnummer = '".$q."'" ;
$result = mysql_query($sql)or die(mysql_error());
$rows = mysql_num_rows($result);
If($rows == 0) {
echo "<td class='productnaam'>";
echo "Nummer niet gevonden";
echo "</td>";
echo "<td class='prijs'>";
echo "";
echo "</td>";
}
else
{
$fetch = mysql_fetch_assoc($result);
echo "<td class='productnaam'>";
echo $fetch['Naam'];
echo "</td>";
echo "<td class='Prijs'>";
echo "€ ";
echo $fetch['Prijs'];
echo "</td>";
}
?>
$q=$_GET["q"];
include '';
$sql="SELECT Artikelnummer, Naam, Prijs FROM Producten WHERE Artikelnummer = '".$q."'" ;
$result = mysql_query($sql)or die(mysql_error());
$rows = mysql_num_rows($result);
If($rows == 0) {
echo "<td class='productnaam'>";
echo "Nummer niet gevonden";
echo "</td>";
echo "<td class='prijs'>";
echo "";
echo "</td>";
}
else
{
$fetch = mysql_fetch_assoc($result);
echo "<td class='productnaam'>";
echo $fetch['Naam'];
echo "</td>";
echo "<td class='Prijs'>";
echo "€ ";
echo $fetch['Prijs'];
echo "</td>";
}
?>
Gewijzigd op 26/04/2011 11:47:28 door Bouke Seel