2016-08-05 44 views
2

從PHP JSON發送到自動完成,並在輸入數據添加屬性

[{ 
 
    "sysid": "39", 
 
    "name": "John", 
 
    "code": "060400000" 
 
}] 
 

 

 

 

 

 
$(document).on("input", ".autocomplete", function(event) { 
 
    var name = $(this).prop('id').split('_').pop(); 
 
    $(".autocomplete").autocomplete({ 
 
    source: function(request, response) { 
 
     $.ajax({ 
 
     type: 'POST', 
 
     url: 'autocomplete.php', 
 
     dataType: "json", 
 
     data: { 
 
      keypressed: request.term, 
 
      name: name 
 
     }, 
 
     success: function(data) { 
 
      //response(data); 
 
      response($.map(data, function(item) { 
 
      return { 
 
       name: item.name, 
 
       code: item.code, 
 
       sysid: item.sysid 
 
      }; 
 
      })); 
 
     } 
 
     }); 
 
    }, 
 
    minLength: 2 
 

 
    }); 
 
})

這是我的樣本數據

[{ 
    "sysid": "39", 
    "name": "John", 
    "code": "060400000" 
}] 

在我的自動完成,如果我在PHP頁面使用成功response(data);$name[] = ucwords(strtolower($selected_row[$columnename]));一切都很好,但我想添加額外的信息如代碼和SYSID我輸入文本。所以我做了

$name[] = array('sysid' => $selected_row['sys_id'],'name' => ucwords(strtolower($selected_row[$columnename])),'code' => $selected_row[$columnecode]);在PHP和成功

response($.map(data, function(item) { 
    return { 
     name: item.name, 
     code: item.code, 
     sysid: item.sysid 
    }; 
})); 

我想實現的是在輸入完成後autocmplete添加data-codedata-id

這可能嗎?用這個下面任何想法

UPDATE

但一個變化是下拉值我要的是輸入改變像

<input data-id="39" data-code="060400000"> 

response($.map(data, function(item) { 
    return { 
     title: item.name, 
     value: item.name 
    }; 
})); 
+0

問:這可能嗎?答:是的,問:任何想法? - 答:許多 – madalinivascu

+0

如何實現更新@madalinivascu –

回答

0

使用渲染項目功能

$(".autocomplete").data("ui-autocomplete")._renderItem = function(ul, item) { 
return '<li data-code="'+item.code+'" data-id="'+item.sysid+'">'+item.name+'</li>' 
} 

瞭解更多信息visit

+0

即時獲取'未捕獲TypeError:無法設置未定義的屬性'_renderItem' –