usage of jsonp first time

popular.js

/* 
 * below code is for search section of Travel Agent Player
 * @date : May 16,2013
 * @author : xKeshav
 * @update : May 22, 2013
 */
var baseUrl = 'http://www.clik2view.com/';

$(function() {

    $.xAjax = function(data) {
        return $.ajax({
            type: 'GET',
            url: baseUrl + 'pop_loc.php',
            async: false,
            data: data || {},
            dataType: 'jsonp',
            jsonp: 'jsonp_callback',
            jsonpCallback: 'jsonCallback',
            contentType: 'application/json; charset=utf-8',
            timeout: 5000,
        });
    }

    $.xAjax({
        type: 'pc'
    }).done(function(json) {
        //console.log(json);
        var countryList = [];
        var countryObject = json;
        $.each(countryObject, function(ck, cv) {
            countryList.push('<option value="' + ck + '" title="' + cv + '">' + cv + '</option>');
        });
        $('#country').find('option').end().append(countryList);
    }).fail(function() {
        alert('oh! error fetching popular country ');
    });

    // on change of country we display all popular towns from JSON file
    var fetchPopularTown = function(e) {
        "use strict";
        var townList = ['<option value="" selected="selected" >All Town</option>'];
        var areaList = '<option value="" selected="selected" >All Area</option>';
        var countryID = $('#country').val();
        var allTown = {};
        $.xAjax({
            type: 'pt',
            id: countryID
        }).done(function(json) {
            $('#town, #area').empty();
            var townObject = json;
            if (false === !townObject) {
                $.each(townObject, function(tk, tv) {
                    townList.push('<option value="' + tk + '" title="' + tv + '">' + tv + '</option>');
                });
            }
            $('#town').find('option').end().append(townList);
            $('#area').find('option').end().append(areaList);
        }).fail(function() {
            alert('error fetching popular Town');
        });
    }
    // on change of town we display all popular areas
    var fetchPopularArea = function(e) {
        "use strict";
        var areaList = ['<option value="" selected >All Area</option>'];
        var townID = $('#town').val();
        var allArea = {};

        $.xAjax({
            type: 'pa',
            id: townID
        }).done(function(json) {
            var areaObject = json;

            $('#area').empty();
            if (false === !areaObject) {
                $.each(areaObject, function(ak, av) {
                    areaList.push('<option value="' + ak + '" title="' + av + '">' + av + '</option>');
                });
            }
            $('#area').find('option').end().append(areaList);
        }).fail(function() {
            alert('error fetching popular Area');
        });
    }

    // on change of country we display all state list
    $(document).on('change', '#country', fetchPopularTown);
    $(document).on('change', '#town', fetchPopularArea);

    // on change of town we display all popular areas
    var fetchPopularFilms = function(c, t, a, k) {
        "use strict";
        var args = {
            c: c,
            t: t,
            a: a,
            k: k
        };
        //delete empty arguments
        Object.keys(args).forEach(function(k) {
            if (!args[k]) {
                delete args[k];
            }
        });

        $.ajax({
            dataType: 'jsonp',
            type: 'GET',
            url: baseUrl + 'pop_film.php',
            async: false,
            jsonpCallback: 'jsonCallback',
            data: args || {},
            jsonp: 'jsonp_callback',
            contentType: 'application/json; charset=utf-8',
            timeout: 5000,
            success: function(jFilm) {
                //console.log(jFilm);
                var popFilm = [];
                $.each(jFilm, function(k, v) {
                    popFilm.push(popularDiv(v));
                })

                $('div.popular-film').remove();
                $('div#popular-section').append(popFilm);
            }
        })
    }

    $(document).on('click', '#search', function() {
        var cid = $('#country').val();
        var tid = $('#town').val();
        var aid = $('#area').val();
        var term = $('#keyword').val();
        fetchPopularFilms(cid, tid, aid, term);
    })

    var popularDiv = function(obj) {
        var title = obj.title;
        var vidlerID = obj.vid;
        var thumb = "http://thumbs.cdn-ec.viddler.com/thumbnail_2_" + vidlerID + ".jpg";
        var img = $('<img />').attr({
            'src': thumb,
            'title': 'Preview',
            'height': '70',
            'width': '70',
            'alt': 'video'
        });

        var label = $('<label />').text(title);

        var button = $('<button />').attr({
            "name": "watch",
            "type": "button",
            "value": vidlerID,
            "title": "View Video"
        }).text('View Video');

        var popDiv = $('<div />').attr({
            'class': 'popular-film'
        }).append(img).append(label).append(button);

        return popDiv;
    };

});