/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Vaiabel function navn?
Fra : Mr J..


Dato : 19-11-07 14:40

Hejsa,

Sidder og leger med AJAX, og det virker som sådan ok, som jeg vil have det
til :)
Men jeg er mildeste talt ikke så stærk i javascript, så det æder jo lidt
tid, så jeg håber i vil hjælpe mig lidt her:

Jeg søger i en database efter navn, og dvs at der skal kunne vises alt fra 2
til 25 søgefelter og unikke resultater.. det er jo nemt nok bare at copy
paste koden, men det er jo lidt klumset.. frontenden er intet problem, det
laver jeg med php, men javascriptdelen kan jeg ikke lige gennemskue hvordan
jeg skal fikse..

Frontend delen i ren html.

<head>
<script language="javascript" src="ajax.js"></script>
</head>

<html>
<input type="text" id="navn1" size="12">
<input type="button" value="Søg elev" id="button" onClick="doSearch1();">
<input type="hidden" id="nr" value="1">
</form>
<div id="answer1" style="display: inline; font-size: 16px"></div>
<br>
<input type="text" id="navn2" size="12">
<input type="button" value="Søg elev" id="button" onClick="doSearch2();">
<input type="hidden" id="nr" value="2">
</form>
<div id="answer2" style="display: inline; font-size: 16px"></div>
</html>


Og nu kommer javascript delen så (kun det relevante):

function doSearch1(){
var url = "backend.php?navn=" + document.getElementById('navn1').value;

http.open("GET", url, true);
http.onreadystatechange = handleHttpResponse1;
http.send(null);
}

function handleHttpResponse1(){
if(http.readyState == 4){
document.getElementById('answer1').innerHTML = http.responseText;
}
}

function doSearch2(){
var url = "backend.php?navn=" + document.getElementById('navn2').value;

http.open("GET", url, true);
http.onreadystatechange = handleHttpResponse2;
http.send(null);
}

function handleHttpResponse2(){
if(http.readyState == 4){
document.getElementById('answer2').innerHTML = http.responseText;
}
}


Er der ikke en måde man kan få den til at genere doSearch og
handleHttpResponse selv, eller skal jeg lave 25 sæt af dem, for at få de
forskellige indputs og outputs?

Mvh
Morten




 
 
Birger (19-11-2007)
Kommentar
Fra : Birger


Dato : 19-11-07 16:15

"Mr J.." <Nomail@nomail.dk> skrev i en meddelelse
news:4741924e$0$90270$14726298@news.sunsite.dk...
> Hejsa,
>
> Sidder og leger med AJAX, og det virker som sådan ok, som jeg vil have det
> til :)
> Men jeg er mildeste talt ikke så stærk i javascript, så det æder jo lidt
> tid, så jeg håber i vil hjælpe mig lidt her:
>
> Jeg søger i en database efter navn, og dvs at der skal kunne vises alt fra
> 2 til 25 søgefelter og unikke resultater.. det er jo nemt nok bare at copy
> paste koden, men det er jo lidt klumset.. frontenden er intet problem, det
> laver jeg med php, men javascriptdelen kan jeg ikke lige gennemskue
> hvordan jeg skal fikse..
>
> Frontend delen i ren html.
>
> <head>
> <script language="javascript" src="ajax.js"></script>
> </head>
>
> <html>
> <input type="text" id="navn1" size="12">
> <input type="button" value="Søg elev" id="button" onClick="doSearch1();">
> <input type="hidden" id="nr" value="1">
> </form>
> <div id="answer1" style="display: inline; font-size: 16px"></div>
> <br>
> <input type="text" id="navn2" size="12">
> <input type="button" value="Søg elev" id="button" onClick="doSearch2();">
> <input type="hidden" id="nr" value="2">
> </form>
> <div id="answer2" style="display: inline; font-size: 16px"></div>
> </html>
>
>
> Og nu kommer javascript delen så (kun det relevante):
>
> function doSearch1(){
> var url = "backend.php?navn=" + document.getElementById('navn1').value;
>
> http.open("GET", url, true);
> http.onreadystatechange = handleHttpResponse1;
> http.send(null);
> }
>
> function handleHttpResponse1(){
> if(http.readyState == 4){
> document.getElementById('answer1').innerHTML = http.responseText;
> }
> }
>
> function doSearch2(){
> var url = "backend.php?navn=" + document.getElementById('navn2').value;
>
> http.open("GET", url, true);
> http.onreadystatechange = handleHttpResponse2;
> http.send(null);
> }
>
> function handleHttpResponse2(){
> if(http.readyState == 4){
> document.getElementById('answer2').innerHTML = http.responseText;
> }
> }
>
>
> Er der ikke en måde man kan få den til at genere doSearch og
> handleHttpResponse selv, eller skal jeg lave 25 sæt af dem, for at få de
> forskellige indputs og outputs?
>
> Mvh
> Morten
>
>
>

Uden at gå i detallier med dit script, og copy paste + tilretning fra din
egen kode, som den er gengivet her.

var disp_ajax = null;

function doSearch( navn_elem, res_disp){
var url = "backend.php?navn=" + document.getElementById( navn_elem).value;
disp_ajax = document.getElementById( res_disp).
http.open("GET", url, true);
http.onreadystatechange = handleHttpResponse;
http.send(null);
}

function handleHttpResponse(){
if(http.readyState == 4){ // bør checke her at disp_ajax faktisk eksisterer
disp_ajax.innerHTML = http.responseText;
}
}


HTML
<input type="text" id="navn1" size="12">
<input type="button" value="Søg elev" id="button" onClick="doSearch(
'navn1', 'answer1');">
<input type="hidden" id="nr" value="1">
<div id="answer1" style="display: inline; font-size: 16px"></div>


Det eneste du så skal passe på er, ikke at starte 2 requests samtidig.
(sæt evt.
http.open("GET", url, false);
i stedet; det giver synkron - også kaldet blocking - kald i stedet, og
scriptet venter til den igangværende request er afsluttet.)
Hvis det skal være muligt at foretage to requests samtidig, skal både http
og disp_ajax elementer være unike.


Birger



Lasse Reichstein Nie~ (19-11-2007)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 19-11-07 17:27

"Birger" <sdc@bbsorensen.com> writes:

> "Mr J.." <Nomail@nomail.dk> skrev i en meddelelse

>> Er der ikke en måde man kan få den til at genere doSearch og
>> handleHttpResponse selv, eller skal jeg lave 25 sæt af dem, for at få de
>> forskellige indputs og outputs?

> Uden at gå i detallier med dit script, og copy paste + tilretning fra din
> egen kode, som den er gengivet her.
>
> var disp_ajax = null;
>
> function doSearch( navn_elem, res_disp){
> var url = "backend.php?navn=" + document.getElementById( navn_elem).value;
> disp_ajax = document.getElementById( res_disp).
> http.open("GET", url, true);
> http.onreadystatechange = handleHttpResponse;
> http.send(null);
> }
>
> function handleHttpResponse(){
> if(http.readyState == 4){ // bør checke her at disp_ajax faktisk eksisterer
> disp_ajax.innerHTML = http.responseText;
> }
> }


Som du selv siger, så er problemet at man ikke kan lave to searches
samtidigt. Det skyldes at der bruges en global variabel (disp_ajax).
Et alternativ der globale variable ville være:

function urlEncode(string) {
return escape(string).replace(/ /g,"+");

function doSearch(queryElemId, displayElemId) {
var queryString = document.getElementById(queryElemId).value;
var url = "backend.php?navn=" + urlEncode(queryString);
var http = createNewHTTP(); // husk at lave en ny hver gang.
http.open("GET", url, true);
http.onreadystatechange = function() {
if (http.readyState == 4) {
var displayElem = document.getElementById(displayElemId)
displayElem.innerHTML = http.responseText;
}
};
http.send();
}

> Hvis det skal være muligt at foretage to requests samtidig, skal både http
> og disp_ajax elementer være unike.

Netop

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Mr J.. (20-11-2007)
Kommentar
Fra : Mr J..


Dato : 20-11-07 15:10

Mange tak Birger :)
Det javascript er lidt ugennemskueligt endnu :)

Mvh
Morten



Birger (20-11-2007)
Kommentar
Fra : Birger


Dato : 20-11-07 20:15

"Mr J.." <Nomail@nomail.dk> skrev i en meddelelse
news:4742eac7$0$90265$14726298@news.sunsite.dk...
> Mange tak Birger :)
> Det javascript er lidt ugennemskueligt endnu :)
>


Hvis du sammenligner med dit eget, er det ellers temmelig meget mage til.
;>)
Forskellen er, at i "min version" overføres information om hvor data skal
hentes og vises, som parametre til funktionen der udfører ajax-requesten:

function doSearch( navn_elem, res_disp){

navn_elem er navnet på det element hvor det navn der skal søges efter
hentes, og
res_disp er navnet på det element der skal vise resultatet.
Det betyder at du kan bruge den samme funktion til alle dine kald - du skal
altså ikke have 25 men kun een.

I linien
var url = "backend.php?navn=" + document.getElementById( navn_elem).value;
er den sidste del - document.getElementById( navn_elem).value - er den der
henter navnet der skal søges efter i databasen.
(
Den bør faktisk pakkes ind i en funktion der inkoder specielle karakter til
det formål. Så den bør hedde :
var url = "backend.php?navn=" + encodeURIcomponent(
document.getElementById( navn_elem).value);
)

Linien
disp_ajax = document.getElementById( res_disp).
finder det element, hvor resultatet skal vises, og det er defineret som en
global variabel
(Se mit oprindelige forslag - i første linie).

I den funktion der kaldes, når requesten er gennemført, sættes indholdet af
dette element, til det der returneres af din backend.php :
function handleHttpResponse(){
if(http.readyState == 4){ // bør checke her at disp_ajax faktisk eksisterer
disp_ajax.innerHTML = http.responseText;
}
}


Ved ikke lige hvordan du har bygget din side op, eller hvorfor du har mere
end een søgelinie.
(Et link måske, så man kan se det?)
Du kan principielt have så mange du vil.

<input type="text" id="navn1" size="12">
<input type="button" value="Søg elev" id="button" onClick="doSearch(
'navn1', 'answer1');">
<div id="answer1" style="display: inline; font-size: 16px"></div>

Det du skal bemærke - og tilpasse -, er knappens
onClick = "doSearch( 'navn1', 'answer1');"
Her skal du naturligvis udskifte 'navn1' og 'answer1' med andre værdier, der
svarer til de ændrede id'er.
Bemærk at navnene skal stå i apostroffer - det er strenge (tekster), og det
skal det være.


Håber det hjælper.
Hvis ikke, så prøv igen.
Jeg svarer gerne på spørgsmål så langt evnerne rækker. ;>)

Birger



Mr J.. (23-11-2007)
Kommentar
Fra : Mr J..


Dato : 23-11-07 08:32

> Håber det hjælper.
> Hvis ikke, så prøv igen.
> Jeg svarer gerne på spørgsmål så langt evnerne rækker. ;>)

Hej Birger

Som altid et super godt svar fra din side af :)
Mange tak, og jo det hjalp :)

Mvh
Morten



Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste