Mam taki problem: mam plik html i input do wpisywania wartosci:
Kod
<form id="fromWojewodztwo" onsubmit="return false;" >
<div>
Szukaj: <input type="text" id="kontakt" autocomplete="off"/>
<div id="suggestBoxField"></div>
</div>
</form>
<div id="tekst"></div>
<div>
Szukaj: <input type="text" id="kontakt" autocomplete="off"/>
<div id="suggestBoxField"></div>
</div>
</form>
<div id="tekst"></div>
w drugim pliku js mam:
Kod
window.onload = init;
var XMLMainElement = null;
function init(){
document.getElementById("kontakt").onkeyup = function(evt) {
showBox(evt);
}
suggestBox();
}
function ajaxInit() {
var XHR = null;
try {
XHR = new XMLHttpRequest();
}
catch(e){
try{
XHR = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e2){
try{
XHR = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e3){
alert("blad inicjalizacji ajax");
}
}
}
return XHR;
}
function suggestBox() {
var XHR = ajaxInit();
if (XHR != null) {
XHR.open("GET", "wojewodztwatest.php" + "?random=" + Math.random(), true);
XHR.onreadystatechange = function() {
if (XHR.readyState == 4) {
if (XHR.status == 200) {
XMLMainElement = XHR.responseXML.documentElement;
}
else alert("Wystapil blad" + XHR.status);
}
}
XHR.send(null);
}
}
function showBox(evt){
var evt = (evt) ? evt : window.event;
if (XMLMainElement != null){
document.getElementById("suggestBoxField").innerHTML = '';
document.getElementById("kontakt").className = '';
var kontakty = XMLMainElement.getElementsByTagName("Kontakt");
for (var i = 0; i < kontakty.length; i++) {
if (kontakty[i].getElementsByTagName("Imie")[0].firstChild.nodeValue.toLowerCase().indexOf(document.getElementById("kontakt").value.toLowerCase()) ==0){
var suggestBoxField = document.getElementById("suggestBoxField");
suggestBoxField.style.visibility = 'visible';
var tmpDiv = document.createElement("div");
tmpDiv.innerHTML = kontakty[i].getElementsByTagName("Imie")[0].firstChild.nodeValue;//to co sie ma wyswietlac
suggestBoxField.appendChild(tmpDiv);
}
}
}
}
var XMLMainElement = null;
function init(){
document.getElementById("kontakt").onkeyup = function(evt) {
showBox(evt);
}
suggestBox();
}
function ajaxInit() {
var XHR = null;
try {
XHR = new XMLHttpRequest();
}
catch(e){
try{
XHR = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e2){
try{
XHR = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e3){
alert("blad inicjalizacji ajax");
}
}
}
return XHR;
}
function suggestBox() {
var XHR = ajaxInit();
if (XHR != null) {
XHR.open("GET", "wojewodztwatest.php" + "?random=" + Math.random(), true);
XHR.onreadystatechange = function() {
if (XHR.readyState == 4) {
if (XHR.status == 200) {
XMLMainElement = XHR.responseXML.documentElement;
}
else alert("Wystapil blad" + XHR.status);
}
}
XHR.send(null);
}
}
function showBox(evt){
var evt = (evt) ? evt : window.event;
if (XMLMainElement != null){
document.getElementById("suggestBoxField").innerHTML = '';
document.getElementById("kontakt").className = '';
var kontakty = XMLMainElement.getElementsByTagName("Kontakt");
for (var i = 0; i < kontakty.length; i++) {
if (kontakty[i].getElementsByTagName("Imie")[0].firstChild.nodeValue.toLowerCase().indexOf(document.getElementById("kontakt").value.toLowerCase()) ==0){
var suggestBoxField = document.getElementById("suggestBoxField");
suggestBoxField.style.visibility = 'visible';
var tmpDiv = document.createElement("div");
tmpDiv.innerHTML = kontakty[i].getElementsByTagName("Imie")[0].firstChild.nodeValue;//to co sie ma wyswietlac
suggestBoxField.appendChild(tmpDiv);
}
}
}
}
i w trzecim php:
Kod
<?php
$link = @mysql_connect("localhost", "root", "") or die("nie udało się połączyć");
@mysql_select_db("kontakty") or die ("nie udało się wybrać bazy danych");
mysql_query("SET NAMES 'utf8'");
$result = mysql_query("SELECT Imie FROM kontakty") or die("nie udało się pobrać danych");
header("Content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>";
echo "<Kontakty>";
while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
echo "<Kontakt>";
foreach($row as $klucz => $wartosc){
if ($klucz == "Imie")
echo "<Imie>".$wartosc."</Imie>";
}
echo "</Kontakt>";
}
echo "</Kontakty>";
mysql_close($link);
?>
$link = @mysql_connect("localhost", "root", "") or die("nie udało się połączyć");
@mysql_select_db("kontakty") or die ("nie udało się wybrać bazy danych");
mysql_query("SET NAMES 'utf8'");
$result = mysql_query("SELECT Imie FROM kontakty") or die("nie udało się pobrać danych");
header("Content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>";
echo "<Kontakty>";
while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
echo "<Kontakt>";
foreach($row as $klucz => $wartosc){
if ($klucz == "Imie")
echo "<Imie>".$wartosc."</Imie>";
}
echo "</Kontakt>";
}
echo "</Kontakty>";
mysql_close($link);
?>
ten przykład to pobieranie z bazy w tym przypadku imion, dynamicznie, podczas wpisywania do inputa wartości i wyświetlanie ich podczas wpisywania. I teraz pytanie - jak zrobić aby na początku wyświetlała się cała baza imion(nie jak do tej pory ze dopiero się pokazuja imiona po wpisaniu czegos) i dopiero wtedy już po wczytaniu całej bazy zaczyna się dynamiczne filtrowanie?