Ajax, Jquery i PHP - Problem u IE

[Croll]

Definitivno sam početnik u Ajax tehnologijama!

Rešio sam da iskoristim Ajax za pretraživanje. Pogledam kako to ljudi rade sa Jquery (dosta ga koristim pa je logično da i ovde radi), napravim i sve to radi kako sam zamislio u FF2 i Operi9.

Ne da mi đavo mira da proverim i u IE (kao što je i red) kad ono: !?"#@?^&%"!

Ogolim kod do običnog html-a, probam na još dve mašine...

Kada mi PHP ispisuje sadrža, ništa ne radi (u IE), dok kada učitavam običan txt fajl onda radi.

Inače, primeri koje sam gledao rade i u IE.

Sve je testirano na XAMP i on-line

Kod za učitavanje je sledeći:

$.post("ajaxsearch.php", {q: ""+inputString+""}, function(data){
	if(data.length >0) {
		$('#searchresults').show();
		$('#searchresults').html(data);
	}
});

i to funkcionise ok u FF i Operi.

Uostalom, na ovom linku imate primer - namerno sam ostavio da se vidi sadržaj foldera.

Kopija ajaxsearch.php u txt formatu da bi ga skinuli a izgleda ovako:

<?php

$Search = "<div class=\"sbihead2\">Pronadjeno: 4</div>\n<div class=\"sbicontent\">\n<ul class=\"sbilinks\">\n";

$Search .= "\t<li><a href=\"http://www.link.com\" title=\"Title linka\"><strong>Link</strong></a><br />Nam elit. Sed eros odio, accumsan et, vestibulum in, bibendum ullamcorper, nibh.</li>\n";
$Search .= "\t<li><a href=\"http://www.link.com\" title=\"Title linka\"><strong>Link</strong></a><br />Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nulla venenatis, lectus id lacinia pretium, elit turpis dictum ante, eget venenatis turpis felis at leo.</li>\n";
$Search .= "\t<li><a href=\"http://www.link.com\" title=\"Title linka\"><strong>Link</strong></a><br />Praesent eu lectus vel leo placerat commodo. Aenean ullamcorper adipiscing erat. Nulla ut mauris sit amet velit pellentesque suscipit. Nunc ornare mattis ante. Ut pretium mi ac purus. In hac habitasse platea dictumst.</li>\n";
$Search .= "\t<li><a href=\"http://www.link.com\" title=\"Title linka\"><strong>Link</strong></a><br />Vestibulum pellentesque ligula sit amet pede. Proin quam. Fusce vitae augue. Vestibulum ac erat et nulla pharetra suscipit. Aliquam vitae ligula. Pellentesque vehicula mollis risus.</li>\n";

$Search .= "</ul>\n</div>\n</div>\n";
echo $Search;

?>

Znam da je problem glupav, u headeru ili sl. ali sam glupav da ga nadjem.

Unapred hvala

[MrSteel]

sta ti vraca alert(data) nakon izvrsenja
function(data) {
alert(data)
.
.
.
}

[MorenoArdohain]

Mislim da mu se u IE funkcija ne poziva na onkey. Treba istraziti zasto.

[Misha]

Zameni

$('#searchresults').html(data);

sa

$('#searchresults')[0].innerHTML = data;

[Croll]

Originalno napisao MorenoArdohain

Mislim da mu se u IE funkcija ne poziva na onkey. Treba istraziti zasto.

Poziva se funkcija, proverio. Ali isto ne radi link 'PHP Load' koji učitava iz PHP-a u DIV dok 'Text Load' radi što definitivno nema veze sa 'onkey'.

Originalno napisao MrSteel

sta ti vraca alert(data) nakon izvrsenja

Svugde vraća baš šta i treba, tačan 'echo' iz PHP-a ali ga Explorer ne smešta u DIV dok Opera i FF rade lepo.

Originalno napisao Misha

Zameni

$('#searchresults').html(data);

sa

$('#searchresults')[0].innerHTML = data;

Nažalost, neće ići, to bi trebalo da radi sam Jquery. U ovom obliku je neispravna Jquery sintaksa.

Da li kod vas radi u Exploreru? Probajte i linkove 'TXT Load' i 'PHP LOad' koji su realizovani preko Jquery funkcije:

$("a[@rel]").click(function() {$("#container").load(this.href, {thread_count: this.rel}); return false;});

Ista situacija, učitava HTML iz TXT fajla dok iz PHP-a Explorer neće da ga smesti gde treba.

[conica]

mozda je pucanj u prazno, ali pokusaj da referenciras umesto direktno na ID ovako:

$("div[@id='searchresults']").show();
$("div[@id='searchresults']").html(data);

[Br@nkoR]

Imaš grešku u sintaksi html kôda u php fajlu, postoji višak "</div>".


Nema veze sa problemom, ali nemoj na svaki keyup slati ajax zahtev, već postavim minimalan broj karaktera na koji šalješ, zatim sačekaj da korisnik napravi pauzu u kucanju pa tek onda šalji zahtev, odredi na koje karaktere je moguće slati zahtev, kada salješ zahtev sačekaj da se završi prethodni pa šalji novi. Postavi i neki indikator kada se šalje zahtev, kako bi korisnik znao.

[MrSteel]

nista, pucaj onda sa
document.getElementById("...").innerHTML
ako vec jQuery zeza, ja nisam doduse imao problema ali posalji njima primer mozda ce imati bolje objasnjenje

btw. explorer zna da odbije da prikaze sadrzaj kada je sintaksa neispravna

[Croll]

Imaš grešku u sintaksi html kôda u php fajlu, postoji višak "</div>".

HVALA!!!

Pa da poludim od zamajavanja, totalno mi je promaklo. Izvinjavam se svima koji su odvojili vreme da pomognu, biću MNOGO pažljiviji ubuduće kod ovakvih običnih stvari. Fokusiraš se na nešto novo a ubije te običan copy-paste

Nema veze sa problemom, ali nemoj na svaki keyup slati ajax zahtev, već postavim minimalan broj karaktera na koji šalješ, zatim sačekaj da korisnik napravi pauzu u kucanju pa tek onda šalji zahtev, odredi na koje karaktere je moguće slati zahtev, kada salješ zahtev sačekaj da se završi prethodni pa šalji novi. Postavi i neki indikator kada se šalje zahtev, kako bi korisnik znao.

Izuzetno korisni i dobrodošli saveti. Već sam primetio da prilikom kucanja imam višestruke pozive ali nisam hteo da obraćam pažnju na to dok ne rešim prvi problem.

U keyup funkciji je već predviđen minimum slova kada da pošalje zahtev ali sam ga skinuo radi testiranja.

Nije problem filtriranje karaktera, indikator, čekanje na prethodni load ali mislim da će mi biti problem čekanje na pauzu u kucanju.

Usvakom slučaju, još jednom najlepše hvala na pomoći i savetima, to je uvek dobrodošlo!

[Br@nkoR]

Originalno napisao Croll

ali mislim da će mi biti problem čekanje na pauzu u kucanju.

Npr.
Možeš odraditi tako što ćeš ajax zahtev slati sa malom pauzom, pomoću funkcije setTimeout.

var timeoutID = null;
function lookup(inputString) {
  if(inputString.length == 0) {
    $('#searchresults').hide();
  } else {
    clearTimeout(timeoutID);
    timeoutID = setTimeout(function () {
      $.post("ajaxsearch.php", {q: ""+inputString+""}, function(data){
        if(data.length >0) {
          $('#searchresults').show();
          $('#searchresults').html(data);
        }
      });
    }, 300);
  }
}

Dakle kada korisnik ukuca jedan karakter, id timeout-a biće zapisan u promenljivu timeoutID, ukoliko korisnik unese novi karakter pre isteka timeout-a, obrisaće se stari id, odnosno poništiće prethodni zahtev, pomoću clearTimeout i biće registrovan nov id, odnosno poslaće novi ajax zahtev, i tako sve dokle korisnik ne napravi pauzu u kucanju dužu od 300ms ili u zavisnosti vrednosti koju ti definišeš.