missing ] after element list

[Arnaud]

Hi folks!

What's wrong with this?

PHP Code:

            var addWpParams = {
                'code' : item.code,
                'name' : item.name,
                'type' : item.type,
                'lat' : item.lat,
                'lng' : item.lng,
                'latLng' : latLng
            };

            addWpParams(addWpParams); 


Returns an error: "missing ] after element list" in firebug

I must be doing something wrong but what?

TIA

[venegal]

The obvious error is that you're using addWpParams as if it were a function, which it isn't — whatever it was before, you're overwriting it with that object literal.

The error you quoted doesn't sound like it has anything to do with that, though, and there doesn't seem to be anything else wrong with that snippet you posted. Can you show this live?

[Arnaud]

Well... I actually have a function that is called addWpParams...

Now I have changed both the var and the function name to something different but I still get the same error. That thing is driving me mad...

I can't really post a live example as this is a part of a big project but here is the complete part:

PHP Code:

// Function to display search results

function displaySearchResults(searchTerm) {

    console.log("function displaySearchResults(" + searchTerm + ")");

    $.getJSON("model/search.php?search=" + searchTerm, function(data) {
            
        $.each(data, function(i,item) {
            
            var latLng = new g.LatLng(item.lat, item.lng);
            
            var addParams = {
                'code' : item.code,
                'name' : item.name,
                'type' : item.type,
                'lat' : item.lat,
                'lng' : item.lng,
                'latLng' : latLng
            };
            
            var srContents = '<div class="float-left">';
            srContents += '<table class="sr-table">';
            srContents += '<tr>';
            srContents += '<td colspan="3"><img src="images/ui/arrow_right.png" /> <a href="#" onclick="addAsWaypoint(' + addParams + ');" class="white">Add as waypoint</a></td>';
            srContents += '</tr>';
            srContents += '</table>';
            srContents += '</div>';
    
            $("#searchContainer").append(srContents);
        });
    });
}

function addAsWaypoint(params) {
    
    console.log("function addAsWaypoint(" + params + ")");
    
} 


Now the variable is called addParams and the function addAsWaypoint
Thanks in advance for any help on this!

[venegal]

Now, the obvious error is that you can't concatenate the object addParams to that onclick string like that. It will be converted to the string "[object Object]", and you don't want that string to be the parameter for addAsWaypoint.

But, again, this doesn't look like it's causing the error you described.

If I had to guess, I'd say your JSON is invalid. If you can't show a live example, you will have to use Firebug's network tab yourself to get the actual AJAX response, and post it here.

[Arnaud]

I think my JSON is valid. I did several tests and had it validated with JSONLint.

Here is an example of JSON that my search.php returns:

[{"id_gmaps_navaids":"19820","code":"KLAX","name":"Los Angeles International Airport","type":"large_airport","lat":"33.94250107","lng":"-118.40799713","altitude":"125","frequency":"0","iso":"US","link":"http:\/\/en.wikipedia.org\/wiki\/Los_Angeles_International_Airport","exact":"1"},{"id_gmaps_navaids":"128819","code":"OKLAX","name":" OKLAX","type":"FIX","lat":"43.86750031","lng":"16.04277802","altitude":"0","frequency":"0","iso":"", "link":"","exact":"0"}]

It definitely seems valid to me (?)

I didn't get your explanation about the "obvious error". Do you mean I should add the onclick event to my link in another manner?

Thank you.

[venegal]

Your JSON is ok.

What I meant before is this:

If you concatenate the object addParams to a string like this:

PHP Code:

var str = '<a href="#" onclick="addAsWaypoint(' + addParams + ');">'; 


the resulting string will be this:

<a href="#" onclick="addAsWaypoint([object Object]);">

The automatic type conversion that's happening when you try to concatenate an object to a string will not stringify the object to JSON, it will result in the meaningless string "[object Object]", so, yes, you will have to find another way to add that click event (putting it inline like you tried to do is messy anyways).

And, come to think of it, this does cause the error you described, because to the interpreter [object Object] looks like an array, but isn't actually valid syntax.

Edit: This is a perfect example of why it's bad to put code into strings. If anything is wrong with that code, it will be hard to debug, because you won't get any sensible line number information.

[Arnaud]

Originally Posted by venegal

Your JSON is ok.
so, yes, you will have to find another way to add that click event (putting it inline like you tried to do is messy anyways).

And, come to think of it, this does cause the error you described, because to the interpreter [object Object] looks like an array, but isn't actually valid syntax.

Edit: This is a perfect example of why it's bad to put code into strings. If anything is wrong with that code, it will be hard to debug, because you won't get any sensible line number information.

I agree. It's messy and yes, it will return that error on line #1 which of course is irrelevant.

I think I got the main idea and I will try to fire that click event in another way.

Thanks for your help!

[Arnaud]

Resolved.

I added an ID (link + i) to each link then used

$("#link" + i).click(function() {
addAsWaypoint(addParams);
});

and it now works as expected!

Thanks again for your help!