如何从PHP获得输出以提前输入？

我正在使用twitter typeahead和php作为后端从mysql中获取数据。但是当我开始在文本框中输入时，我无法看到任何建议。我想是因为PHP的输出结果进行JSON编码..如何从PHP获得输出以提前输入？

我怎么能编码输出

输出：

echo '<a href="results.html" class="searchres" onclick="navigate()" style="color:#696969;text-decoration:none;"><img src='.$iurl.' class="icons" /><div class="results" style="color:#696969;text-decoration:none;">'."$fname".'</div><span style="color:#696969;text-decoration:none;" class="author">'.$caption.'</span></a>'."\n";

HTML：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title>Example of Twitter Typeahead</title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script type="text/javascript" src="../js/typeahead.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('input.typeahead').typeahead({ 
     name: 'countries', 
     prefetch: 'getvalues.php', 
     limit: 10 
    }); 
}); 
</script> 
<style type="text/css"> 
.bs-example{ 
    font-family: sans-serif; 
    position: relative; 
    margin: 100px; 
} 
.typeahead, .tt-query, .tt-hint { 
    border: 2px solid #CCCCCC; 
    border-radius: 8px; 
    font-size: 24px; 
    height: 30px; 
    line-height: 30px; 
    outline: medium none; 
    padding: 8px 12px; 
    width: 396px; 
} 
.typeahead { 
    background-color: #FFFFFF; 
} 
.typeahead:focus { 
    border: 2px solid #0097CF; 
} 
.tt-query { 
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; 
} 
.tt-hint { 
    color: #999999; 
} 
.tt-dropdown-menu { 
    background-color: #FFFFFF; 
    border: 1px solid rgba(0, 0, 0, 0.2); 
    border-radius: 8px; 
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 
    margin-top: 12px; 
    padding: 8px 0; 
    width: 422px; 
} 
.tt-suggestion { 
    font-size: 24px; 
    line-height: 24px; 
    padding: 3px 20px; 
} 
.tt-suggestion.tt-is-under-cursor { 
    background-color: #0097CF; 
    color: #FFFFFF; 
} 
.tt-suggestion p { 
    margin: 0; 
} 
</style> 
</head> 
<body> 
    <div class="bs-example"> 
     <input type="text" class="typeahead tt-query" autocomplete="off" spellcheck="false"> 
    </div> 
</body> 
</html>

getvalues.php

<?php 
require_once "config.php"; 
$q = strtolower($_GET["q"]); 
if (!$q) return; 

$sql = "select file_name,img_url,captions from completer"; 
$rsd = mysql_query($sql); 
while($rs = mysql_fetch_array($rsd)) { 
    $fname = $rs['file_name']; 
    $iurl = $rs ['img_url']; 
    $caption = $rs ['captions']; 
    echo '<a href="results.html" class="searchres" onclick="navigate()" style="color:#696969;text-decoration:none;"><img src='.$iurl.' class="icons" /><div class="results" style="color:#696969;text-decoration:none;">'."$fname".'</div><span style="color:#696969;text-decoration:none;" class="author">'.$caption.'</span></a>'."\n"; 
} 
?>

来源

2015-05-08 Mithun Raikar

PHP代码？ –

@AramKocharyan是的 –

y OU可以把它放到你的名单预输入的JSON文件，并更改你的脚本是：

$(document).ready(function(){ 
    $('input.typeahead').typeahead({ 
     name: 'countries', 
     prefetch: 'location/getvalues.json', 
     limit: 10 
    }); 
});

JSON文件应该是：

["country1","country2","country3"]

来源

2015-05-08 10:23:41 keikoku92

首先，以输出作为JSON编码，你有结果，以建立一个数组，并使用json_encode()，像这样：

$return = array(); 
while($rs = mysql_fetch_array($rsd)) { 
    $result[] = "..."; 
} 
echo json_encode($result);

但是默认结果HTML逃过预输入显示之前，所以你wan't得到你所期望的结果，但请参阅建议列表中的HTML代码。要使用自定义HTML设计条目，应使用here中描述的模板。

你$result阵列条目可能看起来像这样为你提供你的HTML有以下字段：

$result[] = array(
    "iurl" => "...", 
    "fname" => "...", 
    "caption" => "..." 
);

...然后描述模板填写。

另一件事：你正在使用的prefetch选项不是其中一种typehead，而是bloodhound，它通常与typeahead一起使用，但需要先初始化，并以source的形式提前打印。看看here，这很容易。

警犬在这部分可以通过URL采取固定数据集和数组（通过local选项），固定数据集（通过prefetch选项），或者可以做查询的URL，这是你apperently想做的事，因为你取您的PHP代码中的值为$_GET["q"]。在这种情况下，你在你的SQL使用$q并与remote选择这样的初始化猎犬：

remote: { 
    url: 'getvalues.php?q=%QUERY', 
    wildcard: '%QUERY' 
}

你不需要这么做，因为它会被再次过滤，在客户端typeahead.js ...这只是一个表现和结果数量的问题。如果只有几个，使用猎犬prefetch选项。

来源

2015-05-08 10:37:43 johjoh

首先，您应该使用mysqli而不是mysql，并且您还没有在查询中使用$_GET。不知道是否需要。

对于您的代码，不知道如何使用预取。我自己使用的也是在官方推特上使用的猎犬github。它看起来像这样：

var countries= new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    limit: 100, 
    remote: { 
     'cache': false, 
     url: 'ajax/getvalues.php?q=%QUERY', 
     wildcard: '%QUERY', 
     filter: function (data) { 
      return data; 
     } 
    } 
}); 

countries.initialize();

这将通过ajax调用从您的服务器获取数据。如果没有所有来自ajax调用的html标记，则返回JSON。 HTML标记可以在预输入

$('.typeahead').typeahead({ 
    highlight: true 
}, { 
    name: 'countries', 
    source: producten.ttAdapter(), 
    displayKey: 'artikelNaam', 
    templates: { 
     suggestion: function (countries) { 
      result='<a href="results.html" class="searchres" onclick="navigate()" style="color:#696969;text-decoration:none;">'+ 
       '<img src='+countries.img_url+' class="icons" />' 
       '<div class="results" style="color:#696969;text-decoration:none;">'+ 
        countries.file_name+ 
       '</div>'+ 
       '<span style="color:#696969;text-decoration:none;" class="author">'+ 
        countries.captions+ 
       '</span>'+ 
      '</a>'; 
      return result; 
     } 
    } 
});

完成，并且你的PHP文件应该是这样的：提供的是`getvalues.php`

<?php 
require_once "config.php"; 
$q = strtolower($_GET["q"]); 
if (!$q) return; 

$sql = "select file_name,img_url,captions from completer"; 
$rsd = mysql_query($sql); //should change to mysqli_query($con,$sql) where $con is your connection in config.php 
while($rs = mysqli_fetch_assoc($rsd)) { 
    $rows[]=$rs; 
} 
print json_encode($rows); 
?>

来源

2015-05-08 13:01:01 DutchEcho

如何从PHP获得输出以提前输入？

回答

相关问题