Well, it's not very clear how you want things to happen so it's difficult to give you advice to whether consuming the XML Feed server-side or client side.
Besides, you haven't explained how you can "obtain" the xml feed. Is it a webservice that requires authentication? What type of request is it? Or it's simply a file residing in somewhere on the interwebs? Or is it available locally?
I'm going to assume the feed you're consuming does not require complicated requests or authentication.
So here's an AJAX example using with jQuery and a GET request
XML Example (productsfeed.xml)
<products>
<product id="prod1" name="iMac" price="2000" vendor="Apple">
<stock>10</stock>
</product>
<product id="prod2" name="iPad" price="500" vendor="Apple">
<stock>50</stock>
</product>
<product id="prod3" name="Galaxy S3" price="500" vendor="Samsung">
<stock>100</stock>
</product>
</products>
Example HTML with ajax call and a dropdown with products.
<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$.ajax({
url: 'http://myhost.com/webservice', // Url to the webservice or feed
// Here goes all the "shenanigans" regarding the web service, like
// request type, headers to send, etc..
success: function(xml) {
$(xml).find('product').each(function(){
var id = $(this).attr('id');
var name = $(this).attr('name');
var price = $(this).attr('price');
var vendor = $(this).attr('vendor');
var stock = $(this).find('stock').text();
var $selectItem = $('<option></option>');
$selectItem.attr('value', id);
$selectItem.attr('data-id', id);
$selectItem.attr('data-price', price);
$selectItem.attr('data-vendor', vendor);
$selectItem.attr('data-stock', stock);
$selectItem.html(name);
$selectItem.appendTo('#plist');
});
}
});
});
</script>
</head>
<body>
<div><span>Product List</span></div>
<div id="plist-wrapper">
<select id="plist">
</select>
</div>
</body>
</html>
Now with PHP
If it's a webservice you can use cURL
$url = 'http://myhost.com/webservice';
// HTTP Headers to send to the webservice
// specific to the webservice you're consuming
$headers = array();
$ch = curl_init();
// curl_setopt to set the options
// see http://www.php.net/manual/en/function.curl-setopt.php
curl_setopt($ch, CURLOPT_URL, $url);
//headers if needed
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
// Send the request and check the response
if (($result = curl_exec($ch)) === FALSE) {
echo 'Failed with' . curl_error($ch) . '<br />';
} else {
echo "Success!<br />\n";
}
curl_close($ch);
If it's not a webservice (just a xml file) you can use file_get_contents
$result = file_get_contents('http://myhost.com/productsfeed.xml');
To parse the xml and show the dropdown select menu
$xml = new DOMDocument();
$xml->loadXML($result);
$html = new DOMDocument();
$htmlSource =
'<html>
<head></head>
<body>
<div><span>Product List</span></div>
<div id="plist-wrapper">
<select id="plist"></select>
</div>
</body>
</html>';
$html->loadHTML($htmlSource);
$selectList = $html->getElementsByTagName('select')->item(0);
$optionItem = $html->createElement('option');
$prodNodeList = $xml->getElementsByTagName('product');
foreach ($prodNodeList as $prodNode) {
$id = $prodNode->getAttribute('id');
$name = $prodNode->getAttribute('name');
$price = $prodNode->getAttribute('price');
$vendor = $prodNode->getAttribute('vendor');
$option = clone $optionItem;
$option->setAttribute('value', $id);
$option->setAttribute('data-id', $id);
$option->setAttribute('data-price', $price);
$option->setAttribute('data-vendor', $vendor);
$option->nodeValue = $name;
$selectList->appendChild($option);
}
print $html->saveHTML();