我正在尝试在我的应用程序中实现自动完成功能。但它没有得到建议,而是显示我的代码的java脚本行。 例如:如果我输入'n',那么它会显示所有带有'n'字符的java脚本行。我已将所有必需的.js和.css文件粘贴到各自的文件夹中。我不喜欢缺少的地方。请帮我。我正在粘贴我的控制器并查看部分。
控制器:
public function find_name() {
if ($this->request->is('ajax')) {
$this->autoRender = false;
$panel_name = $this->request->query('term');
$results = $this->Panel->find('all', array(
'conditions' => array('Panel.name LIKE ' => '%' . $panel_name . '%'),
'recursive' => -1
));
$resultArr = array();
foreach($results as $result) {
$resultArr[] = array('label' =>$result['Panel']['name'] , 'value' => $result['Panel']['name'] );
}
echo json_encode($resultArr);
}`
查看:
$('.pchange').each(function()
{
var g=$(this).attr('id');
//alert(g);
var lastChar = g.replace ( /[^\d.]/g, '' );
$('#name'+lastChar).autocomplete("PanelsController/find_name",
{
minChars: 1,
delay: 0,
maxCacheLength: 100,
onItemSelect:
function (item)
{
alert(item);
$("#name"+lastChar).val(item.data[0]);
$("#phone"+lastChar).val(item.data[1]);
$("#email"+lastChar).val(item.data[2]);
}
});
});
答案 0 :(得分:0)
请试试这个。你还没有退出json数据
public function find_name() { if ($this->request->is('ajax')) { $this->autoRender = false; $panel_name = $this->request->query('term'); $results = $this->Panel->find('all', array( 'conditions' => array('Panel.name LIKE ' => '%' . $panel_name . '%'), 'recursive' => -1 )); $resultArr = array(); foreach($results as $result) { $resultArr[] = array('label' =>$result['Panel']['name'] , 'value' => $result['Panel']['name'] ); } echo json_encode($resultArr); exit; }
$(".autocomplete").autocomplete({ source: function( request, response ) { $.ajax({ url: "<?php echo $this->Html->url(array('action' => 'find_name')); ?>", dataType: "json", data: { q: request.term }, success: function( data ) { response( data ); } }); }, minLength: 1, select: function( event, ui ) { }, open: function() { $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); }, close: function() { $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); } }).data( "ui-autocomplete" )._renderItem = function( ul, item ) { return $( "<li>" ) .data( "ui-autocomplete-item", item ) .append("<a href=javascript:void(0);>" + item.label + "</a>") .appendTo( ul ); };
还请包括jquery-ui.js及其css