We are currently trying to implement a slider into the e-commerce software Volusion.
We would like to be able to port in several products including their name, price and picture dynamically as we want the information to change if a price changes.
I was on Volusion help chat with several Reps and one told me to use a CSV file, which does us no good due to having to download it every time a product changes. I did some digging of my own and found that Volusion allows us to use a URL to get some XML information back.
If anybody would be able to help being able to parse the information so I can get it setup in the slider I'd be grateful. I have provided the code below.
Thanks!
URL Example:
http://www.companyname.com/net/[email protected]&EncryptedPassword=xxxx&EDI_Name=Generic\Products&SELECT_Columns=p.ProductName,pe.ProductPrice
XML Output Example:
<xmldata>
<Products>
<ProductName>ABC Widget</ProductName>
<ProductPrice>4445545</ProductPrice>
</Products>
<Products>
<ProductName>XYZ Widget</ProductName>
<ProductPrice>99494</ProductPrice>
</Products>
</xmldata>
HTML:
<img class="arrow" src="vspfiles/templates/default/images/arrow-left.png">
<div class="product">
<a href="#"><img src="vspfiles/templates/default/images/product-1.jpg"></a>
<h4>Product Title and description</h4>
<h5>$00.00</h5>
</div>
<div class="product">
<a href="#"><img src="vspfiles/templates/default/images/product-1.jpg"></a>
<h4>Product Title and description</h4>
<h5>$00.00</h5>
</div>
<div class="product">
<a href="#"><img src="vspfiles/templates/default/images/product-1.jpg"></a>
<h4>Product Title and description</h4>
<h5>$00.00</h5>
</div>
<div class="product">
<a href="#"><img src="vspfiles/templates/default/images/product-1.jpg"></a>
<h4>Product Title and description</h4>
<h5>$00.00</h5>
</div>
<img class="arrow" src="vspfiles/templates/default/images/arrow-right.png">
Javascript:
$(document).ready(function(){
$.ajax({
type: "GET",
url: "Insert URL",
dataType: "xml",
success: function (xml) {
$(xml).find('Products').each(function(){
var $p = $(this);
var pId = $p.find('ProductId').text();
var html = 'Testing: ' + pId + '<br />';
$('#output').append($(html));
});
}
});
});