Syntax error in function call

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(

icktoofay · Accepted Answer · 2011-05-22 21:53:55Z

2

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.

answered May 22, 2011 at 21:53

icktoofay

130k23 gold badges261 silver badges239 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Antonio Laguna Over a year ago

Awesome. Thanks for all of this, it was pretty useful. :)

rid · Accepted Answer · 2011-05-22 21:51:00Z

2

You're using quotes inside quotes inside an attribute's quotes, so the first quote after availability_check( becomes the ending quote of the onclick attribute. Change that to:

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

or:

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

It's also good practice to decouple the JavaScript code and the HTML code, so instead of placing this in an onclick attribute, it would be nicer to create data-* attributes, give the element an id, and then use a separate JavaScript file to obtain the element and attach an onclick even handler on it.

answered May 22, 2011 at 21:51

rid

64k31 gold badges159 silver badges201 bronze badges

1 Comment

Antonio Laguna Over a year ago

Thanks but the onclick was just for test purpouse since I wasn't able to find the error.

planetjones · Accepted Answer · 2011-05-22 21:52:04Z

0

Looks like your quotations are causing the parsing to fail. Try:

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

answered May 22, 2011 at 21:52

planetjones

12.7k6 gold badges54 silver badges51 bronze badges

Comments

lonesomeday · Accepted Answer · 2011-05-22 21:52:08Z

The problem is with the onclick attribute:

onclick="availability_check("Despacho", "22/05/2011","12:30", "12:45")"

The problem is that the quotes in the Javascript excerpt are clashing with the quotes delimiting the HTML attribute. This is one of the reasons why it's best not to use inline onclick attributes.

Since you're using jQuery, why not use its event-handler-binding functionality. Give your link an id attribute and do the following:

$('#yourId').click(function() {
    availability_check("Despacho", "22/05/2011","12:30", "12:45");
});

There are a whole host of other selectors, based on CSS selectors, if you prefer. To get to grips with what jQuery has to offer, I'd recommend http://jqfundamentals.com/

slugster · Accepted Answer · 2011-05-22 21:52:51Z

0

Use single quotes here:

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

answered May 22, 2011 at 21:52

slugster

50k14 gold badges105 silver badges150 bronze badges

Comments

hvgotcodes · Accepted Answer · 2011-05-22 21:53:11Z

0

be aware that success fires when the response returns. when you call the function availability_check, it is going to do your ajax request and return available immediately, before success is invoked (unless you have a really fast server ;). You should modify with the returned data in the success function....

answered May 22, 2011 at 21:53

hvgotcodes

121k33 gold badges209 silver badges237 bronze badges

2 Comments

icktoofay Over a year ago

Even if you have a really fast server, it's going to wait for the next event loop to fire your callback.

hvgotcodes Over a year ago

@icktoofay, yeah, i was being sarcastic ;).

Collectives™ on Stack Overflow

Syntax error in function call

6 Answers 6

1 Comment

1 Comment

Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

1 Comment

Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related