Problems with AJAX XML Request

Question

I’m having a problem I made a Javascript code to display via AJAX an XML with a list: My XML is like this:

<?xml version="1.0" encoding="ISO-8859-1"?>
<telas>
<item>
<title>Lorem ipsum</title>
<title>Dolor sit amet</title>
</item>

<item>
<title>Lorem ipsum dolor</title>
<title>Ipsum dolor sit amet</title>
<title>Ipsum dolor sit amet</title>
</item>
</telas>

I want to list the tag content <item> (XML) and put inside the <li> (in my HTML) tag <title> (XML), but only shows the contents of the first tag title, i need you to show all tags <title> that I have in XML.

I think the problem is that part of my code:

exibir+=tela[valor].getElementsByTagName('title')[0|1].firstChild.nodeValue;

How can I change this to work properly (the one I want)?

Answer 1

If I understand correctly, what you want is to create a list based on XML items? If so, it is possible to do so as follows:

//levando em conta que o XML já esta "parseado" dentro da variável 'xml'
// e sua lista em uma chamada 'ul'

//pega todos os items...
var items = xml.getElementsByTagName("item");

for(var i = 0; i < items.length; i++){ //itera sobre os mesmos
   var item = items[i];
   var li = document.createElement("li"); //cria um LI para cada Item
   ul.appendChild(li); //insere na UL

   var titles = item.getElementsByTagName("title"); //recupera os titles

   for(var j = 0; j < titles.length; j++){
       var title = titles[j]; 
       var span = document.createElement("span"); //aqui criei um span para cada
       li.appendChild(span);  //inseri no LI 
       span.textContent = title.textContent; //e passei o valor do title para o span

   }
}

the result of this algorithm for your XML is

<ul>
   <li>
      <span>Lorem ipsum</span>
      <span>Dolor sit amet</span>
   </li>
   <li>
      <span>Lorem ipsum dolor</span>
      <span>Ipsum dolor sit amet</span>
      <span>Ipsum dolor sit amet</span>
   </li>
</ul>

Answer 2

Follow a script I made for ZIP:

$.getScript("http://www.buscarcep.com.br/?cep="+$("#cep").val()+"&formato=xml&chave=1iyeEHOY7.SVCKZSalTVl5SnTc34470", function(){
    if(resultadoCEP["resultado"] != 0){
        $('#loading').css({display:'none'});
        $('#selectEstado').fadeOut(400);
        $('#inputEstado').fadeIn(600);
        $("#rua").val(unescape(resultadoCEP["tipo_logradouro"])+' '+unescape(resultadoCEP["logradouro"])).prop("readonly", "readonly");
        $("#bairro").val(unescape(resultadoCEP["bairro"])).prop("readonly", "readonly");
        $("#cidade").val(unescape(resultadoCEP["cidade"])).prop("readonly", "readonly");
        $("#estado").val(unescape(resultadoCEP["uf"])).prop("readonly", "readonly");
        $('#numero').focus();
    }else{
        $('#inputEstado').fadeOut(400);
        $('#selectEstado').fadeIn(600);
        $("#rua").removeAttr('readonly').val('').focus();  
        $("#bairro").removeAttr('readonly').val('');  
        $("#cidade").removeAttr('readonly').val('');  
        $("#estado").removeAttr('readonly').val('');
        $('#loading').html('Endereço não encontrado.');
    }  
});

it is necessary to have the jquery included in the page. I believe you can already have a notion.

Answer 3

x = obj.getElementsByTagName('title');
y = document.querySelectorAll('li');
for(i=0;i<title.length){
    li[i].innerHTML = obj[i].firstChild.nodeValue;
}