Forum Moderators: coopster
Im building a shopping cart, well, its just to telly the price and items selected via a checkbox.
how ever, the items come from mysql while loop.
>I want to get the db row information<, how can i pass this via the checkbox.. or am i dreaming and need some sort of cookie, then spit it out into a 'cart' to display select item that will be emailed..
some code:
js:
function additem()
{
Cost = 0;
if (document.order.Item.checked) {
Cost = Cost $price };
--dont know how to get $price $choice here as they arnt input types.
-- should i use something else?
What im doing, is listing the db items in while loop. as you can see i id the row based on pk $id=$row['id'] to value the rows in the while loop.
when the use clicks confirm selection, the next screen displays these selections and price total, (then fill in the contact form (ive completed that!) and it gets sent.)
----------
php:
echo "<form method=\"post\" name=\"order\" action=\"\">";
echo "<table width=100% align=center>";
while ( $row = mysql_fetch_array($result) )
{
$id=$row['id'];
$price=$row['tea_price'];
$choice=$row['tea_choice'];
echo "<tr>";
echo "<input type=\"hidden\" name=\"_id_$id\" value=\"$id\">";
echo "<tr><td width= 20% align=center><font size=\"3\" color=\"Grey \"><strong>".$choice."</strong></font></td></tr>".
"<tr><td width = 70% align=center><font size=\"3\">".$row[tea_desc]."</td></tr>"."<tr>"."<td align=center>\\$ ".$price.
" </font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem()\"/></td></tr>";
}//while
echo "<tr>";
echo "<td> Total <input type=\"text\" name=\"Total\" value=\"$0\" size=\"7\"></td>";
echo "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"$0\" size=\"6\"></td>";
echo "</tr>";
echo "<tr>";
echo "<td> Grand Total <input type=\"text\" name=\"GrandTotal\" value=\"$0\" size=\"8\"></td>";
echo "</tr>";
echo "</tr>";
echo "</table></form>";
-----------------
Oh, thanks for eveyones help..
1.) Move the php loop to before the html of the document.
2.) Edit the JS function to pass the ID.
(See Below)
3.) Do something like this:
<?php
$js="function additem(id)";
$js.="{";
$js.="Cost = 0;";
$form="<form method=\"post\" name=\"order\" action=\"\">";
$form.="<table width=100% align=center>";
while ( $row = mysql_fetch_array($result) )
{
$id=$row['id'];
$price=$row['tea_price'];
$choice=$row['tea_choice'];
$form.= "<tr>";
$form.= "<input type=\"hidden\" name=\"_id_$id\" value=\"$id\">";
$form.= "<tr><td width= 20% align=center><font size=\"3\" color=\"Grey \"><strong>".$choice."</strong></font></td></tr>".
"<tr><td width = 70% align=center><font size=\"3\">".$row[tea_desc]."</td></tr>"."<tr>"."<td align=center>\\$ ".$price.
" </font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem($id)\"/></td></tr>";
}//while
$form.= "<tr>";
echo "<td> Total <input type=\"text\" name=\"Total\" value=\"$0\" size=\"7\"></td>";
$form.= "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"$0\" size=\"6\"></td>";
$form.= "</tr>";
$form.= "<tr>";
$form.= "<td> Grand Total <input type=\"text\" name=\"GrandTotal\" value=\"$0\" size=\"8\"></td>";
$form.= "</tr>";
$form.= "</tr>";
$form.= "</table></form>";
$js.="if (document.order.Item_id.checked) {";
$js.="Cost = Cost $price";
$js.="}";
} // End PHP While
$js.="}";
?>
<!DOCTYPE HTML
<html><head>
In the head of the document echo the js:
<?= $js; ?>
In the body of the document echo the form:
<?= $form; ?>
/* It should get you close anyway... I didn't look at the code too closely, so maybe someone else will come along with some suggestions there. */
ADDED: Figured I'd give you a bit more since I'm still posting. Concatenation is faster than parsing variables with a string... IWO name=\"_id_".$id."\" is faster to process than: name=\"_id_$id\"
[webmasterworld.com...]
<?php
$js="function additem(id)";
$js.="{";
$js.="Cost = 0;";
$form="<form method=\"post\" name=\"order\" action=\"\">";
$form.="<table width=100% align=center>";
while ( $row = mysql_fetch_array($result) )
{
$id=$row['id'];
$price=$row['tea_price'];
$choice=$row['tea_choice'];
$form.= "<tr>";
$form.= "<input type=\"hidden\" name=\"_id_$id\" value=\"$id\">";
$form.= "<tr><td width= 20% align=center><font size=\"3\" color=\"Grey \"><strong>".$choice."</strong></font></td></tr>".
"<tr><td width = 70% align=center><font size=\"3\">".$row[tea_desc]."</td></tr>"."<tr>"."<td align=center>\\$ ".$price.
" </font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem($id)\"/></td></tr>";
$js.="if (document.order.Item_id.checked) {";
$js.="Cost = Cost $price";
$js.="}";
} //while
$form.= "<tr>";
echo "<td> Total <input type=\"text\" name=\"Total\" value=\"$0\" size=\"7\"></td>";
$form.= "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"$0\" size=\"6\"></td>";
$form.= "</tr>";
$form.= "<tr>";
$form.= "<td> Grand Total <input type=\"text\" name=\"GrandTotal\" value=\"$0\" size=\"8\"></td>";
$form.= "</tr>";
$form.= "</tr>";
$form.= "</table></form>";
$js.="}";
?>
<!DOCTYPE HTML
<html><head>
In the head of the document echo the js:
<?= $js; ?>
</head>
<body>
In the body of the document echo the form:
<?= $form; ?>
thanks for your time, especially when you were tired. thankyou very much.
So, I usually have something like this:
<?php
// Process looped stuff here.
$js="blah";
$form="blah";
// Assemble 'standard' or 'once through' variables here
$doc="Doc Type";
$doc.="<html><head>";
$head="<title>blah</title>";
$head.="other head information";
$head.=$js;
$head.="</head>";
$html1="blah";
$html2="blah";
// Put it all together here
$output = $doc.$head."<body>".$html1.$form.$html2."</body></html>";
// Set headers here
header();
// Show it to the visitor
echo $output;
?>
Hope this gives you some more ideas.
NOTE: I use double quotes, because I use \n so I have line breaks in the output, even though they take a (tiny) bit more to process / send, because I usually have to be able to read my HTML source code. For 'ultimate speed' where you don't need the \n to be expanded, I think (if I remember right) accumulated / concatenated single quotes is a bit faster and takes a bit less memory, because you do not expand anything and can replace \" with " in the PHP code, so you pick up some minor gains.
additem is not defined
additem(Item_2);
-----------------------------
ref:
</font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem(item_$id)\"/></td></tr>";
js ref:
$js.="function additem(Item_$id)";
do you know why this error?
<?php
$js="var Cost, GST, Grand_Total;";
$js.="function additem(Item_$id)";
$js.="{";
$js.="Cost = 0;";
// if(isset($_POST['fTauranga'])) // if location button executed
// { // if(isset($_POST['fTauranga'])) loop starts
$form= "<br />";
$form= "<div align=center><font size =\"5\">Tauranga</font></div>";
$form= "<div align=center><font size=\"5\">Catering you can order</font></div>";
// this is the code for querying the platters table
// query the database
$result = mysql_query("select * from cp_tteas");
if (!$result) //error check
{
$form="<P>Error performing query: ".mysql_error();
exit();
}//if
// display table headings of the database field.
$form.= "<br />";
$form.= "<br />";
$form.= "<div align=center>";
$form.= "<hr width=\"65%\" />";
$form.= "<hr width=\"85%\" />";
$form.= "<br /><div align=center><font size=\"5\">Morning / Afternoon Tea</font></div>";
$form.="<form method=\"post\" name=\"order\" action=\"\">";
$form.="<table width=100% align=center>";
while ( $row = mysql_fetch_array($result) )
{
$id=$row['id'];
$price=$row['tea_price'];
$choice=$row['tea_choice'];
$form.= "<tr>";
$form.= "<input type=\"hidden\" name=\"_id_$id\" value=\"$id\">";
$form.= "<tr><td width= 20% align=center><font size=\"3\" color=\"Grey \"><strong>".$choice."</strong></font></td></tr>".
"<tr><td width = 70% align=center><font size=\"3\">".$row[tea_desc]."</td></tr>"."<tr>"."<td align=center>\\$ ".$price.
" </font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem(Item_$id)\"/></td></tr>";
$js.="GST = (Cost * 0.07);";
$js.="Cost = dollar(Cost);";
$js.="GST = dollar(GST);";
$js.="Grand_Total = parseFloat(Cost) + parseFloat(GST);";
$js.="Grand_Total = dollar(Grand_Total);";
$js.="document.order.Total.value = '$' + Cost;";
$js.="document.order.GST.value = '$' + GST;";
$js.="document.order.GrandTotal.value = '$' + Grand_Total;";
$js.="}";
$js.="function dollar (amount)";
$js.="{";
$js.="amount = parseInt(amount * 100);";
$js.="amount = parseFloat(amount/100);";
$js.="if (((amount) == Math.floor(amount)) && ((amount - Math.floor (amount)) == 0))";
$js.="{";
$js.="amount = amount + '.00';";
$js.="return amount;";
$js.="}";
$js.="if ( ((amount * 10) - Math.floor(amount * 10)) == 0)";
$js.="{";
$js.="amount = amount + '0';";
$js.="return amount;";
$js.="}";
$js.="if ( ((amount * 100) - Math.floor(amount * 100)) == 0)";
$js.="{";
$js.="amount = amount;";
$js.="return amount;";
$js.="}";
$js.="return amount;";
}//while
$form.= "</tr>";
$form.= "</table></form>";
$form.= "<br /><hr width=\"85%\" />";
$form.= "<hr width=\"65%\" />";
$form.= "<tr>";
$form.= "<td> Total <input type=\"text\" name=\"Total\" value=\"$0\" size=\"7\"></td>";
$form.= "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"$0\" size=\"6\"></td>";
$form.= "</tr>";
$form.= "<tr>";
$form.= "<td> Grand Total <input type=\"text\" name=\"GrandTotal\" value=\"$0\" size=\"8\"></td>";
$form.= "</tr>";
$form.= "</tr>";
$form.= "</table></form>";
$js.="}";
?>
<!DOCTYPE HTML
<html><head>
In the head of the document echo the js:
<?= $js; ?>
<body>
<?= $form; ?>
[edited by: eelixduppy at 3:53 pm (utc) on Sep. 29, 2009]
The preceding line is outside your PHP While loop... You will need to pass the id to JavaScript using JavaScript. Currently, you are trying to pass Item_$id to the function as function additem(Item_TheFirstId), which breaks everything, because 1.) It should be passed as a string additem('Item_$id') and should be received by the function as Item_id using the code below.
$js.="function additem(Item_id)"; // At the top
$form.= "<tr><td width= 20% align=center><font size=\"3\" color=\"Grey \"><strong>".$choice."</strong></font></td></tr>".
"<tr><td width = 70% align=center><font size=\"3\">".$row[tea_desc]."</td></tr>"."<tr>"."<td align=center>\\$ ".$price.
" </font><input type=\"checkbox\" name=\"Item_$id\" value=\"checkbox_$id\" onclick=\"additem('Item_".$id."')\"/></td></tr>";
// Added Single Quotes and Concatenation to Preceding Bold JS Function
// Set an If within the JS function for each Item_id:
$js.="if (Item_id==\"Item_".$id."\") {";
$js.="GST = (Cost * 0.07);";
$js.="Cost = dollar(Cost);";
$js.="GST = dollar(GST);";
$js.="Grand_Total = parseFloat(Cost) + parseFloat(GST);";
$js.="Grand_Total = dollar(Grand_Total);";
$js.="document.order.Total.value = '$' + Cost;";
$js.="document.order.GST.value = '$' + GST;";
$js.="document.order.GrandTotal.value = '$' + Grand_Total;";
$js.="}";
$js.="function dollar (amount)";
$js.="{";
$js.="amount = parseInt(amount * 100);";
$js.="amount = parseFloat(amount/100);";
$js.="if (((amount) == Math.floor(amount)) && ((amount - Math.floor (amount)) == 0))";
$js.="{";
$js.="amount = amount + '.00';";
$js.="return amount;";
$js.="}";
$js.="if ( ((amount * 10) - Math.floor(amount * 10)) == 0)";
$js.="{";
$js.="amount = amount + '0';";
$js.="return amount;";
$js.="}";
$js.="if ( ((amount * 100) - Math.floor(amount * 100)) == 0)";
$js.="{";
$js.="amount = amount;";
$js.="return amount;";
$js.="}";
$js.="return amount;";
$js.="}";
// Should get you closer.
EDITED For Clarification: I miss-communicated the error, even though the solution was correct.
[edited by: jd01 at 7:44 am (utc) on Sep. 29, 2009]
if($id==1) {
$js.="if (Item_id==\"Item_".$id."\") {";
}
else {
$js.="else if (Item_id==\"Item_".$id."\") {";
}
/* Assuming your item ID's start with 1, the preceding will give you an if, followed by else if statements in the JS.
If they do not start with one, you can use a PHP counter to achieve the same result: */
$cnt=0;
while ( $row = mysql_fetch_array($result) )
if($cnt===0) {
$js.="if (Item_id==\"Item_".$id."\") {";
$cnt++;
}
/* $cnt=1; will work instead of $cnt++; too. IOW: You can make $cnt='Anything Except 0'; on the second and subsequent passes, so you always hit the else after the first iteration. */
else {
$js.="else if (Item_id==\"Item_".$id."\") {";
}
additem is not defined
additem(Item_2);
I looked at the script according to what firebut sees.. i think the problem is that its not seeing or accessing the header.. cant see any of the js= coding.
Since im using Joomla (crap) the actual head is deeper outside the article or any custom php / html.
you can import with:
$document = &JFactory::getDocument();
$document->addScript( '/media/system/js/cart.js' );
however, no point as it doesnt recognise the php with in the js! stupid project! ps, must use the cms. And the joomla cart plugins are useless, as this app im making has no need to store customer info, or to bill them. Thats done in person. This just used to order, pay later.
Owner edit:
*/ ive forgotten a line: $js.="if (document.order.Item_$id.checked) {";
as below
$js.="if (Item_id==\"Item_".$id."\") {";
$js.="if (document.order.Item_$id.checked) {";
$js.="Cost = Cost + $price";
$js.="}";
$js.="Cost = dollar(Cost);";
$js.="Total = parseFloat(Cost);";
$js.="Total = dollar(Total);";
no difference, i think its joomla! /*
1.) Copy all you DataBase connections, while loops and everything else you need to build the js in PHP to an different file. (Remove all the html and form creation from it, so you only have the $js variables.)
2.) Remove all the $js variables from the main php page after they are copied, so you don't have redundancy.
3.) Save your new file as yourjsfile.php (or whatever you would like to call it, but make it .php)
4.) Import it with this as yourjsfile.js (or whatever you called it, but make it .js NOT .php, even though .js does not really exist.)
$document = &JFactory::getDocument();
$document->addScript( '/media/system/js/cart.js' );
5.) In your .htaccess file put the following at the top:
# If it's not already there
RewriteEngine on
# Set Mod_Rewrite to serve the information from
# yourjsfile.php when yourjsfile.js is requested
RewriteRule ^(the/path/to/your/jsfile/yourjsfile)\.js$ /$1.php [L]
# The path above should be exactly
# the same as the path you use in addScript()
# so using what's there now it would look like:
# RewriteRule ^(media/system/js/cart)\.js$ /$1.php [L]
# No quotes. Leave the () where they are,
# because in Mod_Rewrite the create a
# back-reference $1 (variable), which is
# referenced on the right side of the
# rule, after the /, before .php
# basically $1 says 'everything between here =>( and =>)'
# A . (dot) in Mod_Rewrite says 'anything
# except the end of a line', so to match
# only a . (dot) you should escape it with a \
# Do Not include the preceding / on the left side
# of the rule (path) in Mod_Rewrite...
# media/system/js/cart is correct
# /media/system/js/cart is incorrect
# End of Mod_Rewrite
This way your external JavaScript file will be parsed as PHP, so you can write the whole thing exactly the same as you would on your PHP page... It add some redundancy, because you have to connect and get the information from the database twice, but sometimes when you need a work around to work, you have to add a bit.
Owner edit:
*/ ive forgotten a line: $js.="if (document.order.Item_$id.checked) {";as below
$js.="if (Item_id==\"Item_".$id."\") {";
$js.="if (document.order.Item_$id.checked) {";
$js.="Cost = Cost + $price";
$js.="}";
$js.="Cost = dollar(Cost);";
$js.="Total = parseFloat(Cost);";
$js.="Total = dollar(Total);";
Unless I'm missing something you can eliminate the first if then... There's no need I can see for it.
$js.="if (Item_id==\"Item_".$id."\") {"; // remove this one.
<added>
Just a thought to keep in mind...
You're going to need to set a 'reverse' somewhere, so when someone 'checks' an item, then 'unchecks' the item later the pricing set is reversed. ;)
</added>
// edit the function
function additem(Item_id,BeenSelected)
// edit the onClick
additem('Item_".$id."',0)
if (Item_id=="Item_id") {
/* If the 'Item' is checked and BeenSelected is 0 we know it has not yet been selected, so add the price */
if (document.order.Item_id.checked==true && BeenSelected==0) {
/* Reset the function additem to pass a 1 'onClick' :: Do Not capitalize the C in onClick below! (It get's ugly if you do.) */
document.getElementById(Item_id).onclick = function() { additem(Item_id,1); }
} // end if
else if (document.order.Item_id.checked==false && BeenSelected==1) {
/* If the 'Item' is not checked and BeenSelected is 1 we know the Item_id has been selected, so we need to subtract it */
// Subtract Values Here
/* Reset the function additem to pass a 0 again 'onClick' */
document.getElementById(Item_id).onclick = function() { additem(Item_id,0); }
} // end else if
<added>
I think my final answer is:
Use the if I said to remove, add the else if checked==false and subtract the amount and forget about the second variable... I'm going to leave my first set of code, because it's got some things that are good to know how to do in it, but it's really unnecessary to have the second variable or reset the function.
Here's the new, new version:
// Don't edit the function
// Don't edit the onClick
if (Item_id=="Item_id") {
/* If the 'Item' is checked add the price */
if (document.order.Item_id.checked==true) {
/* Add values here */
} // End if
/* If the 'Item' is unchecked we need to subtract it */
else if (document.order.Item_id.checked==false) {
/* Subtract values here */
} // end else if
/* I should have mentioned JS is not my specialty before I hopped in here... JS and I don't always get along. (LOL) Mod_Rewrite is more 'me'. */
</added>
i checked if the veriable is reaching the top where the js add was, and its not. i used print_r(".$id.");or something like that.. (tired now lol) and that was empty, it printed the values in the while loop when i added it to the while funciton, but nothing in the js. So thats the problem. the vbariables not being sent.
dont stress about this.. im not going too. ill think tomorrow
You could use:
while ( $row = mysql_fetch_array($result) )
{
print_r($row);
echo "<br /><br />";
}
To see what you are getting from the database.
If you don't want to move the script to an external source, you could always just wrap it in <script></script> tags and echo it right before the form in the html itself rather than in the <head></head> of the document...
<?= $js.$form ?>
You are wrapping it in script tags, right?
<script type="text/javascript">
<?php echo $js; ?>
</script>
i know whats happening now.. i did some more debugging... lol
the only thing thats actually being passed to the js is this : 'Item_".$id."' not $price
im just working on it now and see if i can fix this. Maybe somehow a get statment to get row info based on the 'Item_".$id."'.. thx again.
additem('Item_".$id."',$price)
Would keep you from having to connect to the DB again... You can actually pass multiple variables into the .js, just remember if it's a number you need to use as a number you should not quote it, but if it contains letters, etc. it should be quoted (passed as a string).
I just noticed this too:
$form.= "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"$0\" size=\"6\"></td>";
This is correct:
$form.= "<td colspan=\"2\"> GST (7%) <input type=\"text\" name=\"GST\" value=\"\$0\" size=\"6\"></td>";
# If you don't escape the $ when you are using "" php will try to expand it as a variable.
thanks for your patience with me.. its a long road im on lol
PS. one thing i changed is this:
before:
</font><input type=\"checkbox\" name=\"checkbox\" value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>
after:
<input type=\"checkbox\" name='Item_id' value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>
note 'name='
thanks for your patience with me.. its a long road im on lol
Not a problem... They're always a little bit more work than they seem like from the front end, because when you do it right and it's fast / effective, it looks like it should be easy. You know, when someone deselects an item you just subtract the price... Simple, right? LOL.
PS. one thing i changed is this:
before:
</font><input type=\"checkbox\" name=\"checkbox\" value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>after:
<input type=\"checkbox\" name='Item_id' value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>note 'name='
I think you're after:
<input type=\"checkbox\" name='Item_".$id."' value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>
Since it's in a loop and you probably don't want them to all have the same name... You might even think about switching to:
<input type=\"checkbox\" name='".$row['tea_choice']."' value='Item_".$id."' onclick=\"additem('Item_".$id."',$price) \"/>
as you get farther into it...
if (document.order.Item_$id.checked) { <-- wrong /prevented function working.
if (Item_id.checked==true) { <-- correct.
thanks again :) having a rest now, major breakthrough for me lol, with out your help, and the other persons, i wouldnt have done it. ~~ THANK YOU ~~
