Question

我有一个jQuery自动完成脚本，它从数据库（Oracle）获取数据。它工作正常，但我想以不同的方式显示数据。

我以http://jqueryui.com/autocomplete/#custom-data为例。不知何故，我没有让它工作。我基本上试图像示例一样（显示描述和项目），但使用远程数据源。

这是我的代码：

<html>
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script>
$(document).ready(function()
{
$('#id').val("");
$('#value').val("");
$('#desc').val("");

            $("#value").autocomplete({
                source: "states.php",
                minLength: 1,

                select: function(event, ui) {
                    $('#id').val(ui.item.id);
                    $('#value').val(ui.item.value);
                    $('#desc').val(ui.item.desc);
                }
            });
             .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
             return $( "<li>" )
             .append( "<a>" + item.value + "<br>" + item.desc + "</a>" )
             .appendTo( ul );
};
});
</script>
</head>
<body>
<form action="<?php echo $PHP_SELF;?>"  method="post">
<p class="ui-widget">
<input type="text" id="value"  name="value" />
<input type="text" id="desc" name="desc" />
<input type="text" id="id" name="id" /></p>
<p><input type="submit" name="submitBtn" value="Submit" /></p>
</form>
</body>
</html>

如果删除.data块，我的自动完成功能正常。但当然没有适当的格式化。

             .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
             return $( "<li>" )
             .append( "<a>" + item.value + "<br>" + item.desc + "</a>" )
             .appendTo( ul );
};

有人有想法吗？

jQuery自动完成中的自定义数据格式

0 个答案: