Question

Greetings,

I’ve been with this about 1 or 2 hours and it seems I cannot find the error in this function I’ve created to check the availability of something in a Database through jQuery and Ajax.

I’m calling the function with this link for test purpouses since I were unable to catch any errors before.

<a href="#" onclick="availability_check("Despacho", "22/05/2011","12:30", "12:45")">TEST</a>

And the code of the Function is the following:

function availability_check(location, date, from, to){  
    var check = 'location='+ location + '&date='+ date + '&from=' + from + '&to=' + to;

    $.ajax({
        type: "POST",
        url: "check-availability.php",
        data: check,
        cache: false,
        success: function(response){
                    var available = response;
                }
    });

    return available;
}

Declared just under the document_ready function.

Could someone smarter than me tell me what’s wrong? Firebug just says:

3

syntax error
[Stop in this error] availability_check(

Answer 1

You have three problems there. First of all, you have quotes inside the onclick attribute. Browsers will think you want to end the attribute, not start a JavaScript string. Try using ' instead of ".

The second problem is that you’re declaring available inside a closure. When you’re back in availability_check, available will be out of scope. Move var available to above $.ajax and change what’s currently var available = response; to just available = response;.

The third problem is it seems you don’t understand asynchronicity. $.ajax will be called, starting the request, but the request won’t finish immediately. It will just continue to return available; before the request has completed. Then, once it has completed, it will set available, but by then it’s too late. To fix this, add async: false as another option to $.ajax.