如何减少多个Ajax调用

时间:2013-10-16 13:46:27

标签: html web-services jquery cordova

我正在开发使用Phone Gap.Language的Windows Phone 7应用程序[HTML,css,JavaScript]

我正在使用Web服务获取Json数据Web服务并绑定到下拉列表中。

单页我使用5个AJAX电话[年龄,身高,宗教,演员,国家,语言,状态,教育]

我的示例Ajax调用下面给出的年龄。

 $.ajax({
    type: "GET",
    contentType: "application/json; charset=utf-8",
     url: "https://www.xxxxxxxx.com/yyyyyyyy/zzzzzzzzzz.svc/GetMasterDataoverHTTPS?AuthToken=" + encodeAuthtoken + "&ListKey=" + encodeListkey + "&ListValue=" + encodeMinAge,
    crossDomain: true,
    dataType: "jsonp",
    success: function (data) {
        var result = data;
        $.each(result, function (key, value) {
            var appenddata = "<option value = '" + value.ListKey + "'>" + value.ListValue + " </option>";
            $('#ddlSFromAge').html($('#ddlSFromAge').html() + appenddata);
        });

        //alert(result);
    },
    error: errorResponse
});

function errorResponse(xhr, ajaxOptions, thrownError) {

    alert('Error on Ajax Call' + '\n Status: ' + xhr.status + '\n Response Text: ' + xhr.responseText + '\n Error: ' + thrownError);
}enter code here

对于每一个和永远的下降我称之为喜欢这个。我知道这不好。

任何一个告诉我如何减少这个AJAX调用[对于每个下拉使用的单独URL]

2 个答案:

答案 0 :(得分:0)

我猜你正在使用这么多的ajax调用,因为数据类型是动态的?如果它们不是动态的,那么您应该考虑使用设备sqlite数据库来存储您的值并只查询它。可以找到文档here

如果你真的需要拨打那么多电话,因为数据是动态的,那就这样吧。但是,您可以只使用1个函数,而不是使用5个单独的AJAX函数,并将您希望它使用的函数传递给function ajaxCall('http://www.myserviceurl'),或者传递一个值来再次运行一个开关以确定要使用的URL。

答案 1 :(得分:0)

我改变了我的代码,就像这个积分一样去了@Dom

<script type="text/javascript">
    doAjaxCall("Country");
    doAjaxCall("Language");
    doAjaxCall("religion");
    doAjaxCall("Caste");

    function doAjaxCall(type) {
        var url;
        switch (type) {
            case "Country":
                url = "https://www.xxxxxx.com/yyyyyyy/GetCountryoverHTTPS?AuthToken=Z0lFITFVMw==&FormCode=U1A=";
                ajaxCall(url, '#ddlCountry');
                break;
            case "Language":
                url = "https://www.xxxxxx.com/yyyyyyy/GetLanguageoverHTTPS?AuthToken=Z0lFITFVMw==&FormCode=U1A=";
                ajaxCall(url, '#ddlLanguage');
                break;
            case "religion":
                url = "https://www.xxxxxx.com/yyyyyyy/GetReligionoverHTTPS?AuthToken=Z0lFITFVMw==&FormCode=U1A=";
                ajaxCall(url, '#ddlReligion');
                break;
            case "Caste":
                url = "https://www.xxxxxx.com/yyyyyyy/GetMotherTongueoverHTTPS?AuthToken=Z0lFITFVMw==&FormCode=U1A=";
                ajaxCall(url, '#ddlMother');
                break;

            default:
                url = ""; //or some other code to execute if type doesnt match anything
        }
        function ajaxCall(paramurl,paramControlId) {
            $.ajax({
                type: "GET",
                contentType: "application/json; charset=utf-8",
                url: url,
                crossDomain: true,
                dataType: "jsonp",
                success: function (data) {
                    var result = data;
                    $.each(result, function (key, value) {
                        var appenddata = "<option value = '" + value.ListKey + "'>" + value.ListValue + " </option>";
                        $(paramControlId).html($(paramControlId).html() + appenddata);
                    });

                    //alert(result);
                },
                error: errorResponse
            });
            function errorResponse(xhr, ajaxOptions, thrownError) {

                alert('Error on Ajax Call' + '\n Status: ' + xhr.status + '\n Response Text: ' + xhr.responseText + '\n Error: ' + thrownError);
            }
        }
    }
</script>`