Develop Reference

Javascript Discount Help Needed

I have this Javascript function that the discount applies to either FlavorBlue or FlavorRed. I tried to add the quantities together, but it did not work as expected. The goal was to have a 50% for quantity 2 flavors either blue or red. I have searched this site for help until blue and red in the face... Any insight would be extremely valued. Thanks in advance.
.js file:
function ordertotals()
{
var FlavorBluetotal = (order.selectFlavorBlueQuantity.value *
FlavorBlueprice.value);
document.getElementById('FlavorBluetotal').innerHTML = FlavorBluetotal;
order.FlavorBluetotalvalue.value = FlavorBluetotal;
var FlavorRedtotal = (order.selectFlavorRedQuantity.value *
FlavorRedprice.value);
document.getElementById('FlavorRedtotal').innerHTML = FlavorRedtotal;
order.FlavorRedtotalvalue.value = FlavorRedtotal;
var FlavorBluecasetotal = (order.selectFlavorBlueCaseQuantity.value *
FlavorBluecaseprice.value);
document.getElementById('FlavorBluecasetotal').innerHTML =
FlavorBluecasetotal;
order.FlavorBluecasetotalvalue.value = FlavorBluecasetotal;
// var total = FlavorBluetotal + FlavorRedtotal + FlavorBluecasetotal;
// document.getElementById('ordertotal').innerHTML = total;
// order.ordertotalvalue.value = total;
var totala = 0;
var totalb = 0;
var totalc = 0;
var quantity = (order.selectFlavorBlueQuantity.value +
order.selectFlavorRedQuantity.value);
// document.getElementById("insert").innerHTML = quantity;
if (order.selectFlavorBlueQuantity.value > 1) {
quantitya = (order.selectFlavorBlueQuantity.value);
var price = 29;
if (quantitya % 2 == 0) {
//calculate here buy one get one half price
real = ((quantitya/2)*price);
half = ((quantitya/2)*(price/2));
totala = (real+half);
} else {
quantitya = (quantitya-1);
real = ((quantitya/2)*price);
half = ((quantitya/2)*price/2);
totala = (real+half+price);
}
} else {
if (order.selectFlavorRedQuantity.value > 1) {
quantityc = (order.selectFlavorRedQuantity.value);
var price = 29;
if (quantityc % 2 == 0) {
//calculate here buy one get one half price
real = ((quantityc/2)*price);
half = ((quantityc/2)*(price/2));
totalc = (real+half);
} else {
quantityc = (quantityc-1);
real = ((quantityc/2)*price);
half = ((quantityc/2)*price/2);
totalc = (real+half+price);
}
}
}
if (order.selectFlavorBlueQuantity.value == 1 &&
order.selectFlavorRedQuantity.value == 1) {
var quantityb = 2;
var price = 29;
if (quantityb % 2 == 0) {
//calculate here buy one get one half price
real = ((quantityb/2)*price);
half = ((quantityb/2)*(price/2));
totalb = (real+half);
} else {
quantityb = (quantityb-1);
real = ((quantityb/2)*price);
half = ((quantityb/2)*price/2);
totalb = (real+half+price);
}
}
// if (order.selectFlavorBlueQuantity.value == 1 ||
order.selectFlavorRedQuantity.value == 1) {
// var quantityd = 1;
// var price = 29;
// totald = (quantityd * price);
// } else {
// }
// total = (totala + totalb + totalc + totald + FlavorBluecasetotal);
total = (totala + totalb + totalc + FlavorBluecasetotal);
document.getElementById('ordertotal').innerHTML = total;
order.ordertotalvalue.value = total;
}
php file:
//Inventory
echo "<tr><td colspan='2'><u>Select Inventory:</u></td></tr>";
//Quantity Flavor Blue
echo "<tr><td>Quantity of Flavor Blue:</td><td>";
echo "<label>$</label><input type='text' id='FlavorBlueprice'
name='FlavorBlueprice' maxlength='4' value='$FlavorBlueprice'
style='width:20px;'> <label>X</label> ";
echo "<input type='text' id='selectFlavorBlueQuantity'
name='selectFlavorBlueQuantity' maxlength='4'
value='$selectFlavorBlueQuantity' onchange='ordertotals();'
style='width:20px;'>";
echo "</select><label id='asterisk'> *</label>";
echo " <label>=</label> <label>$</label><label
id='FlavorBluetotal'></label>";
echo "</td></tr>";
//Quantity Flavor Red
echo "<tr><td>Quantity of Flavor Red:</td><td>";
echo "<label>$</label><input type='text' id='FlavorRedprice'
name='FlavorRedprice' maxlength='10' value='$FlavorRedprice'
style='width:20px;'> <label>X</label> ";
echo "<input type='text' id='selectFlavorRedQuantity'
name='selectFlavorRedQuantity' maxlength='4'
value='$selectFlavorRedQuantity' onchange='ordertotals();'
style='width:20px;'>";
echo "</select><label id='asterisk'> *</label>";
echo " <label>=</label> <label>$</label><label
id='FlavorRedtotal'></label>";
echo "</td></tr>";
//Quantity Flavor Blue
echo "<tr><td>Quantity of Flavor Blue Case:</td><td>";
echo "<label>$</label><input type='text' id='FlavorBluecaseprice'
name='FlavorBluecaseprice' maxlength='10' value='$FlavorBluecaseprice'
style='width:20px;'> <label>X</label> ";
echo "<input type='text' id='selectFlavorBlueCaseQuantity'
name='selectFlavorBlueCaseQuantity' maxlength='4'
value='$selectFlavorBlueCaseQuantity' onchange='ordertotals();'
style='width:20px;'>";
echo "</select><label id='asterisk'> *</label>";
echo " <label>=</label> <label>$</label><label
id='FlavorBluecasetotal'></label>";
echo "</td></tr>";
//Total
echo "<tr><td>Total:</td><td><label>$</label><label id='ordertotal'></td>
</tr>";
echo "<tr><td colspan='2'><hr></td></tr>";

I was just mistakenly had if else nested inside another. simple fix.

Getting an image source from JSON data

I'm attempting to call a PHP file and have it return a result (a single record's 'pageLocation') from a database table ('page'). I then want to get that result into a variable, so I can use it while creating an image in html.
Currently, the image is being created but the source is not feeding into it, leaving a default empty image at the correct size.
Javascript:
// Loads a list of comics created by the user from the database.
function loadComic()
{
var xmlhttp = new XMLHttpRequest();
var getID = '<?php echo $_SESSION["userID"]; ?>';
var url = "loadCom.php?userID="+getID;
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
loadComicJSON(xmlhttp.responseText);
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
// JSON parsing for 'loadComic'.
function loadComicJSON(response)
{
var arr = JSON.parse(response);
var i;
var out = "";
document.getElementById("loadList").innerHTML="";
if (arr.length == 0)
{
//Non-relevant code affecting layout if no comics are found.
}
else
{
out+="<br>";
for(i = 0; i < arr.length; i++)
{
// Gets image source from database.
imgSrc = "";
tempID = arr[i].comicID;
$.post("getCover.php", {'comicID':tempID}, function(result)
{
imgSrc += ("" + result);
}
);
// Creates image item and associated radio button.
out += "<hr><br><img name = '" + ('com' + arr[i].comicID) + "' id='" + ('com' + arr[i].comicID) + "' onclick='resizeThumb(this)' height='100px;' src='" + imgSrc + "'><input name='comicList' type='radio' id='" + arr[i].comicID + "' value='" + arr[i].comicID + "'>" + arr[i].comicName + " </option><br><br>";
}
}
}
</script>
PHP (getCover.php):
<?php
if (isset($_POST["comicID"]))
{
include_once('includes/conn.inc.php');
$checkID = $_POST["comicID"];
$query = ("SELECT FIRST (pageLocation) FROM page WHERE comicID = '$checkID' ORDER BY pageNum");
$result = mysqli_query($conn, $query);
$conn->close();
echo ($result);
}
else
{
$checkID = null;
echo "Error. No comic found.";
}
?>
Thanks for any help provided.

You need to get he data from the result, like:
$row = $result->fetch_assoc()
Also, yes, Jim G is right, you need to escape that POST variable.

getting dynamically created XML values with AJAX in js file

I have created a dynamic xml file with php as follows
('Content-Type: text/xml');?>
<?php $newitem = $_GET["book"];
$action = $_GET["action"];
$qty=0;
$isbnVal="XYZ";
if ($_SESSION["Cart"] != ""){
$MDA = $_SESSION["Cart"];
if ($action == "Add"){
if ($MDA[$newitem] != ""){
$tempValue = $MDA[$newitem];
$value=$tempValue["qty"]+1;
$MDA[$newitem] =array("qty" => $value,"isbn" => $isbnVal);
}else{$MDA[$newitem] =array("qty" => 1,"isbn" => $isbnVal);}
}else{$MDA= "";}
}
else{$MDA[$newitem] =array("qty" => 1,"isbn" => $isbnVal);}
$_SESSION["Cart"] = $MDA;
ECHO (toXml($MDA));
function toXml($MDA){
$doc = new DomDocument('1.0');
$cart = $doc->createElement('cart');
$cart = $doc->appendChild($cart);
foreach ($MDA as $a => $b){
//echo "isbn".$b["isbn"];//echo "qty".$b["qty"]; $book = $doc->createElement('book');
$book = $cart->appendChild($book);
$title = $doc->createElement('title');
$title = $book->appendChild($title);
$value = $doc->createTextNode($a);
$value = $title->appendChild($value);
$quantity = $doc->createElement('quantity');
$quantity = $book->appendChild($quantity);
$value2 = $doc->createTextNode($b["qty"]);
$value2 = $quantity->appendChild($value2);
$isbn = $doc->createElement('isbn');
$isbn = $book->appendChild($isbn);
$value3 = $doc->createTextNode($b["isbn"]);
$value3 = $isbn->appendChild($value3);
}
$strXml = $doc->saveXML();
return $strXml;
}
then I'm calling these values in a javaScript file to display. I can get the first and last values from firstChild and lastChild. But I can't get whatever is in the middle. I tried it as follows.
spantag.innerHTML += " " +header[0].firstChild.textContent;
spantag.innerHTML += " " +header[0].getElementsByTagName('qty');
spantag.innerHTML += " " + header[0].lastChild.textContent + " <a href='#' onclick='AddRemoveItem(\"Remove\");'>Remove Item</a> ";
only the second code is not working. Plz tell me what I did wrong.Thanx in advance.

XML or text declaration not at start of entity error - PHP and Javascript

Hi I'm trying to get the xml data from php to javascript using DOM document and it keeps giving me : XML or text declaration not at start of entity error.(on firebug)
I tried saving it to a real xml file and it outputs a well formatted xml.
I guess the reason for this is white space on top of the xml file. I tried using ob_start(); and ob_end_flush(); but couldn't get that working
BTW I'm new to Ajax!
JS script
var xh = createRequest();
var xhrObject = false;
if (window.XMLHttpRequest)
{
xHRObject = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xHRObject = new ActiveXObject("Microsoft.XMLHTTP");
}
function getData()
{
if ((xh.readyState == 4) &&(xh.status == 200))
{
alert("hi");
var serverResponse = xh.responseXML;
var header = serverResponse.getElementsByTagName("good");
var spantag = document.getElementById("sp");
var x;
spantag.innerHTML = "";
x = "<table cellpadding='1' cellspacing='6' border='0'>";
x += "<tr><td>ID</td><td>price</td><td>quantity</td><td>Total</td><td>Remove</td></tr>";
for (i=0; i<header.length; i++)
{
var id = header[i].getElementsByTagName("ID")[0].childNodes[0].nodeValue;
var price = header[i].getElementsByTagName("price")[0].childNodes[0].nodeValue;
var qty = header[i].getElementsByTagName("quantity")[0].childNodes[0].nodeValue;
var total = header[i].getElementsByTagName("total")[0].childNodes[0].nodeValue;
if(qty=="0")
{
continue;
}
x += "<tr>"
+ "<td>" + id + "</td>"
+ "<td>" + price + "</td>"
+ "<td>" + qty + "</td>"
+ "<td>" + total + "</td>"
+ "<td>" + "<a href='#' onclick='AddRemoveItem(\"Remove\","+id+");'>Remove Item</a>" + "</td>"
+ "</tr>";
}
x += "</table>";
if (header.length != 0)
spantag.innerHTML = x;
}
}
PHP code
function toXml($shop_goods)
{
$doc = new DomDocument();
$goods = $doc->createElement('goods');
$goods = $doc->appendChild($goods);
foreach ($shop_goods as $Item => $ItemName)
{
$good = $doc->createElement('good');
$good = $goods->appendChild($good);
$title = $doc->createElement('ID');
$title = $good->appendChild($title);
$value = $doc->createTextNode($Item);
$value = $title->appendChild($value);
$price = $doc->createElement('price');
$price = $good->appendChild($price);
$value3 = $doc->createTextNode($ItemName["price"]);
$value3 = $price->appendChild($value3);
$quantity = $doc->createElement('quantity');
$quantity = $good->appendChild($quantity);
$value2 = $doc->createTextNode($ItemName["qty"]);
$value2 = $quantity->appendChild($value2);
$total = $doc->createElement('total');
$total = $good->appendChild($total);
$value3 = $doc->createTextNode($ItemName["total"]);
$value3 = $total->appendChild($value3);
}
$strXml = $doc->saveXML();
//echo("<br>----- DATA RECOREDED!!! ----");
return $strXml;
}

As others have noted, this could be an encoding issue.
Check your code for the Xml byte order mark.
Check the document is returning the correct mime type.
Not sure of your constraints but have you considered serializing your data to Json format. It's much easier to work with in the browser.
Finally consider using a library like JQuery to handle your ajax requests, much easier for cross browser compatibility.

firefox issue with js slider

I have this slider and it works fine in IE and chrome but has a problem in firefox, it loads all the picture one time but it does not go back again and load them, in the console i get this error
"SyntaxError: missing ] after element lis" in the line of setTimeout(func,900)
this is the code
function pic_loader() {
//alert('s');
var func = new function () {}
$folder = $('#foldername').attr('value');
$files = document.getElementById('filename').value;
$num = document.getElementById('num').value;
$filenames = $files.split("##");
var $img = [];
var $link = [];
if ($num > 1) {
for ($i = 1; $i <= $num; $i++) {
$img[$i] = $folder + "/" + $filenames[$i];
if ($i == 1) {
$link[$i] = "<img id='slide[" + $i + "]' width=380 src=" + $img[$i] + ">";
$("#load_here").append($link[$i]);
$first = document.getElementById('slide[1]');
$first.style.display = "none";
$($first).fadeIn(800);
} else {
$link[$i] = "<img id='slide[" + $i + "]' width=380 src=" + $img[$i] + " style='display:none'>";
$("#load_here").append($link[$i]);
}
}
$i = 1;
var $loop = setInterval(function () {
//alert('x');
$j = $i + 1;
$current = document.getElementById('slide[' + ($i++) + ']');
$next = document.getElementById('slide[' + ($j) + ']');
$($current).fadeOut(800, function () {
$($next).fadeIn(800);
});
if ($j > $num) {
$($next).fadeOut(800);
setTimeout(func, 900);
function func() {
clearInterval($loop);
$("#load_here").html("");
pic_loader();
}
}
}, 4500);
} else {
$i = 1;
$img[$i] = $folder + "/" + $filenames[$i];
$link[$i] = "<img id='slide[" + $i + "]' width=380 src=" + $img[$i] + ">";
$("#load_here").append($link[$i]);
}
}

There is no syntax error in the code you pasted. It must be elsewhere. Paste it into jsfiddle, it does not throw a syntax error.

First of all, id attribute cannot contains [ or ] character.
You can use name atrribute in place od id or create id like slide_1,slide_2,....
Using name attribute you can use function like :
$current = document.getElementsByName('slide[' + ($i++) + ']');
This post can help you more about your problem Accessing an array of HTML input text boxes using jQuery or plain Javascript