我有麻烦实施使用JSON JQuery的自动完成。 基本上，我得到一个JSON EN codeD数据来自我的服务器（我用codeigniter PHP框架）。

该JSON格式如下：

  [
    {
        ID：1，
        PRODNAME：糖果，
        code：CND01
        的uname：克，
        pcname：甜点
    }，
    {
        ...
    }
]
 

所以，autcomplete那张产品（PRODNAME）字段（在图像上的红色矩形）。当某些 产品被选中，ID，code，分类和计量单位得到填充。

这些是我的输入字段：

 ＆LT;输入类型=文本名称=ID值=ID =ID大小=3/＆GT;
＆LT;输入类型=文本名称=code的价值=ID =code大小=5/＆GT;
＆LT;输入类型=文本名称=PRODNAME值=ID =PRODNAME大小=30/＆GT;
＆LT;输入类型=文本名称=类别值=ID =类别/＆GT;＆LT; / TD＆GT;
＆LT;输入类型=文本名称=数量值=ID =量大小=3/＆GT;
＆LT;输入类型=文本名称=计量单位值=ID =计量单位大小=5/＆GT;
＆LT;按钮名称=添加类型=按钮＆gt;添加＆LT; /按钮＆GT;
 

我怎样才能做到这一点？

非常感谢你前期！

解决方法：

  $。阿贾克斯（{
        数据类型：JSON，
        异步：假的，
        成功：功能（数据）{
            项目=数据;
        }，
        网址：'？＆LT; PHP的回声SITE_URL（产品/自动完成/无'）; ？＆GT;
    }）;
            //自动完成
                $（#prodname）.autocomplete（{
                    来源：项目，
                    重点：功能（事件，UI）{
                        $（#prodname）.VAL（ui.item.prodname）;
                        返回false;
                    }，
                    选择：功能（事件，UI）{
                        $（#prodname）.VAL（ui.item.prodname）;
                        $（#ID）.VAL（ui.item.id）;
                        $（＃code）.VAL（ui.item code）;
                        $（#category）.VAL（ui.item.pcname）;
                        $（#uom）.VAL（ui.item.uname）;
                        返回false;
                    }
                }）
                .DATA（自动完成）._ renderItem =功能（UL，项目）{
                    返回$（＆LT;李＆GT;＆LT; /李＆gt;中）
                        .DATA（item.autocomplete，项目）
                        .append（＆其中a取代;+ item.prodname +＆所述; / A＆gt;中）
                        .appendTo（微升）;

                };
 

解决方案

请问这个例子可以帮助您？ http://jqueryui.com/demos/autocomplete/#custom-data

I am having troubles implementing JQuery autocomplete using JSON. Basically, I get an JSON encoded data from my server (I use codeigniter php framework).

The JSON format is following:

[
    {
        "id": "1",
        "prodname": "Candy",
        "code": "CND01",
        "uname": "grams",
        "pcname": "Sweets"
    },
    {
        ...
    } 
]

So, the autcomplete goes on the Product(prodname) field (in the red rectangle on the image). When certain product is selected, the ID,Code,Category and UOM get populated.

These are my input fields:

<input type="text" name="id" value="" id="id" size="3"  />
<input type="text" name="code" value="" id="code" size="5"  />
<input type="text" name="prodname" value="" id="prodname" size="30"  />
<input type="text" name="category" value="" id="category"  /></td> 
<input type="text" name="quantity" value="" id="quantity" size="3"  /> 
<input type="text" name="uom" value="" id="uom" size="5"  />
<button name="add" type="button" >Add</button>

How can I achieve that?

Thank you very much upfront!

SOLUTION:

$.ajax({
        dataType: 'json',
        async: false,
        success: function(data) {
            projects = data;
        },  
        url: '<?php echo site_url('products/autocomplete/no'); ?>'
    });
            //Autocomplete
                $( "#prodname" ).autocomplete({
                    source: projects,
                    focus: function( event, ui ) {
                        $( "#prodname" ).val( ui.item.prodname );
                        return false;
                    },
                    select: function( event, ui ) {
                        $( "#prodname" ).val( ui.item.prodname );
                        $( "#id" ).val( ui.item.id );
                        $( "#code" ).val( ui.item.code );
                        $( "#category" ).val( ui.item.pcname );
                        $( "#uom" ).val( ui.item.uname );
                        return false;
                    }
                })
                .data( "autocomplete" )._renderItem = function( ul, item ) {
                    return $( "<li></li>" )
                        .data( "item.autocomplete", item )
                        .append( "<a>" + item.prodname + "</a>" )
                        .appendTo( ul );

                };

Does this example help you? http://jqueryui.com/demos/autocomplete/#custom-data