chat med insertRow

Udskift denne linje:

var newRow = tbl.insertRow(0);

... med:

var newRow = tbl.insertRow(tbl.getElementsByTagName('tr').length);

Og i bunden af funktionen indsættes:

temp = tbl.getElementsByTagName("tr");
temp[temp.length - 1].scrollIntoView();

gider du ikke lige lave hele mit script??

måden den sletter de seneste beskeder på skal vel også laves lidt om?? :)

Det er jo en lille ændring i dit script, som sletter:

    var numMsgs = tbl.getElementsByTagName('tr').length;
    while(numMsgs > 50){
        tbl.deleteRow(0);
        numMsgs--;
    }

jeg kan bare ikke helt få det til at virke... for hver gang jeg opdaterer chatten flytter den om på linjerne???

<script type="text/javascript">
function write_to_chat(a)
{
    var tbl = document.getElementById('chat');
   
    for(i=0; i<a.length; i+=3)
    {
        var newRow = tbl.insertRow(tbl.getElementsByTagName('tr').length);
       
        var newCell = newRow.insertCell(0);
       
        newCell.innerHTML = a[i+1]+'&nbsp;';
        newCell.className = 'chat_timestamp';
       
        var newCell = newRow.insertCell(1);
        if(a[i]) newCell.innerHTML = a[i]+' '+a[i+2];
        else
        {
            newCell.innerHTML = '-- '+a[i+2]+' --';
            newCell.className = 'marked';
        }
    }
   
    var numMsgs = tbl.getElementsByTagName('tr').length;
    while(numMsgs > 50)
    {
        tbl.deleteRow(0);
        numMsgs--;
    }
   
    temp = tbl.getElementsByTagName("tr");
    temp[temp.length - 1].scrollIntoView();
}
</script>

Kan du smide et link?

http://www.elektrobeat.dk/test/chat.php

email: test@test.dk
pass: 123

hmm... havde åbenbart lavet en lille fejl i min sql query :) så det ser ud til at virke nu...

ang. det med scrollIntoView()

kan man ikke gøre sådan at den ikke scroller helt i bund hver gang man scroller lidt op? altså hvis man lige vil scrolle lidt tilbage for at se hvad der er blevet skrevet.. kan man ikke gøre sådan at den kun scroller ned til den sidste linje hvis den allerede er i bund??

hvis du er med på hvad jeg mener?

Prøv:

temp = tbl.getElementsByTagName("tr");
if (tbl.parentElement.scrollTop == tbl.parentElement.scrollHeight - tbl.parentElement.offsetHeight)
  temp[temp.length - 1].scrollIntoView();

Det virker i øvrigt kun i IE, men kan komme til at virke i andre browsere også med et par ændringer.

hvordan ville det så se ud i en mere kompetibel version?? :)

den du skrev synes jeg heller ikke viker i IE??

Prøv at skrive offsetParent i stedet for parentElement de tre steder i scriptet. Måske fikser det IE-problement.

altså sådan?

    temp = tbl.getElementsByTagName("tr");
    if(tbl.offsetParent.scrollTop == tbl.offsetParent.scrollHeight - tbl.offsetParent.offsetHeight)
    temp[temp.length - 1].scrollIntoView();

det virker heller ikke?

Det er ret mystisk, for det virker i mine tests, selvom de dog er udført på et lidt mere simpelt basis. Jeg har jo ikke så gode muligheder for at teste med chat og det hele.

Giver det script, jeg har foreslået, en fejlmelding, eller sker der bare ikke noget?

Hvis sidstnævnte er tilfældet, så prøv at give den div, der omkranser "chat"-tabellen, en id og indsæt derefter følgende linje sidst i din funktion:

alert(tbl.parentElement.id);

Læg mærke til, om funktionen alerter den rigtige id. Husk også at prøve med offsetParent i stedet for parentElement.

http://clark.avansis.dk/temp/chat/

her kan du selv sætte koden ind i chatten ;)

Nu virker det i IE, ser her:

var tbl = document.getElementById('chat');

for(i=0; i<a.length; i+=3)
{
    var newRow = tbl.insertRow(tbl.getElementsByTagName('tr').length);
    var newCell = newRow.insertCell(0);
   
    newCell.innerHTML = a[i+1]+' ';
    newCell.className = 'chat_timestamp';
   
    var newCell = newRow.insertCell(1);
    if(a[i]) newCell.innerHTML = a[i]+' '+a[i+2];
    else
    {
        newCell.innerHTML = '-- '+a[i+2]+' --';
        newCell.className = 'marked';
    }
}

var lines = tbl.getElementsByTagName('tr').length;
while(lines > 50)
{
    tbl.deleteRow(0);
    lines--;
}

lines = tbl.getElementsByTagName('tr');
if (tbl.parentElement.scrollHeight - lines[lines.length - 1].offsetHeight < tbl.parentElement.offsetHeight || tbl.parentElement.scrollTop == tbl.parentElement.scrollHeight - tbl.parentElement.offsetHeight - lines[lines.length - 1].offsetHeight)
  lines[lines.length - 1].scrollIntoView();

En crossbrowser-kode må vente nogle dage.

du er fandme for sej mand!! :D

virker denne version da ikke i andre browsere??

jeg har lige fundet en fejl... hvis du skriver en besked der fylder mere end en linje skal man selv scrolle ned for at læse den :(

Jeg har fundet en lille fejl mere...

Når man logger ind på chatten er der ikke nogen scrollbar ude i siden. Men lige i det der er ved at være så mange beskeder, at den kommer frem, og man skriver en masse beskeder hurtigt efter hinanden. Så den ikke kan nå at opdaterer, scroller den ikke i bund...

Jeg har virkelig dårlige tid i øjeblikket, men jeg skal nok se på det i weekenden.

det er også fair nok :)

Her har jeg lige en lille opsamling på noget der skal rettes, hvis altså det kan lade sig gøre :)

1. Hvis man skriver en besked, som fylder mere end en linje, scroller den kun ned til den øverste linje... Altså man kan ikke se hele teksten og man må selv scrolle ned

2. Hvis beskederne bliver skrevet for hurtigt efter hinanden stopper den helt med at scrolle ned

3. Lige når man logger ind skal den automatisk scrolle i bund

Det er ikke noget der haster med at blive lavet, men ville stadig være fedt nok hvis der heller ikke gik alt for lang tid ;)

Nu er nr. 1 i hvert fald klaret, samtidig med at scriptet nu også virker i Netscape (Opera vil ikke sluge den):

var tbl = document.getElementById('chat');

for(i=0; i<a.length; i+=3)
{
    var newRow = tbl.insertRow(tbl.getElementsByTagName('tr').length);
    var newCell = newRow.insertCell(0);
   
    newCell.innerHTML = a[i+1]+' ';
    newCell.className = 'chat_timestamp';
   
    var newCell = newRow.insertCell(1);
    if(a[i]) newCell.innerHTML = a[i]+' '+a[i+2];
    else
    {
        newCell.innerHTML = '-- '+a[i+2]+' --';
        newCell.className = 'marked';
    }
}

var lines = tbl.getElementsByTagName('tr').length;
while(lines > 50)
{
    tbl.deleteRow(0);
    lines--;
}

lines = tbl.getElementsByTagName('tr');
pe = tbl.parentNode;
pesh = pe.scrollHeight;
pest = pe.scrollTop;
peoh = pe.offsetHeight;
loh = lines[lines.length - 1].offsetHeight;
if (pesh - loh < peoh || pest == pesh - peoh - loh)
  pe.scrollTop = pesh;

Mht. nr. 2, så er det en god idé at huske <html>- og <body>-tags på siden. I body-tagget kan du så skrive:

<body onload="document.getElementById('chat').parentNode.scrollTop = document.getElementById('chat').parentNode.scrollHeight;">

Så burde dokumentet scrolle til bunds.

Uhh... niiice!! Det ser ud til at virke nu :D Mange tak for hjælpen

Lav et svar så du kan få points...

Jeg har et lille problem mere i javascript, og ville høre om du kunne hjælpe?

http://www.elektrobeat.dk/test/debate.php
test@test.dk // 123

Hvordan kan man få den div som flyver over det andet til at have den rigtige position fra starten? Den hopper først ned på plads når hele siden er loaded!

Jeg skal nok oprette et nyt spm med 60 points hvis du kan lave det :)

Jeg kan ikke få linket til at virke.

det er fordi jeg har ændret det :)

http://www.elektrobeat.dk/tst/debate.php

der er stadig lidt problemer med chatten :( nogle gange scroller den ikke ned :'(

- specielt hvis der kommer mange beskeder på en gang...

Jeg rodede lige mine gamle mails igennem og fandt dette uafsluttede spørgsmål. Jeg har desværre ikke tid til at rette det til, og for at være helt ærlig, tror jeg ikke, den teknik, som din chat gør brug af, er særlig optimal. Jeg kan anbefale dig at søge efter "Olebole chat" her på Eksperten. Det er en gennemtestet chat, som en af Ekspertens legender, Olebole, har kreeret og lagt ud til frit brug.

Håber ikke min passivitet har betydet for mange hovedbrud! :)

jeg er også gået lidt fra at chatten skal skrive ned af og har lavet det om som det var før... :)

det er faktisk en chat olebole har lavet, men har bare ændret lidt i den ;)

jeg ved så bare ikke om han har udviklet en nyere og forbedret version af den...

du får points alligevel ;)

Tak, men det behøvede du ikke. :)