KendoUI自動完成功能在Firefox中不起作用

Question

我的KendoUI自動完成功能在Chrome中可用，但不適用於Firefox。

我可以輸入城鎮名稱，例如「watford」並獲得顯示在chrome中的結果。

使用FireBug，我可以看到我返回有效的JSON結果，但得到'TypeError：e is undefined'錯誤消息。

http://jsfiddle.net/franH/znkV3/14/

var app = new kendo.mobile.Application(document.body, { 

transition: 'slide' 
}); 

$(document).ready(function() { 
$("#autoComplete").kendoAutoComplete({ 
    minLength: 7, 
    dataTextField: "title", 
    filter: "contains", 
    placeholder: "Select town...", 
    animation: { 
     open: { 
      effects: "fadeIn", 
      duration: 2000, 
      show: true 
     } 
    }, 

    close: function(e) { 
     var str1 = "Dropdown Item Selected:" + " " + e.item; 
     alert(str1); 
    }, 
    dataSource: new kendo.data.DataSource({ 
     transport: { 
      read: { 
       url: "http://api.geonames.org/wikipediaSearchJSON", 
       data: { 
        q: function() { 
         return $("#autoComplete").data("kendoAutoComplete").value(); 
        }, 
        maxRows: 10, 
        username: "pete" 

       } 
      } 
     }, 
     schema: { 
      data: "geonames" 
     } 
    }), 
    change: function() { 
     this.dataSource.read(); 
    } 
    }) 
}); 

Answer 1

我看到的唯一問題是，有沒有這樣的事情e.item爲close事件。使用value方法獲取自動完成的值。

Answer 2

你好，你正在請求json從另一domein是不允許的Same origin policy。但默認Chrome does not care about this，這就是爲什麼它仍然有效。

由於您無法強制用戶更改其瀏覽器設置，因此我建議您搜索端點或支持該端點的其他服務jsonp。

Answer 3

得到它在Firefox的工作，通過將行

datatype: "jsonp", 

更新的例子小提琴：http://jsfiddle.net/franH/znkV3/15/

var app = new kendo.mobile.Application(document.body, { 
    transition: 'slide' 
}); 

$(document).ready(function() { 
    $("#autoComplete").kendoAutoComplete({ 
    minLength: 7, 
    dataTextField: "title", 
    filter: "contains", 
    placeholder: "Select town...", 
    animation: { 
     open: { 
      effects: "fadeIn", 
      duration: 2000, 
      show: true 
     } 
    }, 

    close: function(e) { 
     var str1 = "Dropdown Item Selected:" + " " + e.item; 
     alert(str1); 
    }, 
    dataSource: new kendo.data.DataSource({ 
     transport: { 
      read: { 
       url: "http://api.geonames.org/wikipediaSearchJSON", 
       dataType: "jsonp", 
       data: { 
        q: function() { 
         return $("#autoComplete").data("kendoAutoComplete").value(); 
        }, 
        maxRows: 10, 
        username: "pete" 

       } 
      } 
     }, 
     schema: { 
      data: "geonames" 
     } 
    }), 
    change: function() { 
     this.dataSource.read(); 
    } 
    }) 
});