2016-08-05 48 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' –