Busque un archivo XML y muestre los resultados con javascript

I have been searching everywhere for the last 3 hours and I couldn't find anything that could help me. I'm very sorry if there are any answer around but I just couldn't get to it.

So I have this xml file eg:

<entry>
    <title>The Title</title>
    <description>Description here</description>
</entry>

So the thing I'd love to do is to have an html with a search form in it and then based on the search term display all the results within the same page (empty div for example) that matches that term.

¿Sería eso posible?

MANY thanks in advance for anyone that can help me on this!

preguntado el 25 de agosto de 12 a las 00:08

1 Respuestas

I was curios about this, and none answered so I tried some things and tuns out best and easy way to do this is with jQuery

prueba.xml

<item>
    <entry>
        <title>The Title</title>
        <description>Description here</description>
    </entry>

    <entry>
        <title>The Title 2 </title>
        <description>Description here second</description>
    </entry>
</item>

index.html

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="text" id="search"  autocomplete="off" />
<p id="output"></p>

<script type="text/javascript">
$(document).ready(function(){
    $('#search').on('keyup', function(){
        $.ajax({
            type: "GET",
            url: "test.xml",
            dataType: "xml",
            success: parseXML
        });
    });
});
function parseXML(xml){
    var searchFor = $('#search').val();
    var reg = new RegExp(searchFor, "i");
    $(xml).find('entry').each(function(){
        var title = $(this).find('title').text();
        var titleSearch = title.search(reg);
        var desc = $(this).find('description').text();
        var descSearch = desc.search(reg);
        $('#output').empty();
        if(titleSearch > -1){
            $('#output').append('Found <i>'+searchFor+'<\/i> in title: '+title.replace(reg, '<b>'+searchFor+'</b>')+'<br \/>');
        }
        if(descSearch > -1){
            $('#output').append('Found <i>'+searchFor+'<\/i> in description: '+desc.replace(reg, '<b>'+searchFor+'</b>')+'<br \/>');
        }
    });    
}
</script>
</body>
</html>

Respondido 25 ago 12, 02:08

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.