Ajax help

Never used ajax before
I have a drop down select list with 3 hard coded options.
Once one is selected i want it to update the database


<select name="status" id="id" onchange="updateStatus(this.value,<?php echo $row['id']; ?>)">
    <option value="<?php echo $row['status']; ?>"><?php echo $row['status']; ?></option>
    <option value="Order Placed">Order Placed</option>
    <option value="Processing">Processing</option>
    <option value="Dispatched">Dispatched</option>
</select>

function updateStatus(status, id){
var url = “updatestatus.html”;

function DoCallback(data){
    if (window.XMLHttpRequest) {                   // branch for native XMLHttpRequest object
        req = new XMLHttpRequest();
        req.onreadystatechange = processReqChange;
        req.open('POST', url, true);
        req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        req.send(data);
    } else if (window.ActiveXObject) {                     // branch for IE/Windows ActiveX version
        req = new ActiveXObject('Microsoft.XMLHTTP')
        if (req) {
            req.onreadystatechange = processReqChange;
            req.open('POST', url, true);
            req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            req.send(data);
        }
    }
}

}

First suggestion is to format the code properly. From what I could read, you should change the url where data is being posted to your php script and handle all database stuff in that script:


var url = 'updatestatus.php';

For update script it’s as simple as checking POST data and then updating database with new value.

changed the function to this


function updateStatus(status, id){
    var url = "updatestatus.php";
    if (window.XMLHttpRequest) { // branch for native XMLHttpRequest object
        req = new XMLHttpRequest();
        req.onreadystatechange = processReqChange;
        req.open('POST', url, true);
        req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        req.send(data);

        /*xmlhttp.open("POST","updatestatus.php",true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send("fname=Henry&lname=Ford");*/

    } else if (window.ActiveXObject) { // branch for IE/Windows ActiveX version
        req = new ActiveXObject('Microsoft.XMLHTTP')
        alert("update2");
        if (req) {
            req.onreadystatechange = processReqChange;
            req.open('POST', url, true);
            req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            req.send(data);
            alert("update3");
        }
    }
}

By adding in alerts the i found they stoped showing up at req.onreadystatechange = processReqChange; in the first of the if statement

How do i pass along the status and id?
Is that in the req.send(data)?

req.onreadystatechange should have function assigned to it, from your code I can’t tell if processReqChange is defined at all.
Yes, you pass your variables in data:


var data = {status: status, id: id};

or directly


req.send({status: status, id: id});

Got it sorted


function updateStatus(status, id){
    var url = "updatestatus.php";
    var xmlhttp;

    if(window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    }else{// code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.open("POST", url, true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.send("status="+status+"&id="+id);
}

Thanks took you to make me realise about the processReqChange.
I thought it was an ajax function or something

Thanks