Question

我使用asp.net webservice在jQuery UI自动完成插件中使用它，这是我得到的数据。

{"d":[
    {
        "__type":"WebS.Model.SearchModel",
        "MainCommodityId":1,
        "MainCommodityName":"Pulses",
        "SubcommodityId":3,
        "SubCommodityName":"Urid Dal",
        "BrandId":3,
        "BrandName":"President"
    },
    {
        "__type":"WebS.Model.SearchModel",
        "MainCommodityId":1,
        "MainCommodityName":"Pulses",
        "SubcommodityId":1,
        "SubCommodityName":"Red Gram",
        "BrandId":4,
        "BrandName":"President"
    }
    ]
}

这是我正在使用的脚本：

$(document).ready(function () {
    $(".input-search").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '/WebServices/GetAllBrandNames.asmx/getAllBrands',
                data: "{ 'data': '" + request.term + "'}",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    response($.map(data.d, function (item) {
                        return {
                            value: item.BrandName,
                            label: item.SubCommodityName
                        }
                    }))
                },
                error: function (response) {
                    alert('error');
                },
                failure: function (response) {
                    alert('faii');
                }
            });
        },
        select: function (e, i) {
            console.log(i.MainCommodityId);
            console.log(i.SubcommodityId);
            console.log(i.BrandId);
        },
        minLength: 1
    }).autocomplete("instance")._renderItem = function (ul, item) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append("<a>" + "" + item.BrandName + " in " + item.MainCommodityName + " - " + item.SubCommodityName + "</a>")
            .appendTo(ul);
    };
});

问题是：

当我尝试输入关键字时说：预，上述输出将在json中输入。但是，这个名单只返回了一个＆＃34;总统＆＃34;项目应显示2项。
列表显示＆＃34; undefined in undefined - undefined＆＃34;添加.autocomplete("instance")._renderItem函数后代替值。
console.log也未定义。

如何修复这些问题？

Answer 1

select事件的默认行为是使用ui.item.value更新输入。此代码在事件处理程序之后运行。

只需使用select或focus阻止event.preventDefault()和return false上的默认操作，并使用_renderItem进行自定义下拉列表。

focus: function(event, ui) {
   // prevent autocomplete from updating the textbox
   event.preventDefault(); // or return false;
}

select: function(event, ui) {
   // prevent autocomplete from updating the textbox
   event.preventDefault(); 
   //do something
}

参考文献：

Answer 2

通常我都是这样做的。

$(document).ready(function () {
var jsondata=array();
$.post("/WebServices/GetAllBrandNames.asmx/getAllBrands",{data: request.term},function(data){
var data=JSON.parse(data);
$.each(data.d, function( index, value ) {
  jsondata[index].value=value;
 });
$(".input-search").autocomplete({
    source:jsondata,
    //other property and events
 })
});

我的意思是在完成请求后应用源JSON，因为有时如果AJAX需要一些时间来加载执行指针仍然执行其余代码而不等待响应。

我没有测试这段代码，但我总是这样做，从来没有得到你的错误。祝你好运

Answer 3

最后，我能够实现我想要的目标。回答我的问题，因为它可能对某人有帮助。

的javascript：

    ul.ui-front {
        z-index: 1200; // change z-index according to your UI.
    }

CSS：

sentences = input("Enter the text you want to compress: ")
name = input("Please enter your desired file name: ")
with gzip.open(filename + ".gz", "wt") as outfile:
     outfile.write(plaintext)

C＃Webservice json数据jquery ui具有自定义格式

3 个答案: