Jquery: Mapping XML Nodes to HTML ID elements

Question

never easy to encapsulate what to say in the title... but here we go...

I realise I am probably seeing straight past the obvious, and possibly built in function of JQuery.

What I am trying to do is:

1. Have an XML file (locally or via server) contain nodes which happen to have their node names i.e. as ID names of say a textbox in HTML i.e.

2. I want to then via the JQuery AJAX call, parse the XML and map the values of the nodes to the value of the HTML ID elements of the same node name...

I realise straight away there are a) probably plugins, b) maybe better concepts, but I only need to map to basic HTML elements.. and in fact I could technically have some more advanced features to populate say combo boxes, radio buttons etc....

Just any ideas of a path to follow? or if there is a simple JQuery Plugin to do this?

P.S: I wasn't into templates as such, because even though I realise the power of say jTemplates, I don't really need anything as complex/flexible as that...

Thanks in advance!!

Answer 1

Try this:

$.get ('/path/to/xml', function (data)
{
    $(data).children ().each (function ()
    {
        $('#' + this.nodeName).val ($(this).text());
    });
})

Assumes only 1 level of nesting in the XML.