taking a javascript sum answer and putting it in a mysql field

Question

I have created a shopping cart using javascript (cart.js) and i was wondering if you could take the P&P, total and amount ordered and place it in a mysql database using php. Ive not tried anything yet as im not sure if it is possible and i couldnt find anything when i googled (unless i was searching for wrong thing)

--cart.js---

function clearitems(){
    document.itemsform.num1.value=0;
    document.itemsform.num2.value=0;
    document.itemsform.num3.value=0;

    document.itemsform.total1.value=0;
    document.itemsform.total2.value=0;
    document.itemsform.total3.value=0;

    document.itemsform.PPTotal.value=0;
    document.itemsform.overalltotal.value=0;
}

function totalcost(){
    var total=0

    number=document.itemsform.num1.value
    if (isNaN(number)||number<1) number=0;
    if (number>4) price=15.00
        else price=20.00;
    document.itemsform.price1.value=currency(price)
    document.itemsform.total1.value=currency(price*number)
    total=total+price*number

    number=document.itemsform.num2.value
    if (isNaN(number)||number<1) number=0;
    if (number>4) price=7.50;
        else price=10.00
    document.itemsform.price2.value=currency(price)
    document.itemsform.total2.value=currency(price*number)
    total=total+price*number

    number=document.itemsform.num3.value
    if (isNaN(number)||number<1) number=0;
    if (number>4) price=18.00;
        else price=24.00
    document.itemsform.price3.value=currency(price)
    document.itemsform.total3.value=currency(price*number)
    total=total+price*number    

    if (total<50){
        document.itemsform.PPTotal.value=currency(2.5)
        total=total+2.5
    }else document.itemsform.PPTotal.value=currency(0);
        return(currency(total))
}

function currency(inputnum){
    var outputstring=""
    outputstring="£"+inputnum
    if(outputstring.charAt(outputstring.length-2)==".")
        {outputstring=outputstring+"0"; return(outputstring)}
    if(outputstring.charAt(outputstring.length-3)!=".")
        {outputstring=outputstring+".00"; return(outputstring)}
}

Answer 1

It will be something like this:

in your JS file:

function saveToDatabase(cartValue) {
    $.ajax({
        type: "GET",                                         //the method/type of the information you are sending
        url: "yourwebsite.com/somefile.php?data="+cartValue, //the url where you will fetch the data you need
        dataType: 'text',                                    //the type of the data = text
        success: function(result){                           //if function succeed 
            //do something
        }
    });
}

in your PHP file ^somefile.php :

extract($_GET);
//$data
//^ this variable is the cartValue from JS

//do something / save in the database

Answer 2

The cart data can be posted to a PHP server using AJAX, like so:

var cartData = "pandp=" + pandP + "&total=" + total; //build a query string for the cart data
var xmlhttp = new XMLHttpRequest(); //instantiate the request object

xmlhttp.open("post", "/somefile.php"); //initialise a post request to the server side script
xmlhttp.send(cartData); // send the cart data

xmlhttp.onreadystatechange = function() {
    if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        console.log(xmlhttp.responseText); //output a successful response to the console
    }
}

On the server side your PHP script can access the data via the $_POST superglobal:

<?php
     var_dump($_POST);

Don't extract $_POST (as suggested by @holpducki) this poses a security risk. The contents of $_POST must be sanitised before use.

More info about XMLHttpRequest can be found at https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#open()