jQuery URL bit.ly shortener

Question

Will someone please help me with this jQuery bit.ly URL shortener?

The code is as follows:

function shortenUrl(urlMatch)
{
    var urlMatch = urlMatch
    var username="myusername";
    var key = 'R_897b82b73568ea74fffbafa5a7b846d';
    $.ajax({
        url:"http://api.bit.ly/v3/shorten",
        data:{longUrl:urlMatch,apiKey:key,login:username},
        dataType:"jsonp",
        success:function(v)
        {
            var shortUrl=v.data.url;
            return shortUrl;
        }
    });
}

$('button').click(function(){
    var urlMatch = $(this).val();
    var newUrl = shortenUrl(urlMatch);
    $('#menu').html(newUrl);
});

And whenever I run the script it returns this code in the console:

jsonp1304728172115({ data : [ ] , "status_code" : 500, "status_txt": "missing_arg_uri"})

Missing parameter "format": "json" ? Here is my version of code: http://stackoverflow.com/questions/1771397/jquery-on-the-fly-url-shortener/7005673#7005673 — Maksym Kozlenko, Aug 10 '11 at 04:48

score 2 · Accepted Answer · answered May 07 '11 at 01:41

2

You have

data:{longUrl:urlMatch,apiKey:key,login:username},

If jsonp is anything like json, then you're data argument is not formed correctly:

data:"{'longUrl':" + urlMatch + ",'apiKey':" + key + ",'login':" + username + "}",

The above code is not tested, but it should be similar.

answered May 07 '11 at 01:41

The Muffin Man

19,585
30
119
191

Nick, jquery takes care of this translation – ariel May 07 '11 at 02:01
ah yes, i think you are correct, because a jsonp call is GET. The code you posted does not work, but i got it working by just including all of the variables in the actual url. – mcbeav May 07 '11 at 02:06
Ah, didn't realize it was a GET. Good to know. – The Muffin Man May 07 '11 at 14:52

score 1 · Answer 2 · edited May 23 '17 at 10:34

1

This: urlMatch = $(this).val(); will get the button text into urlMatch, is this what you want?

Also, the return on the callback will not reach the function, because ajax() is an asynchronous function. To make it synchronous, add async:false to ajax() parameters.

And return will not work as well, so you have to assign the result to a global var.

But the best would be replacing return shortUrl; with $('#menu').html(shortUrl);, since that's the outcome that you are looking for. And you don't need async:false for that, which will block your code and temporarily lock the browser.

If all fails, try passing the parameters on the query string itself. You may want to take a look at this.

edited May 23 '17 at 10:34

Community

1
1

answered May 07 '11 at 00:40

ariel

15,620
12
61
73

well the actual problem i am having is there is an error message returned, and i cannot figure out as to why. – mcbeav May 07 '11 at 01:24
please check the content of urlMatch being passed as parameter – ariel May 07 '11 at 01:33
@mcbeav > i just checked the documentation and `async:false` can't be used with jsonp, so you'll have to go with the second option. – ariel May 07 '11 at 02:02
i finally got it working, every code snippit i found on the web did not work correctly, and i guess i just don't understand API's, because googles URL shortener API documentation is not very informative or helpful at all. – mcbeav May 07 '11 at 02:07
"If all fails, try passing the parameters on the query string itself." it's there on the original answer – ariel May 07 '11 at 02:10

score 0 · Answer 3 · answered Sep 05 '13 at 05:03

0

You're missing a semicolon after "var urlMatch = urlMatch"

answered Sep 05 '13 at 05:03

Intenex

1,907
3
20
33

jQuery URL bit.ly shortener

3 Answers3