jquery autocomplete不接受标签值对

时间:2012-09-14 19:13:46

标签: jquery-autocomplete

我正在尝试在localhost上使用带有url选项的自动完成功能。我的php文件返回如下;

[ { label: "025170000", value: "18511"},....{ label: "TE-5170V-Special", value: "8464"} ]

例如。

我的HTML代码看起来像这样;

    <head>
    <meta charset="utf-8">
    <title>jQuery UI Autocomplete - Remote datasource</title>
    <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.23.custom.css">
    <script src="js/jquery-1.8.0.min.js"></script>
    <script src="js/jquery-ui-1.8.23.custom.min.js"></script>
    <style>
    .ui-autocomplete-loading { background: white right center no-repeat; }
    </style>
    <script>
    $(function() {
        function log( message ) {
            $( "<div/>" ).text( message ).prependTo( "#log" );
            $( "#log" ).scrollTop( 0 );
        }

        $( "#products" ).autocomplete({
            source: "auto_complete.php",
            minLength: 3,
            select: function( event, ui ) {
                log( ui.item ?
                    "Selected: " + ui.item.value + " aka " + ui.item.id :
                    "Nothing selected, input was " + this.value );
            }
        });
    });
    </script>
</head>
<body>

<div class="demo">

<div class="ui-widget">
    <label for="products">Products: </label>
    <input id="products" />
</div>

<div class="ui-widget" style="margin-top:2em; font-family:Arial">
    Result:
    <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>

</div><!-- End demo -->

我使用了一系列字符串,但无法使用标签 - 值对。

1 个答案:

答案 0 :(得分:0)

好的,我发现你需要在'label'和'value'周围加上引号。所以它需要看起来像这样;

[ { "label": "025170000", "value": "18511"},....{ "label": "TE-5170V-Special", "value": "8464"} ] 

我是通过在服务器端脚本中使用此代码来完成此操作的;

      $result = mysql_query($sql);
  $products = '[';
  while ($row = mysql_fetch_assoc($result)) {
        extract($row);
        $products .= " { \"label\": \"$productnumber\", \"value\": \"$productid\"},";
  }
  $products=substr($products,0,-1); 
  $products .= ' ]';