0

我有一个 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 );
};

有人有想法吗?

4

0 回答 0