星期一, 12月 31, 2012

[jQuery UI] autocomplete 控制項

試很久才正常的自動完成控制項, 一開始用keyup的事件綁定後,向後端拿資料,再初始化自動完成控制項, 但就是會有異常的情況,包含後端包出來的JSON的客製的,別頁又可以正常work。 最後終於試了正常的方向,在這記錄一下,以免下次要用又搞很久Orz。 測試版本為jquery ui 1.9.1版
 $( "#user" ).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: iANGEL + "manageuser/search/" + $("#user").val(),
     cache: false,
     type:"GET",
     dataType:"json",
                    success: function( data ) {
      //check response data 
      if(data.user_data.status == 200){
       response($.map( data.user_data.result, function( item ) {
        return item;
      
       }));
      }
                       
                    }
                });
            },
   select:function(event,ui){
    $.console("[AUTOCOMPLETE] select");
    //$.console(ui.item);
    $(this).val( ui.item.User_NickName).attr("data",ui.item.User_ID);
    return false;
   }
        }).data( "autocomplete" )._renderItem = function( ul, item ) {
       //$.console(item);
       
       return $( "<li>" )
        .data( "item.autocomplete", item )
        .append( "<a>" + item.User_NickName + "</a>" )
        .appendTo(ul);
  };

沒有留言:

張貼留言

留個話吧:)