View previous topic :: View next topic |
Author |
Message |
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
Posted: 10.09.2007 13:28 Post subject: ajax i dom - ispis xml podataka u html tablicu |
|
|
prvi link
drugi link
Radim jednu aplikaciju i koristim ajax. Imam search formu u koju upišem šifru, nakon submitanja bi se ispod te forme trebao otvoriti div u kojem je tablica napunjena s traženim podacima, a te podatke povlačim iz xml-a koji je napunjen iz mysql baze.
Super, sve je to oke, sam kaj baš i ne radi
Naime, nakon submitanja mi se u span koji je pored input forme upiše tekst "Tražim...", xml dokument se stvori (to vidim kad otvorim Firebug) i nakon toga sve stane... Div s tablicom se uopće ne otvori, a kamoli da ispisuje podatke.
Gore sam dala dva linka, gotovo su identični, razlikaje samo u funkciji obradaPretragePodataka() u kojoj je, gotovo sam 100% sigurna, nekakva greška...
Već par dana (i noći) visim nad ovim, googlam, već sam bila na jednom forumum ali nikak da skužim u čemu je stvar... Ima li netko da me malo usmjeri (ili možda malo više?)
Unaprijed hvala...
p.s. za testiranje ovih linkova, kao šifru upišite 111 ili 222. |
|
|
Back to top |
|
|
Moebius
Joined: 26 Jan 2004 Posts: 245 Location: zagreb
|
|
Back to top |
|
|
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
Posted: 10.09.2007 14:51 Post subject: |
|
|
Upiši 111 ili 222 i vratit će.
Code: |
<?xml version="1.0" encoding="UTF-8"?>
<root>
<proizvodi>
<sifra>222</sifra>
<naziv>proizvod drugi</naziv>
</proizvodi>
</root>
|
|
|
|
Back to top |
|
|
zytzagoo mi3.crew
Joined: 25 Aug 2003 Posts: 1842 Location: Zagreb, Hrvatska
|
Posted: 10.09.2007 17:40 Post subject: |
|
|
Mozda da probas response header od generiranog xml-a postaviti na "text/xml" ili
"application/xml"?
Jer ovo sto sad server vraca za http://www.tand.hr/testiranje/searchProizvodaZaServis/mysqlxml.php?sifra=111
sto se browsera tice nije xml, nego html, a onda ni ne dobijas pravi xml dokument, po kojem
mozes setat sa DOM funkcijama.
U skripti mysqlxml.php ili kako se vec zove, daj pravi header:
Code: | <?php header('Content-type: text/xml; charset=utf-8'); ?> |
|
_________________ [+]I[+]am[+]my[+]own[+]religion[+] |
|
Back to top |
|
|
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
Posted: 10.09.2007 22:01 Post subject: |
|
|
Ups To mi uopće nije palo na pamet. Sam što mi sad (nakon što sam dodala header) javlja upozorenje i opet niš ne radi:
Code: | Warning: Cannot modify header information - headers already sent by (output started at /users1/tand/public_html/testiranje/searchProizvodaZaServis/mysqlxml.php:1) in /users1/tand/public_html/testiranje/searchProizvodaZaServis/mysqlxml.php on line 2 |
Morat ću malo skoknut do server-side odjela... Pa ak i nakon toga ne bu radilo, vratim se ovdje
Uglavnom, hvala na odgovoru. Pomogao mi je jer sam si još malo popunila rupu u znanju. |
|
|
Back to top |
|
|
zytzagoo mi3.crew
Joined: 25 Aug 2003 Posts: 1842 Location: Zagreb, Hrvatska
|
Posted: 10.09.2007 22:55 Post subject: |
|
|
Mozda file ima whitespace na pocetku, ili sl - ako ima, to treba maknuti i nek file pocne sa
<?php (nikakav prazan red, nista ispred toga, bez UTF BOM-a na pocetku etc... )
gl sa server-side odjelom |
_________________ [+]I[+]am[+]my[+]own[+]religion[+] |
|
Back to top |
|
|
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 12.09.2007 04:50 Post subject: |
|
|
Code: | if (http_request == 4) { ... |
Tu ti treba biti:
Code: | if (http_request.readyState == 4) { ... |
Ne uspoređuješ valjda XHR objekt s 4
Meni se Ajax.js tu ne sviđa, malo mi je sve naštrikano i nepregledno. A meni se čini da je opet tu XML nepotreban, kao što je bio i na prethodnom topicu o Ajaxu. Zašto ti server dinamički ne izgenerira HTML, a onda ga ti ubaciš u DOM preko innerHTML propery-a?
Anyway, možeš koristiti ovako neku funkciju za GET requestove (i baciti Ajax.js u trashcan):
Code: | // prima URL i dvije funkcije (druga opcionalna)
function get(url, handler, errorHandler) {
var xhr = window.ActiveXObject ?
new ActiveXObject("Microsoft.XMLHTTP") :
new XMLHttpRequest();
var callback = function() {
// ako readyState nije 4, ne zanima nas
if (xhr.readyState == 4) {
if (xhr.status == 200) handler(xhr);
else if (errorHandler) errorHandler(xhr);
}
}
xhr.onreadystatechange = callback;
xhr.open('GET', url, true);
xhr.send(null);
} |
Ne trebaju ti nikakvi hackovi, eval (užas) ili slično. Onda dalje svoje samo iskorigiraš:
Code: | window.onload = function() {
document.forms[0].onsubmit = function() {
document.getElementById("tijek_pretrage").innerHTML = "Tražim..."
var sifra = this['unosproizvoda'].value
get("mysqlxml.php?sifra=" + sifra, obradaPretrageProizvoda, jaoMeni)
return false
}
}
function jaoMeni(xhr) {
alert("Nesto je krivo :((")
}
function obradaPretrageProizvoda(rez) {
rezultatiXml = rez.responseXML;
// ... bla bla
} |
Za kraj: makni "name" atribute, koristi rađe ID. Nemoj koristiti getElementsByName u JavaScriptu, koristi getElementsById |
|
|
Back to top |
|
|
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
Posted: 12.09.2007 11:35 Post subject: |
|
|
Quote: | Posted: 12.09.2007 04:50 | Vau, hvala na brzom odgovoru
Quote: | Zašto ti server dinamički ne izgenerira HTML, a onda ga ti ubaciš u DOM preko innerHTML propery-a? | Ne znam, nekak mi se xml čini jednostavnijim (a možda sam i u krivu), a i danima već drvim po njemu tak da mi se ovo pitanje trenutno čini kao nuklearna fizika
Quote: | ...malo mi je sve naštrikano i nepregledno | Da, sad kad malo uspoređujem s tvojim kodom i meni se tak čini
A sad idem dalje drvit' pa ak opet negdje zapnem se javim.
|
|
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 13.09.2007 03:32 Post subject: |
|
|
Kores wrote: | Quote: | Posted: 12.09.2007 04:50 | Vau, hvala na brzom odgovoru |
Ponekad svratim na mi3 prije spavanja
Quote: | Quote: | Zašto ti server dinamički ne izgenerira HTML, a onda ga ti ubaciš u DOM preko innerHTML propery-a? | Ne znam, nekak mi se xml čini jednostavnijim (a možda sam i u krivu), a i danima već drvim po njemu tak da mi se ovo pitanje trenutno čini kao nuklearna fizika |
Pa sad, koliko je to nuklearna fizika procijeni sama. Na serveru je lakše generitati HTML nego XML, zar ne? Jednostavno umjesto XML-a na serveru generiraj HTML tablicu koju ćeš ubaciti. Onda ove tvoje funkcije (copy-paste sa tvoje stranice):
Code: | function obradaPretrageProizvoda(rez) {
rezultatiXml = rez;
var tabl_rezultata = document.getElementById("tabl_rezultata");
var total = rez.getElementsByTagName("proizvodi").length;
for(i = 0; i < total; i++) {
var proizvodi = rez.getElementsByTagName("proizvodi").item(i);
var sifra = rez.getElementsByTagName("sifra").item(0).firstChild.nodeValue;
var naziv = rez.getElementsByTagName("naziv").item(0).firstChild.nodeValue;
ispisProizvoda(sifra, naziv, tabl_rezultata);
}
if(total > 0)document.getElementById("forma_rez_proizvoda").style.display = "inline";
else document.getElementById("forma_rez_proizvoda").style.display = "none";
document.getElementById("tijek_pretrage").innerHTML = "Pretraga završena."
}
function ispisProizvoda(sifra, naziv, tabl_rezultata) {
//stvara red u koji drži podatke
var red = document.createElement("tr");
red.setAttribute(klasaStilova, "body_tablrezultata");
//stvara ćeliju za šifru proizvoda
var celijasifra = document.createElement("td");
celijasifra.setAttribute("align", "center");
//stvara ćeliju za naziv proizvoda
var celijanaziv = document.createElement("td");
celijanaziv.setAttribute("align", "left");
//stvara ćeliju za prihvat proizvoda
var celijaprihvat = document.createElement("td");
celijaprihvat.setAttribute("align", "center");
//stvara link za prihvat i tekst u tom linku ("Prihvati")
var prihvatiProizvod = document.createElement("a");
prihvatiProizvod.setAttribute(klasaStilova, "prihvat");
prihvatiProizvod.setAttribute("title", "Kliknite za odabir proizvoda.");
prihvatiProizvod.appendChild(document.createTextNode("Prihvati"));
prihvatiProizvod.onclick = function() { //funkcija koja se poziva nakon ¹to se klikne na "Prihvati"
return prihvatiProizvod(sifra);
}
//određuje hijerarhiju stvorenih elemenata
celijasifra.appendChild(sifra);
red.appendChild(celijasifra);
celijanaziv.appendChild(naziv);
red.appendChild(celijanaziv);
celijaprihvat.appendChild(prihvatiProizvod);
red.appendChild(celijaprihvat);
tabl_rezultata.appendChild(red);
} |
... postaju ovo:
Code: | function obradaPretrageProizvoda(rez) {
var el = document.getElementById("forma_rez_proizvoda")
el.innerHTML = rez.responseText
el.style.display = "block"
} |
Čije je fizika, moje ili tvoje? |
|
|
Back to top |
|
|
Kores
Joined: 10 Sep 2007 Posts: 20 Location: Zagreb
|
Posted: 13.09.2007 10:06 Post subject: |
|
|
Quote: | ...Nemoj koristiti getElementsByName u JavaScriptu, koristi getElementsById | Zaboravila pitati, zašto to veliš?
E, al uspjela sam završiti i ovak po svom, dodala još neke stvari i..... radi Evo linka (maknut ću ga za koji dan)
Ali, probat ću i bez xml-a. ovih tvojih 5 redova u odnosu na mojih 1150 malo me bacilo na razmišljanje.
Hvala na svim primjedbama i pomoći.
Pozdrav.
|
|
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 13.09.2007 18:00 Post subject: |
|
|
getElementsByName, makar je dio standarda, nije baš sretno rješenje za dobivanje reference na pojedini element jer ne može svaki element imati "name" atribut. S druge strane, svaki element može imati jedinstveni ID atribut i bolje je (i brže) koristiti getElementsById |
|
|
Back to top |
|
|
|