getElementbyTAG Opcje

[trylas]

Cześć, chciałbym za pomocą JS odczytac dane z xml. Dane sa zaciagniete i sformatowane przez xslt ->wyswietlane sa linki z imienia i nazwiska nastepnie klikajac na Kowalskiego do JS przekazana jest zmienna Kowalski i jesli Kowalski pasuje z

[PHP] pobierz, plaintext 
xmlDocument.getElementsByTagName("Nazwisko")
[PHP] pobierz, plaintext 

zaciagam cala Persone.

Jak porownac zmienna z linka i na tej podstawie wyswietlic z calego zbioru dane wlasnie Kowalskiego?jak mozna po kolei to uzyskac --> licze tylko na podpowiedz kolejnych kroków.THNX

[XML] pobierz, plaintext 
<DaneOsobowe>
<Persona>
    <Imie>Scottpp</Imie>
    <DrugieImie>Tomasz</DrugieImie>
    <Nazwisko>Kowalski</Nazwisko>
    <DataUrodzenia>25.02.1991</DataUrodzenia>
    <Pesel>91022515556</Pesel>
    <Email>scotty@isp.net</Email>
    <Telefon>58 558 55 25</Telefon>
    <TelefonKomorkowy>691 256 258</TelefonKomorkowy>
    <Adres>
    <Ulica>Rzeznicka</Ulica>
    <NrDomu>25</NrDomu>
    <NrLokalu>54</NrLokalu>
    <Miasto>Gdańsk</Miasto>
    <Wojewodztwo>Pomorskie</Wojewodztwo>
    <Kod>80-001</Kod>
    </Adres>
</Persona>
<Persona>
    <Imie>Jack</Imie>
    <DrugieImie>Denzel</DrugieImie>
    <Nazwisko>Spicy</Nazwisko>
    <DataUrodzenia>25.02.1992</DataUrodzenia>
    <Pesel>92022515556</Pesel>
    <Email>spicy@isp.net</Email>
    <Telefon>58 558 55 25</Telefon>
    <TelefonKomorkowy>691 256 258</TelefonKomorkowy>
    <Adres>
    <Ulica>Dluga</Ulica>
    <NrDomu>2</NrDomu>
    <NrLokalu>5</NrLokalu>
    <Miasto>Gdansk</Miasto>
    <Wojewodztwo>Pomorskie</Wojewodztwo>
    <Kod>80-001</Kod>
    </Adres>
</Persona>
</DaneOsobowe>
[XML] pobierz, plaintext 

[zegarek84]

całe dane masz w tagu "Persona" - więc możesz pobrać referencję do tych elementów np. przez .getElementsByTagName("Persona") - gdy już masz "tablicę"/listę obiektów możesz to przelecieć w pętli i z danego elementu zbioru pobierać nazwisko i porównywać - jeśli nazwisko pasuje zwracasz zbiór - czyli na wzór:
[pętla:]
.getElementsByTagName("Persona")[i].getElementsByTagName("Nazwisko")[0].innerHTML == sNazwisko;
[/pętla]

oczywiście możesz też przelecieć przez nazwiska tak jak zaczynałeś i będziesz miał które to z kolei nazwisko w zmiennej np. i i potem cały zbiór pobierzesz przez:
.getElementsByTagName("Persona")[i]

zamiast innerHTML ja bym użył do porównywania .firstChild.nodeValue lub textContent z połączeniem innerText...

[trylas]

oki tak to sobie napisałem działa w FF ale w ie nie działa, nie wiem o co chodzi... a do tego debuggowanie w ie to jakies nieporozumienie... a tak wogole to jakich narzedzi uzywac dla ie do debuggowania? zainstalowalem juz debugBar i companionJS ale jakos nie wyswietla mi bledow co do tego skryptu... pozdrawiam

[PHP] pobierz, plaintext 
function displayPersona(Nazwisko)
{
    var PersonaNodes = xmlDocument.getElementsByTagName("Persona");
 
    for(i=0; i<PersonaNodes.length; i++)
    {
            var  NameNodes = xmlDocument.getElementsByTagName("Persona")[i].getElementsByTagName("Nazwisko")[0];
 
            var currentNode = NameNodes.firstChild.nodeValue;
 
            if(Nazwisko == currentNode)
            {
            var newEl = document.createElement('div');
            newEl.id = 'newText';
            document.getElementById('newText').innerHTML = '';
 
            tabela=document.createElement('table');
            tabela.border='1';
            tabela.id='Persona';
 
            /* fragment niezbędny dla IE */
	        tbody=document.createElement('tbody');
	        tabela.appendChild(tbody);
	     /* koniec */
 
            newTab = document.getElementById('newText');
            newTab.appendChild(tabela);
 
 
            for (j=0; j<PersonaNodes[i].childNodes.length; j++)
            {
                var Dane = PersonaNodes[i].childNodes[j];
 
                if (Dane.nodeType == 1)
                {
 
                var newTR = document.createElement('tr');
                var newTD = document.createElement('td');
                var newTDa = document.createElement('td');
 
 
 
 
                var newTxTit = document.createTextNode(Dane.nodeName);
                var newTx = document.createTextNode(Dane.firstChild.nodeValue);
                var newRow = document.getElementById('Persona');
 
                newTDa.appendChild(newTxTit);
                newTD.appendChild(newTx);
                newTR.appendChild(newTDa);
                newTR.appendChild(newTD);
 
 
                tbody.appendChild(newTR);
                newRow.appendChild(tbody);
                }
            }
            }
    }
}
[PHP] pobierz, plaintext 

[zegarek84]

najlepiej przykład live to może przełączę na windows'a którego z pół roku nie uruchamiałem ^^... i takie uwagi - skoro masz referencje do elementów w zmiennych to dlaczego je potem szukasz w drzewie DOM?? i kolejna uwaga:

Kod

            var newEl = document.createElement('div');
            newEl.id = 'newText';
            document.getElementById('newText').innerHTML = '';

jak Ci to ma znaleźć w drzewie dom jak tego jeszcze nie dodałeś do drzewa??...

a i jeszcze jedno - podałeś jedną funkcję bez przykładu live - najlepiej gdzieś to na serwie dawać to prędzej ktoś może łatwo pomóc - gdyż jeszcze może Ci się wysypywać na innych funkcjach - wspomniałeś coś o tym, że działa w FF a w IE nie - a co np. z operą - może próbowałeś żywcem przenieść elementy - bywają kwiatki np. z appendChild jeśli ownerDocument się różni między elementami - z kolei nie wszędzie jest importNode ^^ - do poczytania np. Cross-Browser Scripting with importNode() - choć jakbym potrzebował to bym to troszku inaczej zrobił... niestety tak jest z przeglądarkami - nie każda jest taka sama i nie każda dokładnie implementuje jak się to mówi "standardy" - choć w sumie też i one wytaczają standardy - na samym początku gdy było prawie tylko IE to wtedy ono wytyczało standardy, potem przyszedł czas na inne przeglądarki... jesli robi się coś bardziej skomplikowanego to i google chrome potrafi wkurzać ^^

[trylas]

Co do tego fragmentu kodu napisałem to w ten sposob poniewaz chcialem sprawdzic czy istnieje juz id=newText jesli tak to nalezy tego diva wyczyscic i dopiero dopisac tam nowe dane

[PHP] pobierz, plaintext 
var newEl = document.createElement('div');
newEl.id = 'newText';
document.getElementById('newText').innerHTML = '';
[PHP] pobierz, plaintext 

jesli chodzi o referencje w zmiennych to moze krotka podpowiedz - lub wskazowka jak Ty bys to rozwiazal.
na zywo tutaj
dzieki i pozdrawiam

[zegarek84]

masz źle zdefiniowany activex...

sprawdziłem kod i na lokalu i na Twojej stronie - kod który Ci podam będzie działał...

co do referencji to przedewszystkim miałem na myśli, że w pętli nie potrzebnie wyszukujesz po raz kolejny elementy które masz w zmiennych - np w pętli for - tam podstawiłem referencje do tabeli... - ps. można by to lepiej zrobić asynchornicznie ale to już sam sobie w ramach ćwiczeń przepisz ;]

[JAVASCRIPT] pobierz, plaintext 
function createDocument(file) {  
 var xmlDoc;  
 var moz = document.implementation && document.implementation.createDocument && true;  
 var ie = !!window.ActiveXObject;  
 
 if (moz) {  
   xmlDoc = document.implementation.createDocument("", "", null)  
   xmlDoc.load(file);
 } else if (ie) {
   xmlDoc = new ActiveXObject("Microsoft.XMLDOM");  
   xmlDoc.async = false;  
   xmlDoc.load(file);
   while(xmlDoc.readyState != 4) {};  
 }  
   return xmlDoc
}
 
var xmlDocument = createDocument("dane_osobowe.xml");
 
function displayPersona(Nazwisko)
{
    var PersonaNodes = xmlDocument.getElementsByTagName("Persona");
 
    for(i=0; i<PersonaNodes.length; i++)
    {
            var  NameNodes = xmlDocument.getElementsByTagName("Persona")[i].getElementsByTagName("Nazwisko")[0];
 
            var currentNode = NameNodes.firstChild.nodeValue;
 
            if(Nazwisko == currentNode)
            {
            var newEl = document.createElement('div');
            newEl.id = 'newText';
 
            document.getElementById('newText').innerHTML = '';
 
            tabela=document.createElement('table');
            tabela.border='1';
 
 
            /* fragment niezbędny dla IE */
	        tbody=document.createElement('tbody');
	        tabela.appendChild(tbody);
	     /* koniec */
 
            newTab = document.getElementById('newText');
            newTab.appendChild(tabela);
 
 
            for (j=0; j<PersonaNodes[i].childNodes.length; j++)
            {
                var Dane = PersonaNodes[i].childNodes[j];
 
                if (Dane.nodeType == 1)
                {
 
                var newTR = document.createElement('tr');
                var newTD = document.createElement('td');
                var newTDa = document.createElement('td');
 
 
 
 
                var newTxTit = document.createTextNode(Dane.nodeName);
                var newTx = document.createTextNode(Dane.firstChild.nodeValue);
 
 
                newTDa.appendChild(newTxTit);
                newTD.appendChild(newTx);
                newTR.appendChild(newTDa);
                newTR.appendChild(newTD);
 
 
                tbody.appendChild(newTR);
                tabela.appendChild(tbody);
                }
            }
            }
    }
}
[JAVASCRIPT] pobierz, plaintext 

[edit]
najlepiej to w ramach ćwiczeń zmodyfikuj sobie kod na ajax'a... trzymaj linki:
http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp
http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp
http://www.w3schools.com/ajax/ajax_xmlhttp...st_response.asp
http://www.w3schools.com/ajax/ajax_xmlhttp...statechange.asp

Ten post edytował zegarek84 19.02.2011, 17:20:28

[trylas]

zrobione wg async thnx z profesjonalne wskazowki i rozwiazanie problemu.. pozdrawiam